/* ==== Button ==== */
.gz-btn{
  --_bg: var(--honey-600); --_fg: #fff; --_bd: transparent; --_bgh: var(--honey-700);
  display:inline-flex; align-items:center; justify-content:center; gap:.6em;
  font-family:var(--font-body); font-weight:600; line-height:1;
  letter-spacing:.005em; text-decoration:none; white-space:nowrap;
  border:1.5px solid var(--_bd); background:var(--_bg); color:var(--_fg);
  border-radius:var(--radius-pill); cursor:pointer;
  transition: background var(--dur-base) var(--ease-calm),
              transform var(--dur-fast) var(--ease-calm),
              box-shadow var(--dur-base) var(--ease-calm),
              border-color var(--dur-base) var(--ease-calm);
}
.gz-btn:hover{ background:var(--_bgh); }
.gz-btn:active{ transform:translateY(1px); }
.gz-btn:focus-visible{ outline:none; box-shadow:var(--shadow-focus); }
.gz-btn[disabled]{ opacity:.45; pointer-events:none; }
.gz-btn .gz-btn__ico{ display:inline-flex; }
.gz-btn .gz-btn__ico svg{ width:1.15em; height:1.15em; display:block; }

/* sizes */
.gz-btn--sm{ font-size:var(--text-sm); padding:.55em 1.1em; }
.gz-btn--md{ font-size:var(--text-base); padding:.78em 1.5em; }
.gz-btn--lg{ font-size:var(--text-md); padding:.95em 1.9em; }

/* variants */
.gz-btn--primary{ --_bg:var(--honey-600); --_bgh:var(--honey-700); --_fg:#fff; box-shadow:var(--shadow-sm); }
.gz-btn--forest{ --_bg:var(--bosque-600); --_bgh:var(--bosque-700); --_fg:var(--crema-100); box-shadow:var(--shadow-sm); }
.gz-btn--wine{ --_bg:var(--vino-600); --_bgh:var(--vino-700); --_fg:var(--crema-100); box-shadow:var(--shadow-sm); }
.gz-btn--outline{ --_bg:transparent; --_bgh:var(--honey-100); --_fg:var(--bosque-700); --_bd:var(--bosque-600); }
.gz-btn--ghost{ --_bg:transparent; --_bgh:var(--crema-200); --_fg:var(--carbon-700); --_bd:transparent; }
.gz-btn--block{ width:100%; }

/* ==== Eyebrow ==== */
.gz-eyebrow{
  display:inline-flex; align-items:center; gap:.6em;
  font-family:var(--font-body); font-size:var(--text-xs); font-weight:600;
  letter-spacing:var(--tracking-wider); text-transform:uppercase;
  color:var(--text-primary); margin:0;
}
.gz-eyebrow--lima{ color:var(--oliva-600); }
.gz-eyebrow--honey{ color:var(--honey-700); }
.gz-eyebrow--wine{ color:var(--vino-600); }
.gz-eyebrow--muted{ color:var(--carbon-500); }
.gz-eyebrow__mark{ width:1.6em; height:1px; background:currentColor; opacity:.55; }
.gz-eyebrow__dot{ width:.4em; height:.4em; border-radius:50%; background:currentColor; }

/* ==== Tag ==== */
.gz-tag{
  display:inline-flex; align-items:center; gap:.5em;
  font-family:var(--font-body); font-size:var(--text-xs); font-weight:600;
  letter-spacing:.02em; padding:.42em .85em; border-radius:var(--radius-pill);
  line-height:1; white-space:nowrap;
}
.gz-tag--outline{ background:transparent !important; box-shadow:inset 0 0 0 1.5px currentColor; }
.gz-tag__dot{ width:.5em; height:.5em; border-radius:50%; background:currentColor; }

/* ==== Badge ==== */
.gz-badge{
  display:inline-flex; align-items:center; gap:.4em;
  font-family:var(--font-body); font-size:var(--text-2xs); font-weight:700;
  letter-spacing:.06em; text-transform:uppercase;
  padding:.32em .6em; border-radius:var(--radius-sm); line-height:1;
}
.gz-badge--dotonly{ padding:0; width:.6em; height:.6em; border-radius:50%; }

/* ==== Input ==== */
.gz-field{ display:flex; flex-direction:column; gap:.4rem; font-family:var(--font-body); }
.gz-field__label{ font-size:var(--text-sm); font-weight:600; color:var(--text-body); letter-spacing:.005em; }
.gz-field__label .gz-field__opt{ color:var(--text-subtle); font-weight:400; }
.gz-field__wrap{ position:relative; display:flex; align-items:center; }
.gz-field__lead{ position:absolute; left:.95rem; display:inline-flex; color:var(--carbon-300); pointer-events:none; }
.gz-field__lead svg{ width:1.1em; height:1.1em; display:block; }
.gz-input{
  width:100%; font-family:var(--font-body); font-size:var(--text-base); color:var(--text-strong);
  background:var(--surface-raised); border:1.5px solid var(--border-subtle);
  border-radius:var(--radius-md); padding:.78em 1em; line-height:1.3;
  transition: border-color var(--dur-base) var(--ease-calm), box-shadow var(--dur-base) var(--ease-calm), background var(--dur-base) var(--ease-calm);
}
.gz-input::placeholder{ color:var(--carbon-300); }
.gz-input--lead{ padding-left:2.6em; }
.gz-input:hover{ border-color:var(--border-strong); }
.gz-input:focus{ outline:none; border-color:var(--honey-600); box-shadow:var(--shadow-focus); background:var(--marfil-50); }
.gz-field--error .gz-input{ border-color:var(--terracota-500); }
.gz-field--error .gz-input:focus{ box-shadow:0 0 0 3px color-mix(in oklab, var(--terracota-500) 35%, transparent); }
.gz-field__help{ font-size:var(--text-xs); color:var(--text-subtle); letter-spacing:.01em; }
.gz-field--error .gz-field__help{ color:var(--terracota-600); }
textarea.gz-input{ resize:vertical; min-height:6.5rem; line-height:var(--leading-normal); }

/* ==== ExperienceCard ==== */
.gz-xcard{
  display:flex; flex-direction:column; overflow:hidden;
  background:var(--surface-card); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-sm); border:1px solid var(--border-subtle);
  text-decoration:none; color:inherit;
  transition: transform var(--dur-base) var(--ease-calm),
              box-shadow var(--dur-base) var(--ease-calm);
}
a.gz-xcard:hover{ transform:translateY(var(--hover-lift)); box-shadow:var(--shadow-lg); }
.gz-xcard__media{ position:relative; aspect-ratio:4/3; overflow:hidden; background:var(--crema-200); }
.gz-xcard__media img{ width:100%; height:100%; object-fit:cover; display:block;
  transition: transform var(--dur-reveal) var(--ease-river); }
a.gz-xcard:hover .gz-xcard__media img{ transform:scale(1.04); }
.gz-xcard__tag{ position:absolute; top:.9rem; left:.9rem; }
.gz-xcard__body{ padding:var(--space-5) var(--space-5) var(--space-5); display:flex; flex-direction:column; gap:.5rem; flex:1; }
.gz-xcard__title{ font-family:var(--font-display); font-weight:600; font-size:var(--text-xl);
  line-height:var(--leading-snug); color:var(--text-strong); margin:.1rem 0 0; letter-spacing:var(--tracking-snug); }
.gz-xcard__desc{ font-size:var(--text-sm); color:var(--text-muted); line-height:var(--leading-relaxed); margin:0; }
.gz-xcard__foot{ display:flex; align-items:baseline; justify-content:space-between; gap:1rem;
  margin-top:auto; padding-top:var(--space-4); }
.gz-xcard__meta{ font-size:var(--text-xs); color:var(--text-subtle); letter-spacing:.02em; }
.gz-xcard__price{ font-family:var(--font-display); font-size:var(--text-lg); color:var(--text-brand); font-weight:600; }
.gz-xcard__price small{ font-family:var(--font-body); font-size:var(--text-2xs); color:var(--text-subtle); font-weight:500; letter-spacing:.04em; }

/* ==== Quote ==== */
.gz-quote{ display:block; margin:0; padding:0; max-width:34ch; }
.gz-quote--center{ text-align:center; margin-inline:auto; }
.gz-quote__rule{ width:2.4rem; height:2px; background:var(--honey-600); border-radius:2px; margin-bottom:var(--space-5); }
.gz-quote--center .gz-quote__rule{ margin-inline:auto; }
.gz-quote__text{ font-family:var(--font-display); font-weight:400;
  font-size:var(--text-2xl); line-height:var(--leading-snug); letter-spacing:var(--tracking-snug);
  color:var(--text-strong); font-style:italic; margin:0; text-wrap:balance;
  font-variation-settings:'SOFT' 40, 'WONK' 1; }
.gz-quote--lg .gz-quote__text{ font-size:var(--text-3xl); }
.gz-quote__cite{ display:flex; flex-direction:column; gap:.1rem; margin-top:var(--space-5);
  font-style:normal; }
.gz-quote__name{ font-family:var(--font-body); font-weight:600; font-size:var(--text-sm); color:var(--text-body); letter-spacing:.01em; }
.gz-quote__role{ font-family:var(--font-body); font-size:var(--text-xs); color:var(--text-subtle); letter-spacing:.04em; }

/* ==== Tonos de Tag (paletas SENSE/TONE de Tag.jsx como clases) ==== */
.gz-tag--vista  { background: var(--bosque-100);    color: var(--bosque-700); }
.gz-tag--olfato { background: var(--oliva-200);     color: var(--oliva-700); }
.gz-tag--gusto  { background: var(--vino-200);      color: var(--vino-700); }
.gz-tag--tacto  { background: var(--terracota-100); color: var(--terracota-700); }
.gz-tag--honey  { background: var(--honey-100);     color: var(--honey-700); }
.gz-tag--forest { background: var(--bosque-100);    color: var(--bosque-700); }
.gz-tag--olive  { background: var(--oliva-200);     color: var(--oliva-700); }
.gz-tag--wine   { background: var(--vino-200);      color: var(--vino-700); }
.gz-tag--earth  { background: var(--terracota-100); color: var(--terracota-700); }
.gz-tag--neutral{ background: var(--crema-200);     color: var(--carbon-700); }

/* ==== Tonos de Badge (TONE de Badge.jsx) ==== */
.gz-badge--honey  { background: var(--honey-600);     color: #fff; }
.gz-badge--forest { background: var(--bosque-600);    color: var(--crema-100); }
.gz-badge--wine   { background: var(--vino-600);      color: var(--crema-100); }
.gz-badge--earth  { background: var(--terracota-500); color: #fff; }
.gz-badge--soft   { background: var(--honey-100);     color: var(--honey-700); }
.gz-badge--neutral{ background: var(--crema-200);     color: var(--carbon-700); }

/* ==== Tag de sentido sobre la foto (ExperienceCard.jsx inline) ==== */
.gz-xcard__tag.gz-tag { background: var(--marfil-50); color: var(--bosque-700); font-weight: 600;
  font-size: var(--text-xs); padding: .42em .85em; border-radius: var(--radius-pill);
  display: inline-flex; gap: .5em; align-items: center; box-shadow: var(--shadow-xs); }
