/* 착한전화 public site — TWC-inspired design system */

:root {
  --gp-primary: #0066ff;
  --gp-primary-dark: #0052cc;
  --gp-primary-light: #e8f1ff;
  --gp-accent: #1a73e8;
  --gp-navy: #0a1628;
  --gp-navy-mid: #152238;
  --gp-text: #1a1a2e;
  --gp-text-muted: #5a6478;
  --gp-text-light: #8b95a8;
  --gp-surface: #f5f7fb;
  --gp-surface-white: #ffffff;
  --gp-border: #e4e9f2;
  --gp-radius: 16px;
  --gp-radius-lg: 24px;
  --gp-shadow: 0 8px 32px rgba(10, 22, 40, 0.06);
  --gp-shadow-lg: 0 20px 48px rgba(10, 22, 40, 0.1);

  /* Typography scale — gp-compare section as reference */
  --gp-type-label-size: 0.9375rem;
  --gp-type-label-weight: 600;
  --gp-type-title-size: clamp(1.75rem, 3.2vw, 2.375rem);
  --gp-type-title-weight: 800;
  --gp-type-title-lh: 1.3;
  --gp-type-title-tracking: -0.03em;
  --gp-type-lead-size: 1.125rem;
  --gp-type-lead-lh: 1.55;
  --gp-type-body-size: 1.0625rem;
  --gp-type-body-lh: 1.65;
  --gp-type-card-title-size: clamp(1.25rem, 2vw, 1.5rem);
  --gp-type-card-title-weight: 700;
  --gp-type-card-title-lh: 1.4;
  --gp-type-summary-size: 1.125rem;
}

/* ── Base ── */

body {
  font-family: "Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  color: var(--gp-text);
  background: var(--gp-surface-white);
}

.text-primary {
  color: var(--gp-primary) !important;
}

.btn-primary {
  background-color: var(--gp-primary);
  border-color: var(--gp-primary);
  border-radius: 8px;
  font-weight: 600;
}

.btn-primary:hover {
  background-color: var(--gp-primary-dark);
  border-color: var(--gp-primary-dark);
}

.btn-outline-primary {
  color: var(--gp-primary);
  border-color: var(--gp-primary);
  border-radius: 8px;
  font-weight: 600;
}

.btn-outline-primary:hover {
  background-color: var(--gp-primary);
  border-color: var(--gp-primary);
}

/* ── Navbar ── */

.gp-navbar,
.navbar {
  padding: 1rem 0;
  background: rgba(255, 255, 255, 0.95) !important;
  backdrop-filter: blur(12px);
  box-shadow: 0 1px 0 var(--gp-border);
  border-bottom: none !important;
}

.navbar-brand {
  font-size: 1.375rem;
  font-weight: 800;
  letter-spacing: -0.02em;
}

.navbar-nav .nav-link {
  color: var(--gp-text);
  font-weight: 500;
  padding: 0.5rem 1rem !important;
}

.navbar-nav .nav-link.active {
  color: var(--gp-primary) !important;
}

/* ── Shared buttons ── */

.gp-btn {
  font-weight: 600;
  border-radius: 10px;
  padding: 0.75rem 1.5rem;
  transition: transform 0.2s, box-shadow 0.2s, background 0.2s;
}

.gp-btn--primary {
  background: var(--gp-primary);
  color: #fff;
  border: none;
}

.gp-btn--primary:hover {
  background: var(--gp-primary-dark);
  color: #fff;
  transform: translateY(-1px);
  box-shadow: 0 8px 20px rgba(0, 102, 255, 0.25);
}

.gp-btn--white {
  background: #fff;
  color: var(--gp-text);
  border: none;
}

.gp-btn--white:hover {
  background: #f5f7fb;
  color: var(--gp-text);
  transform: translateY(-1px);
}

.gp-btn--outline {
  background: transparent;
  color: #fff;
  border: 1.5px solid rgba(255, 255, 255, 0.45);
}

.gp-btn--outline:hover {
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  border-color: rgba(255, 255, 255, 0.7);
}

.gp-btn--outline-dark {
  background: transparent;
  color: var(--gp-text);
  border: 1.5px solid var(--gp-border);
}

.gp-btn--outline-dark:hover {
  background: var(--gp-surface);
  color: var(--gp-primary);
  border-color: var(--gp-primary);
}

.gp-btn--accent {
  background: var(--gp-accent);
  color: #fff;
  border: none;
}

.gp-btn--accent:hover {
  background: #1557b0;
  color: #fff;
}

/* ── Typography helpers ── */

.gp-text-gradient {
  background: linear-gradient(135deg, #4d9fff 0%, #0066ff 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
}

.gp-section-label {
  font-size: var(--gp-type-label-size);
  font-weight: var(--gp-type-label-weight);
  color: var(--gp-primary);
  margin-bottom: 0.625rem;
}

.gp-section-label--center {
  text-align: center;
}

.gp-section-title {
  font-size: var(--gp-type-title-size);
  font-weight: var(--gp-type-title-weight);
  line-height: var(--gp-type-title-lh);
  letter-spacing: var(--gp-type-title-tracking);
  color: var(--gp-navy);
  margin-bottom: 0.625rem;
}

.gp-section-title--center {
  text-align: center;
}

.gp-section-desc {
  font-size: var(--gp-type-lead-size);
  line-height: var(--gp-type-lead-lh);
  color: var(--gp-text-muted);
  margin-bottom: 1.5rem;
}

.gp-section-desc--center {
  text-align: center;
}

.gp-section-header {
  margin-bottom: 3rem;
}

.gp-link-more {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--gp-primary);
  text-decoration: none;
}

.gp-link-more:hover {
  color: var(--gp-primary-dark);
}

/* ── Hero ── */

.gp-hero {
  position: relative;
  background: var(--gp-navy);
  color: #fff;
  padding: 5rem 0 5.5rem;
  overflow: hidden;
}

.gp-hero__bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse 70% 60% at 90% 20%, rgba(0, 102, 255, 0.18) 0%, transparent 60%),
    radial-gradient(ellipse 50% 50% at 10% 80%, rgba(77, 159, 255, 0.08) 0%, transparent 50%),
    linear-gradient(180deg, var(--gp-navy) 0%, var(--gp-navy-mid) 100%);
}

.gp-hero__container {
  position: relative;
  z-index: 1;
}

.gp-hero__eyebrow {
  font-size: 0.9375rem;
  color: rgba(255, 255, 255, 0.65);
  margin-bottom: 1.25rem;
}

.gp-hero__title {
  font-size: clamp(2.25rem, 5vw, 3.25rem);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: -0.03em;
  margin-bottom: 1.5rem;
}

.gp-hero__tags {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem 0.75rem;
  font-size: 0.9375rem;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.85);
  margin-bottom: 1.25rem;
}

.gp-hero__tag-divider {
  opacity: 0.35;
  font-weight: 400;
}

.gp-hero__lead {
  font-size: var(--gp-type-lead-size);
  line-height: var(--gp-type-lead-lh);
  color: rgba(255, 255, 255, 0.7);
  max-width: 28rem;
  margin-bottom: 2rem;
}

.gp-hero__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.875rem;
}

.gp-hero__visual {
  position: relative;
  border-radius: var(--gp-radius-lg);
  overflow: hidden;
  line-height: 0;
  box-shadow:
    0 24px 48px rgba(0, 0, 0, 0.35),
    0 0 0 1px rgba(255, 255, 255, 0.06);
}

.gp-hero__visual::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    135deg,
    rgba(10, 22, 40, 0.15) 0%,
    transparent 45%,
    rgba(0, 102, 255, 0.08) 100%
  );
  pointer-events: none;
  z-index: 2;
}

.gp-hero__slideshow {
  position: relative;
  aspect-ratio: 16 / 10;
  background: var(--gp-navy-mid);
}

.gp-hero__slide {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 20%;
  opacity: 0;
  z-index: 0;
  animation: gpHeroCrossfade 15s infinite ease-in-out;
}

.gp-hero__slide:nth-child(1) { animation-delay: 0s; }
.gp-hero__slide:nth-child(2) { animation-delay: 5s; }
.gp-hero__slide:nth-child(3) { animation-delay: 10s; }

@keyframes gpHeroCrossfade {
  0%, 28% { opacity: 1; z-index: 1; }
  33%, 100% { opacity: 0; z-index: 0; }
}

.gp-hero__slideshow.is-controlled .gp-hero__slide {
  animation: none;
  opacity: 0;
  z-index: 0;
  transition: opacity 0.8s ease-in-out;
}

.gp-hero__slideshow.is-controlled .gp-hero__slide.is-active {
  opacity: 1;
  z-index: 1;
}

.gp-hero__dots {
  position: absolute;
  bottom: 1rem;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  gap: 0.625rem;
  z-index: 10;
  pointer-events: auto;
}

.gp-hero__dot {
  width: 10px;
  height: 10px;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.4);
  cursor: pointer;
  transition: background 0.25s, transform 0.25s;
}

.gp-hero__dot:hover {
  background: rgba(255, 255, 255, 0.7);
}

.gp-hero__dot.is-active {
  background: #fff;
  transform: scale(1.2);
}

/* ── Pain section (intro + cards) ── */

.gp-pain-section {
  padding: 2.75rem 0 5.5rem;
  background: #fff;
}

.gp-pain-section__header {
  max-width: 640px;
  margin: 0 auto 3.5rem;
}

.gp-pain-section__label {
  font-size: var(--gp-type-label-size);
  font-weight: var(--gp-type-label-weight);
  color: var(--gp-primary);
  margin-bottom: 0.625rem;
}

.gp-pain-section__title {
  font-size: var(--gp-type-title-size);
  font-weight: var(--gp-type-title-weight);
  letter-spacing: var(--gp-type-title-tracking);
  color: var(--gp-navy);
  margin-bottom: 1.25rem;
}

.gp-pain-section__title em {
  font-style: normal;
  color: var(--gp-primary);
}

.gp-pain-section__tags {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
  list-style: none;
  padding: 0;
  margin: 0;
}

.gp-pain-section__tags li {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--gp-primary);
  background: var(--gp-primary-light);
  padding: 0.375rem 0.875rem;
  border-radius: 999px;
}

.gp-pain-card {
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 2rem 1.5rem 1.75rem;
  background: var(--gp-surface);
  border: 1px solid var(--gp-border);
  border-radius: var(--gp-radius-lg);
  transition: transform 0.25s, box-shadow 0.25s, border-color 0.25s;
}

.gp-pain-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--gp-shadow-lg);
  border-color: transparent;
}

.gp-pain-card__visual {
  margin-bottom: 1.5rem;
}

.gp-pain-card__illus {
  width: 112px;
  height: 112px;
  display: block;
}

.gp-pain-card__worry {
  font-size: var(--gp-type-card-title-size);
  font-weight: var(--gp-type-card-title-weight);
  line-height: var(--gp-type-card-title-lh);
  color: var(--gp-navy);
  margin-bottom: 1.25rem;
  max-width: 16rem;
}

.gp-pain-card__answer {
  width: 100%;
  padding: 1.25rem 1rem;
  background: #fff;
  border-radius: var(--gp-radius);
  margin-bottom: 1.25rem;
  flex: 1;
}

.gp-pain-card__solution-title {
  font-size: var(--gp-type-card-title-size);
  font-weight: var(--gp-type-card-title-weight);
  line-height: var(--gp-type-card-title-lh);
  color: var(--gp-primary);
  margin-bottom: 0.375rem;
}

.gp-pain-card__solution-desc {
  font-size: var(--gp-type-body-size);
  line-height: var(--gp-type-body-lh);
  color: var(--gp-text-muted);
  margin-bottom: 0;
}

.gp-pain-card__link {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--gp-primary);
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}

.gp-pain-card__link:hover {
  color: var(--gp-primary-dark);
}

/* ── Before / After compare (mockup: visual left, text right) ── */

.gp-compare {
  padding: 4rem 0 5rem;
  background: linear-gradient(180deg, #e6ebf3 0%, #dfe5ef 50%, #e6ebf3 100%);
}

/* Left: counseling center photo */

.gp-compare__figure {
  height: 100%;
  min-height: 100%;
  margin: 0;
  border-radius: var(--gp-radius-lg);
  overflow: hidden;
  box-shadow: 0 12px 40px rgba(10, 22, 40, 0.12);
  line-height: 0;
  background: var(--gp-navy);
}

.gp-compare__photo {
  width: 100%;
  height: 100%;
  min-height: 480px;
  display: block;
  object-fit: cover;
  object-position: center 20%;
}

/* Right: copy column */

.gp-compare__content {
  width: 100%;
  min-height: 100%;
  display: flex;
  flex-direction: column;
}

.gp-compare__header {
  margin-bottom: 2rem;
}

.gp-compare__label {
  font-size: var(--gp-type-label-size);
  font-weight: var(--gp-type-label-weight);
  color: var(--gp-primary);
  margin-bottom: 0.625rem;
}

.gp-compare__title {
  font-size: var(--gp-type-title-size);
  font-weight: var(--gp-type-title-weight);
  letter-spacing: var(--gp-type-title-tracking);
  color: var(--gp-navy);
  margin-bottom: 0.625rem;
}

.gp-compare__lead {
  font-size: var(--gp-type-lead-size);
  line-height: var(--gp-type-lead-lh);
  color: var(--gp-text-muted);
  margin-bottom: 0;
}

.gp-compare__block {
  position: relative;
  flex: 1 1 auto;
  width: 100%;
  background: #fff;
  border-radius: var(--gp-radius-lg);
  padding: 2rem 2.25rem;
  border: 1px solid rgba(255, 255, 255, 0.65);
  box-shadow: 0 8px 24px rgba(10, 22, 40, 0.08);
}

.gp-compare__block--before {
  padding-right: 7rem;
}

.gp-compare__block-deco {
  position: absolute;
  right: 1.75rem;
  top: 50%;
  transform: translateY(-50%);
  width: 88px;
  opacity: 0.7;
  pointer-events: none;
}

.gp-compare__block-deco svg {
  width: 100%;
  height: auto;
  display: block;
}

.gp-compare__badge {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: #fff;
  background: #b8c4d8;
  padding: 0.4rem 0.875rem;
  border-radius: 999px;
  margin-bottom: 1rem;
}

.gp-compare__badge--after {
  background: var(--gp-primary);
}

.gp-compare__block-title {
  font-size: var(--gp-type-card-title-size);
  font-weight: var(--gp-type-card-title-weight);
  line-height: var(--gp-type-card-title-lh);
  color: var(--gp-navy);
  margin-bottom: 0.625rem;
}

.gp-compare__block-desc {
  font-size: var(--gp-type-body-size);
  line-height: var(--gp-type-body-lh);
  color: var(--gp-text-muted);
  margin-bottom: 1.25rem;
}

.gp-compare__chips {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.75rem;
  list-style: none;
  padding: 0;
  margin: 0;
  width: 100%;
}

.gp-compare__chips li {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--gp-text-muted);
  background: var(--gp-surface);
  padding: 0.875rem 1rem;
  border-radius: 12px;
  border: 1px solid var(--gp-border);
  text-align: center;
}

.gp-compare__chips i {
  font-size: 1.25rem;
  color: var(--gp-text-light);
  flex-shrink: 0;
}

.gp-compare__connector {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.625rem 0;
  color: var(--gp-primary);
  font-size: 1.375rem;
  flex-shrink: 0;
}

.gp-compare__pipeline {
  display: flex;
  align-items: center;
  width: 100%;
  gap: 0.75rem;
  margin-top: 0.5rem;
}

.gp-compare__pipe-item {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--gp-navy);
  background: var(--gp-surface);
  padding: 0.875rem 1.25rem;
  border-radius: 999px;
  border: 1px solid var(--gp-border);
  white-space: nowrap;
}

.gp-compare__pipe-item i {
  font-size: 1.25rem;
  color: var(--gp-primary);
}

.gp-compare__pipe-item--ai {
  flex: 1 1 auto;
  background: var(--gp-primary);
  border-color: var(--gp-primary);
  color: #fff;
  padding: 1rem 1.5rem;
  font-size: 1rem;
  box-shadow: 0 6px 20px rgba(0, 102, 255, 0.28);
}

.gp-compare__pipe-item--ai i {
  color: #fff;
  font-size: 1.375rem;
}

.gp-compare__pipe-link {
  flex: 1 1 32px;
  min-width: 24px;
  max-width: 64px;
  height: 0;
  border-top: 2px dotted #b8c4d8;
}

.gp-compare__summary {
  margin-top: 1.75rem;
  margin-bottom: 0;
  font-size: var(--gp-type-summary-size);
  line-height: var(--gp-type-body-lh);
  color: var(--gp-text-muted);
}

.gp-compare__summary strong {
  font-weight: 800;
  color: var(--gp-primary);
}

/* ── Showcase ── */

.gp-showcase {
  padding: 5rem 0;
  background: #fff;
}

.gp-showcase__lead {
  font-size: var(--gp-type-lead-size);
  font-weight: 600;
  line-height: var(--gp-type-lead-lh);
  color: var(--gp-navy);
  margin-bottom: 1rem;
}

.gp-showcase__lead strong {
  color: var(--gp-primary);
  font-weight: 700;
}

.gp-showcase__points {
  list-style: none;
  padding: 0;
  margin: 0 0 1.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}

.gp-showcase__points li {
  display: flex;
  align-items: flex-start;
  gap: 0.875rem;
  font-size: var(--gp-type-body-size);
  line-height: var(--gp-type-body-lh);
  color: var(--gp-text-muted);
}

.gp-showcase__points strong {
  color: var(--gp-navy);
  font-weight: 700;
}

.gp-showcase__point-icon {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--gp-primary-light);
  border-radius: 12px;
  color: var(--gp-primary);
  font-size: 1.25rem;
}

.gp-showcase__visual {
  border-radius: var(--gp-radius-lg);
  overflow: hidden;
  box-shadow: var(--gp-shadow);
  line-height: 0;
}

.gp-showcase__img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  object-position: center center;
}

/* ── Stats ── */

.gp-stats {
  padding: 2.5rem 0;
  background: var(--gp-navy);
  color: #fff;
}

.gp-stats__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2rem 2.5rem;
  align-items: start;
}

.gp-stat {
  text-align: center;
  padding: 0.75rem 1.25rem 1rem;
}

.gp-stat__icon {
  width: 88px;
  height: 88px;
  margin: 0 auto 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.1);
  border-radius: 22px;
  font-size: 2.375rem;
  color: #6eb4ff;
}

.gp-stat__value {
  display: block;
  font-size: 1.5rem;
  font-weight: 800;
  margin-bottom: 0.5rem;
  letter-spacing: -0.02em;
}

.gp-stat__label {
  font-size: var(--gp-type-body-size);
  line-height: var(--gp-type-body-lh);
  color: rgba(255, 255, 255, 0.7);
}

/* ── Features grid ── */

.gp-features {
  position: relative;
  padding: 5.5rem 0;
  background: linear-gradient(180deg, #f0f4fc 0%, var(--gp-surface) 45%, #fff 100%);
  overflow: hidden;
}

.gp-features__decor {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}

.gp-features__orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.45;
}

.gp-features__orb--1 {
  width: 420px;
  height: 420px;
  top: -120px;
  left: -80px;
  background: rgba(0, 102, 255, 0.2);
}

.gp-features__orb--2 {
  width: 360px;
  height: 360px;
  top: 40%;
  right: -100px;
  background: rgba(107, 76, 230, 0.15);
}

.gp-features__orb--3 {
  width: 280px;
  height: 280px;
  bottom: -60px;
  left: 35%;
  background: rgba(16, 185, 129, 0.12);
}

.gp-features__inner {
  position: relative;
  z-index: 1;
}

.gp-features__grid {
  counter-reset: feature-num;
}

.gp-features__grid > div {
  counter-increment: feature-num;
}

.gp-feature-card__num::before {
  content: counter(feature-num, decimal-leading-zero);
}

.gp-features__grid > div:nth-child(1) .gp-feature-card { --fc-accent: #0066ff; --fc-bg: #e8f1ff; }
.gp-features__grid > div:nth-child(2) .gp-feature-card { --fc-accent: #0d9488; --fc-bg: #e6faf8; }
.gp-features__grid > div:nth-child(3) .gp-feature-card { --fc-accent: #7c3aed; --fc-bg: #f0ebff; }
.gp-features__grid > div:nth-child(4) .gp-feature-card { --fc-accent: #ea580c; --fc-bg: #fff4eb; }
.gp-features__grid > div:nth-child(5) .gp-feature-card { --fc-accent: #059669; --fc-bg: #ecfdf5; }
.gp-features__grid > div:nth-child(6) .gp-feature-card { --fc-accent: #4f46e5; --fc-bg: #eef2ff; }

.gp-feature-card {
  position: relative;
  height: 100%;
  background: #fff;
  border: 1px solid var(--gp-border);
  border-radius: var(--gp-radius-lg);
  padding: 2rem 1.75rem 1.75rem;
  overflow: hidden;
  transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease;
}

.gp-feature-card::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--fc-accent, var(--gp-primary)), transparent 85%);
  opacity: 0.85;
}

.gp-feature-card::after {
  content: "";
  position: absolute;
  right: -40px;
  bottom: -40px;
  width: 140px;
  height: 140px;
  border-radius: 50%;
  background: var(--fc-bg, var(--gp-primary-light));
  opacity: 0.55;
  transition: transform 0.35s ease, opacity 0.35s ease;
}

.gp-feature-card:hover {
  transform: translateY(-6px);
  border-color: rgba(0, 102, 255, 0.15);
  box-shadow: 0 16px 40px rgba(10, 22, 40, 0.1);
}

.gp-feature-card:hover::after {
  transform: scale(1.15);
  opacity: 0.75;
}

.gp-feature-card__num {
  position: absolute;
  top: 1.25rem;
  right: 1.25rem;
  font-size: 2rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.04em;
  color: var(--fc-accent, var(--gp-primary));
  opacity: 0.12;
  z-index: 0;
}

.gp-feature-card__icon {
  position: relative;
  z-index: 1;
  width: 64px;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(145deg, var(--fc-bg, var(--gp-primary-light)) 0%, #fff 100%);
  border: 1px solid rgba(255, 255, 255, 0.8);
  border-radius: 18px;
  color: var(--fc-accent, var(--gp-primary));
  font-size: 1.75rem;
  margin-bottom: 1.25rem;
  box-shadow: 0 8px 20px rgba(10, 22, 40, 0.06);
  transition: transform 0.28s ease, box-shadow 0.28s ease;
}

.gp-feature-card:hover .gp-feature-card__icon {
  transform: scale(1.06) rotate(-3deg);
  box-shadow: 0 12px 28px rgba(10, 22, 40, 0.1);
}

.gp-feature-card__title {
  position: relative;
  z-index: 1;
  font-size: var(--gp-type-card-title-size);
  font-weight: var(--gp-type-card-title-weight);
  line-height: var(--gp-type-card-title-lh);
  color: var(--gp-navy);
  margin-bottom: 0.625rem;
}

.gp-feature-card__desc {
  position: relative;
  z-index: 1;
  font-size: var(--gp-type-body-size);
  line-height: var(--gp-type-body-lh);
  color: var(--gp-text-muted);
  margin-bottom: 0;
}

/* ── Benefit ── */

.gp-benefit {
  position: relative;
  padding: 5rem 0;
  background: linear-gradient(180deg, #e6ebf3 0%, #dfe5ef 50%, #e6ebf3 100%);
  overflow: hidden;
}

.gp-benefit__decor {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.gp-benefit__orb {
  position: absolute;
  width: 480px;
  height: 480px;
  top: -160px;
  right: -120px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(0, 102, 255, 0.16) 0%, transparent 70%);
  filter: blur(40px);
}

.gp-benefit__ring {
  position: absolute;
  width: 320px;
  height: 320px;
  bottom: -80px;
  left: -60px;
  border: 2px solid rgba(0, 102, 255, 0.12);
  border-radius: 50%;
}

.gp-benefit__inner {
  position: relative;
  z-index: 1;
}

.gp-benefit__intro {
  position: relative;
  padding: 0.5rem 2rem 0.5rem 1.5rem;
  margin-left: 0;
}

.gp-benefit__intro::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  border-radius: 4px;
  background: linear-gradient(180deg, var(--gp-primary), #6eb4ff);
}

.gp-benefit__summary {
  font-size: var(--gp-type-lead-size);
  line-height: var(--gp-type-body-lh);
  color: var(--gp-text-muted);
  margin: 1rem 0 0;
  max-width: 20rem;
}

.gp-benefit-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.gp-benefit-item {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 1.125rem 1.25rem;
  background: #fff;
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: var(--gp-radius);
  font-size: var(--gp-type-body-size);
  font-weight: 600;
  color: var(--gp-navy);
  line-height: var(--gp-type-body-lh);
  box-shadow: 0 6px 20px rgba(10, 22, 40, 0.08);
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.gp-benefit-item:hover {
  transform: translateX(6px);
  border-color: rgba(0, 102, 255, 0.25);
  box-shadow: 0 12px 32px rgba(10, 22, 40, 0.12);
}

.gp-benefit-item:nth-child(1) { --bn-accent: #0066ff; --bn-bg: #e8f1ff; }
.gp-benefit-item:nth-child(2) { --bn-accent: #0d9488; --bn-bg: #e6faf8; }
.gp-benefit-item:nth-child(3) { --bn-accent: #7c3aed; --bn-bg: #f0ebff; }
.gp-benefit-item:nth-child(4) { --bn-accent: #ea580c; --bn-bg: #fff4eb; }
.gp-benefit-item:nth-child(5) { --bn-accent: #059669; --bn-bg: #ecfdf5; }

.gp-benefit-item__icon {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--bn-bg, var(--gp-primary-light));
  border-radius: 14px;
  color: var(--bn-accent, var(--gp-primary));
  font-size: 1.375rem;
  transition: transform 0.25s ease;
}

.gp-benefit-item:hover .gp-benefit-item__icon {
  transform: scale(1.08);
}

.gp-benefit-item__text {
  flex: 1;
  min-width: 0;
}

@media (max-width: 991.98px) {
  .gp-benefit__intro {
    padding: 0.25rem 0 0.25rem 1.25rem;
  }

  .gp-benefit__summary {
    max-width: none;
  }
}

/* ── Targets ── */

.gp-targets {
  padding: 5rem 0;
  background: var(--gp-surface);
}

.gp-targets__grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 1rem;
}

.gp-target-card {
  background: #fff;
  border: 1px solid var(--gp-border);
  border-radius: var(--gp-radius);
  padding: 2rem 1.125rem 1.75rem;
  text-align: center;
  transition: transform 0.2s, box-shadow 0.2s;
}

.gp-target-card:hover {
  transform: translateY(-3px);
  box-shadow: var(--gp-shadow);
}

.gp-target-card__icon {
  font-size: 2.5rem;
  color: var(--gp-primary);
  margin-bottom: 1rem;
  line-height: 1;
}

.gp-target-card__title {
  font-size: var(--gp-type-card-title-size);
  font-weight: var(--gp-type-card-title-weight);
  line-height: var(--gp-type-card-title-lh);
  color: var(--gp-navy);
  margin-bottom: 0.5rem;
}

.gp-target-card__desc {
  font-size: var(--gp-type-body-size);
  line-height: var(--gp-type-body-lh);
  color: var(--gp-text-muted);
  margin-bottom: 0;
}

/* ── CTA ── */

.gp-cta {
  position: relative;
  background: linear-gradient(135deg, #003399 0%, #001a66 100%);
  color: #fff;
  padding: 3.5rem 0;
  overflow: hidden;
}

.gp-cta__decor {
  position: absolute;
  top: -50%;
  right: -10%;
  width: 500px;
  height: 500px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(77, 159, 255, 0.12) 0%, transparent 70%);
  pointer-events: none;
}

.gp-cta__inner {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.5rem 2.5rem;
}

.gp-cta__headline h2 {
  font-size: var(--gp-type-title-size);
  font-weight: var(--gp-type-title-weight);
  line-height: var(--gp-type-title-lh);
  letter-spacing: var(--gp-type-title-tracking);
  margin-bottom: 0;
}

.gp-cta__sub p {
  font-size: var(--gp-type-lead-size);
  line-height: var(--gp-type-body-lh);
  color: rgba(255, 255, 255, 0.8);
  margin-bottom: 0;
}

.gp-cta__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-left: auto;
}

/* ── Free trial ── */

.gp-trial {
  padding: 3.5rem 0 1.5rem;
  background: var(--gp-surface-white);
}

.gp-trial__card {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 2rem 3rem;
  padding: 2.75rem 3rem;
  border-radius: var(--gp-radius-lg);
  background: linear-gradient(135deg, #0066ff 0%, #003399 100%);
  color: #fff;
  box-shadow: 0 24px 56px rgba(0, 64, 180, 0.28);
  overflow: hidden;
}

.gp-trial__decor {
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.gp-trial__orb {
  position: absolute;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(255, 255, 255, 0.16) 0%, transparent 70%);
}

.gp-trial__orb--1 {
  top: -45%;
  right: -8%;
  width: 420px;
  height: 420px;
}

.gp-trial__orb--2 {
  bottom: -55%;
  left: -6%;
  width: 360px;
  height: 360px;
  background: radial-gradient(circle, rgba(77, 159, 255, 0.22) 0%, transparent 70%);
}

.gp-trial__body {
  position: relative;
  z-index: 1;
  flex: 1 1 480px;
  min-width: 0;
}

.gp-trial__badge {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.375rem 0.875rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.16);
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.01em;
  margin-bottom: 1rem;
}

.gp-trial__title {
  font-size: var(--gp-type-title-size);
  font-weight: var(--gp-type-title-weight);
  line-height: var(--gp-type-title-lh);
  letter-spacing: var(--gp-type-title-tracking);
  margin-bottom: 0.875rem;
}

.gp-trial__hl {
  color: #ffe27a;
}

.gp-trial__lead {
  font-size: var(--gp-type-lead-size);
  line-height: var(--gp-type-body-lh);
  color: rgba(255, 255, 255, 0.88);
  margin-bottom: 1.5rem;
}

.gp-trial__lead strong {
  color: #fff;
  font-weight: 700;
}

.gp-trial__points {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.75rem;
}

.gp-trial__points li {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  font-size: 1rem;
  line-height: 1.5;
  color: rgba(255, 255, 255, 0.9);
}

.gp-trial__points strong {
  color: #fff;
  font-weight: 700;
}

.gp-trial__point-icon {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.16);
  color: #fff;
  font-size: 1rem;
}

.gp-trial__cta {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  margin-left: auto;
  text-align: center;
}

.gp-trial__btn {
  font-weight: 700;
}

.gp-trial__note {
  margin: 0.875rem 0 0;
  font-size: 0.875rem;
  color: rgba(255, 255, 255, 0.78);
}

/* ── Easy setup ── */

.gp-setup {
  padding: 5rem 0;
  background: linear-gradient(180deg, #e6ebf3 0%, #dfe5ef 50%, #e6ebf3 100%);
}

.gp-setup__intro {
  max-width: 660px;
}

.gp-setup__intro strong {
  color: var(--gp-primary);
  font-weight: 700;
}

.gp-setup-card {
  position: relative;
  height: 100%;
  background: #fff;
  border: 1px solid var(--gp-border);
  border-radius: var(--gp-radius-lg);
  padding: 2rem 1.75rem;
  box-shadow: var(--gp-shadow);
  transition: transform 0.28s ease, box-shadow 0.28s ease;
}

.gp-setup-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--gp-shadow-lg);
}

.gp-setup-card__step {
  display: inline-block;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--gp-primary);
  background: var(--gp-primary-light);
  padding: 0.25rem 0.75rem;
  border-radius: 999px;
  margin-bottom: 1rem;
}

.gp-setup-card__icon {
  width: 56px;
  height: 56px;
  border-radius: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  color: #fff;
  background: linear-gradient(135deg, #4d9fff 0%, #0066ff 100%);
  margin-bottom: 1rem;
}

.gp-setup-card__title {
  font-size: var(--gp-type-card-title-size);
  font-weight: var(--gp-type-card-title-weight);
  color: var(--gp-navy);
  margin-bottom: 0.5rem;
}

.gp-setup-card__desc {
  color: var(--gp-text-muted);
  line-height: 1.6;
  margin-bottom: 1.25rem;
}

.gp-setup-card__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.625rem;
}

.gp-setup-card__list li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 1rem;
  color: var(--gp-text);
}

.gp-setup-card__list li i {
  flex-shrink: 0;
  color: var(--gp-primary);
  font-size: 1.05rem;
}

.gp-setup__arrow {
  display: flex;
  justify-content: center;
  color: var(--gp-primary);
  font-size: 1.75rem;
  margin: 1.25rem 0 0.5rem;
}

.gp-setup__result {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  flex-wrap: wrap;
  text-align: center;
  padding: 1.5rem 2rem;
  border-radius: var(--gp-radius-lg);
  background: linear-gradient(135deg, #0066ff 0%, #003399 100%);
  color: #fff;
  box-shadow: 0 16px 40px rgba(0, 64, 180, 0.22);
}

.gp-setup__result-icon {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  background: rgba(255, 255, 255, 0.16);
}

.gp-setup__result-text {
  margin: 0;
  font-size: var(--gp-type-lead-size);
  line-height: 1.5;
}

.gp-setup__result-text strong {
  color: #ffe27a;
  font-weight: 700;
}

/* ── Pricing & FAQ ── */

.gp-pricing {
  padding: 5rem 0;
  background: linear-gradient(180deg, #f0f4fc 0%, var(--gp-surface) 50%, #fff 100%);
}

.gp-pricing-hero {
  padding: 4rem 0 2rem;
  background: linear-gradient(180deg, #e6ebf3 0%, #f5f7fb 100%);
}

.gp-pricing-page {
  padding: 2rem 0 5rem;
  background: var(--gp-surface);
}

.gp-pricing-diff {
  margin-bottom: 4.5rem;
}

.gp-pricing-diff .gp-section-header {
  margin-bottom: 2rem;
}

.gp-pricing-grid {
  margin-bottom: 4.5rem;
}

.gp-pricing-card {
  position: relative;
  display: flex;
  flex-direction: column;
  height: 100%;
  background: #fff;
  border: 1px solid var(--gp-border);
  border-radius: var(--gp-radius-lg);
  padding: 2rem 1.75rem 1.75rem;
  box-shadow: var(--gp-shadow);
  transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease;
}

.gp-pricing-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--gp-shadow-lg);
}

.gp-pricing-card--featured {
  border-color: rgba(0, 102, 255, 0.35);
  box-shadow: 0 16px 48px rgba(0, 102, 255, 0.12);
}

.gp-pricing-card--featured:hover {
  box-shadow: 0 24px 56px rgba(0, 102, 255, 0.18);
}

.gp-pricing-card--premium {
  background: linear-gradient(180deg, #fff 0%, #f8faff 100%);
  border-color: var(--gp-navy);
}

.gp-pricing-card--compact {
  padding: 1.75rem 1.5rem;
  text-align: center;
}

.gp-pricing-card--compact .gp-pricing-card__name {
  margin-bottom: 1rem;
}

.gp-pricing-card--compact .gp-pricing-card__price-wrap {
  margin-bottom: 0;
  padding-bottom: 1.25rem;
  border-bottom: 1px solid var(--gp-border);
}

.gp-pricing-same-note {
  max-width: 36rem;
  margin: 0.75rem auto 0;
  padding: 0.75rem 1.25rem;
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.5;
  color: var(--gp-navy);
  background: var(--gp-primary-light);
  border-radius: 12px;
}

.gp-pricing-card__highlights {
  list-style: none;
  padding: 0;
  margin: 1.25rem 0 0;
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  text-align: left;
}

.gp-pricing-card--compact .gp-pricing-card__highlights {
  margin-top: 1.25rem;
}

.gp-pricing-card__highlights li {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  font-size: 0.9375rem;
  line-height: 1.45;
  color: var(--gp-text);
}

.gp-pricing-card__highlights i {
  flex-shrink: 0;
  margin-top: 0.15rem;
  font-size: 1rem;
  color: var(--gp-primary);
}

.gp-pricing-card--featured .gp-pricing-card__highlights i {
  color: var(--gp-primary);
}

.gp-pricing-card__badge {
  position: absolute;
  top: -0.75rem;
  left: 50%;
  transform: translateX(-50%);
  font-size: 0.75rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #fff;
  background: var(--gp-primary);
  padding: 0.375rem 1rem;
  border-radius: 999px;
  box-shadow: 0 4px 12px rgba(0, 102, 255, 0.3);
}

.gp-pricing-card__header {
  margin-bottom: 1.5rem;
}

.gp-pricing-card__name {
  font-size: var(--gp-type-card-title-size);
  font-weight: var(--gp-type-card-title-weight);
  color: var(--gp-navy);
  margin-bottom: 0.375rem;
}

.gp-pricing-card__tagline {
  font-size: var(--gp-type-body-size);
  line-height: var(--gp-type-body-lh);
  color: var(--gp-text-muted);
  margin-bottom: 0;
}

.gp-pricing-card__price-wrap {
  margin-bottom: 1.5rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid var(--gp-border);
}

.gp-pricing-card__price {
  font-size: clamp(1.75rem, 3vw, 2.25rem);
  font-weight: 800;
  letter-spacing: -0.03em;
  color: var(--gp-navy);
  margin-bottom: 0.375rem;
  line-height: 1.2;
}

.gp-pricing-card__price--custom {
  font-size: clamp(1.5rem, 2.5vw, 1.875rem);
  color: var(--gp-primary);
}

.gp-pricing-card__currency {
  font-size: 0.65em;
  font-weight: 700;
  vertical-align: super;
  margin-right: 0.125rem;
  color: var(--gp-text-muted);
}

.gp-pricing-card__unit {
  font-size: 0.45em;
  font-weight: 600;
  color: var(--gp-text-muted);
  margin-left: 0.25rem;
  letter-spacing: 0;
}

.gp-pricing-card__price-note {
  font-size: 0.875rem;
  color: var(--gp-text-light);
  margin-bottom: 0;
}

.gp-pricing-card__features {
  list-style: none;
  padding: 0;
  margin: 0 0 1.75rem;
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.gp-pricing-card__features li {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  font-size: var(--gp-type-body-size);
  line-height: var(--gp-type-body-lh);
  color: var(--gp-text);
}

.gp-pricing-card__feature--capacity {
  font-weight: 600;
  color: var(--gp-navy);
}

.gp-pricing-card__feature--capacity + li:not(.gp-pricing-card__feature--capacity) {
  margin-top: 0.25rem;
  padding-top: 0.75rem;
  border-top: 1px solid var(--gp-border);
}

.gp-pricing-card__features i {
  flex-shrink: 0;
  margin-top: 0.2rem;
  font-size: 1.125rem;
  color: var(--gp-primary);
}

.gp-pricing-card--premium .gp-pricing-card__features i {
  color: var(--gp-navy);
}

.gp-pricing-card__footer {
  margin-top: auto;
  padding-top: 1.25rem;
  background: transparent !important;
  color: inherit;
  border-top: 1px solid var(--gp-border);
}

.gp-pricing-card__footer .gp-btn {
  display: block;
  width: 100%;
  text-align: center;
  padding: 0.875rem 1.25rem;
}

.gp-pricing-card--featured .gp-pricing-card__footer .gp-btn--primary {
  box-shadow: 0 6px 20px rgba(0, 102, 255, 0.25);
}

.gp-pricing-card--premium .gp-pricing-card__footer .gp-btn--accent {
  background: var(--gp-navy);
}

.gp-pricing-card--premium .gp-pricing-card__footer .gp-btn--accent:hover {
  background: var(--gp-navy-mid);
}

.gp-pricing-compare {
  margin-bottom: 3.5rem;
}

.gp-pricing-table-wrap {
  overflow-x: auto;
  border-radius: var(--gp-radius-lg);
  border: 1px solid var(--gp-border);
  background: #fff;
  box-shadow: var(--gp-shadow);
}

.gp-pricing-table {
  width: 100%;
  margin-bottom: 0;
  border-collapse: collapse;
  font-size: var(--gp-type-body-size);
}

.gp-pricing-table thead th {
  padding: 1.125rem 1.25rem;
  font-weight: 700;
  color: var(--gp-navy);
  background: var(--gp-surface);
  border-bottom: 1px solid var(--gp-border);
  text-align: center;
  white-space: nowrap;
}

.gp-pricing-table thead th:first-child {
  text-align: left;
}

.gp-pricing-table tbody th {
  padding: 1rem 1.25rem;
  font-weight: 600;
  color: var(--gp-navy);
  text-align: left;
  border-bottom: 1px solid var(--gp-border);
  background: #fff;
}

.gp-pricing-table tbody td {
  padding: 1rem 1.25rem;
  text-align: center;
  color: var(--gp-text-muted);
  border-bottom: 1px solid var(--gp-border);
  white-space: nowrap;
}

.gp-pricing-table tbody tr:last-child th,
.gp-pricing-table tbody tr:last-child td {
  border-bottom: none;
}

.gp-pricing-table__col--featured {
  background: rgba(0, 102, 255, 0.04);
  color: var(--gp-primary-dark);
  font-weight: 600;
}

.gp-pricing-table thead .gp-pricing-table__col--featured {
  background: var(--gp-primary-light);
  color: var(--gp-primary);
}

.gp-pricing-table__group th {
  padding: 0.75rem 1.25rem;
  font-size: 0.8125rem;
  font-weight: 700;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--gp-text-muted);
  background: var(--gp-surface);
  border-bottom: 1px solid var(--gp-border);
  border-top: 1px solid var(--gp-border);
}

.gp-pricing-table__group:first-child th {
  border-top: none;
}

.gp-pricing-table-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.5rem;
  margin: 1rem 0 0;
  font-size: 0.875rem;
  color: var(--gp-text-muted);
}

.gp-pricing-table-legend span {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}

.gp-pricing-notes {
  margin-bottom: 3rem;
}

.gp-pricing-note {
  height: 100%;
  padding: 1.5rem;
  background: #fff;
  border: 1px solid var(--gp-border);
  border-radius: var(--gp-radius);
}

.gp-pricing-note__head {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-bottom: 0.875rem;
}

.gp-pricing-note__head i {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  flex-shrink: 0;
  margin-bottom: 0;
  background: var(--gp-primary-light);
  border-radius: 12px;
  font-size: 1.25rem;
  color: var(--gp-primary);
}

.gp-pricing-note h3 {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--gp-navy);
  margin-bottom: 0;
}

.gp-pricing-note p {
  font-size: 0.9375rem;
  line-height: 1.65;
  color: var(--gp-text-muted);
  margin-bottom: 0;
}

.gp-pricing-cta {
  border-radius: var(--gp-radius-lg);
  background: linear-gradient(135deg, var(--gp-navy) 0%, var(--gp-navy-mid) 100%);
  padding: 2.5rem 2.75rem;
  box-shadow: var(--gp-shadow-lg);
}

.gp-pricing-cta__inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem 2rem;
}

.gp-pricing-cta__title {
  font-size: var(--gp-type-card-title-size);
  font-weight: 800;
  color: #fff;
  margin-bottom: 0.5rem;
}

.gp-pricing-cta__desc {
  font-size: var(--gp-type-lead-size);
  line-height: var(--gp-type-lead-lh);
  color: rgba(255, 255, 255, 0.75);
}

/* ── Inquiry form (signup) ── */

.gp-inquiry-hero {
  padding: 4rem 0 2rem;
  background: linear-gradient(180deg, #e6ebf3 0%, #f5f7fb 100%);
}

.gp-inquiry-page {
  background: var(--gp-surface);
}

.gp-inquiry-alert {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  padding: 1.25rem 1.5rem;
  border-radius: var(--gp-radius);
  margin-bottom: 1.5rem;
}

.gp-inquiry-alert i {
  flex-shrink: 0;
  font-size: 1.5rem;
  margin-top: 0.125rem;
}

.gp-inquiry-alert strong {
  display: block;
  margin-bottom: 0.25rem;
  font-size: 1rem;
}

.gp-inquiry-alert p {
  font-size: var(--gp-type-body-size);
  line-height: var(--gp-type-body-lh);
}

.gp-inquiry-alert--success {
  background: #ecfdf5;
  border: 1px solid #a7f3d0;
  color: #065f46;
}

.gp-inquiry-alert--success i {
  color: #059669;
}

.gp-inquiry-alert--error {
  background: #fef2f2;
  border: 1px solid #fecaca;
  color: #991b1b;
}

.gp-inquiry-alert--error i {
  color: #dc2626;
}

.gp-inquiry-form {
  background: #fff;
  border: 1px solid var(--gp-border);
  border-radius: var(--gp-radius-lg);
  padding: 2rem;
  box-shadow: var(--gp-shadow);
}

.gp-inquiry-form__label {
  display: block;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--gp-navy);
  margin-bottom: 0.5rem;
}

.gp-inquiry-form__input {
  border-radius: 10px;
  border-color: var(--gp-border);
  padding: 0.75rem 1rem;
  font-size: var(--gp-type-body-size);
}

.gp-inquiry-form__input:focus {
  border-color: var(--gp-primary);
  box-shadow: 0 0 0 0.2rem rgba(0, 102, 255, 0.15);
}

.gp-inquiry-form__input[readonly] {
  background-color: #eef1f6;
  color: var(--gp-text-muted);
  cursor: not-allowed;
}

.gp-inquiry-form__input[readonly]:focus {
  border-color: var(--gp-border);
  box-shadow: none;
}

.gp-inquiry-form__login {
  font-size: 0.9375rem;
  color: var(--gp-text-muted);
}

.gp-inquiry-form__login a {
  color: var(--gp-primary);
  font-weight: 600;
  text-decoration: none;
}

.gp-inquiry-form__login a:hover {
  color: var(--gp-primary-dark);
}

.gp-inquiry-form__login-sub {
  color: var(--gp-text-muted);
  font-weight: 500;
  text-decoration: none;
}

.gp-inquiry-form__login-sub:hover {
  color: var(--gp-primary);
  text-decoration: underline;
}

.gp-console-login-links__item {
  margin: 0 0 0.875rem;
  line-height: 1.6;
}

.gp-console-login-links__item:last-of-type {
  margin-bottom: 1.125rem;
}

.gp-console-login-links__sub {
  display: inline-block;
}

/* ── Signup form sections ── */

.gp-signup-form {
  padding: 2.25rem 2.5rem 2.5rem;
}

.gp-signup-section {
  margin-bottom: 2.25rem;
  padding-bottom: 2.25rem;
  border-bottom: 1px solid var(--gp-border);
}

.gp-signup-section--last {
  margin-bottom: 2rem;
  padding-bottom: 0;
  border-bottom: none;
}

.gp-signup-section__title {
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--gp-navy);
  margin-bottom: 1.25rem;
}

.gp-signup-form__error {
  margin: 0.375rem 0 0;
  font-size: 0.8125rem;
  line-height: 1.4;
  color: #dc2626;
  min-height: 0;
}

.gp-signup-form__error:not(:empty) {
  min-height: 1.15rem;
}

.gp-signup-form__hint {
  margin: 0.375rem 0 0;
  font-size: 0.8125rem;
  line-height: 1.4;
  color: var(--gp-text-muted);
}

.gp-signup-form__hint.gp-signup-form__status--ok {
  color: #1a8f4c;
  font-weight: 600;
}

.gp-signup-form__hint.gp-signup-form__status--ng {
  color: #dc2626;
  font-weight: 600;
}

.gp-signup-form__hint--step {
  display: flex;
  align-items: flex-start;
  gap: 0.375rem;
  color: #b45309;
  background: #fffbeb;
  border: 1px solid #fcd34d;
  border-radius: 0.5rem;
  padding: 0.625rem 0.75rem;
  font-size: 0.8125rem;
  line-height: 1.5;
}

.gp-signup-form__hint--step .bi {
  flex-shrink: 0;
  margin-top: 0.125rem;
}

.gp-signup-form__required-badge {
  display: inline-block;
  margin-left: 0.125rem;
  padding: 0.0625rem 0.375rem;
  border-radius: 999px;
  background: #dc2626;
  color: #fff;
  font-size: 0.6875rem;
  font-weight: 700;
  line-height: 1.3;
  vertical-align: middle;
}

.gp-signup-username-block--attention {
  position: relative;
}

.gp-signup-id-check--pending .gp-inquiry-form__input {
  border-color: #dc2626;
  box-shadow: 0 0 0 0.15rem rgba(220, 38, 38, 0.12);
}

.gp-signup-id-check__btn--pending {
  border-color: #dc2626 !important;
  color: #dc2626 !important;
  background: #fef2f2 !important;
  box-shadow: 0 0 0 0.15rem rgba(220, 38, 38, 0.12);
  animation: gp-signup-pulse-attention 1.6s ease-in-out infinite;
}

@keyframes gp-signup-pulse-attention {
  0%, 100% {
    box-shadow: 0 0 0 0.15rem rgba(220, 38, 38, 0.12);
  }
  50% {
    box-shadow: 0 0 0 0.28rem rgba(220, 38, 38, 0.22);
  }
}

.gp-signup-form__submit-hint {
  margin: 0.5rem 0 0;
  font-size: 0.875rem;
  line-height: 1.5;
  color: var(--gp-text-muted);
  min-height: 0;
}

.gp-signup-form__submit-hint--error {
  color: #dc2626;
  font-weight: 600;
}

.gp-signup-form__submit-hint--error::before {
  content: "⚠ ";
}

.gp-signup-phone-verify,
.gp-signup-id-check,
.gp-signup-address {
  display: flex;
  gap: 0.625rem;
  align-items: stretch;
}

.gp-signup-phone-verify .gp-inquiry-form__input,
.gp-signup-id-check .gp-inquiry-form__input,
.gp-signup-address .gp-inquiry-form__input {
  flex: 1;
  min-width: 0;
}

.gp-signup-phone-verify__btn,
.gp-signup-id-check__btn,
.gp-signup-address__btn {
  flex-shrink: 0;
  padding: 0.75rem 1rem;
  white-space: nowrap;
}

.gp-signup-address .gp-signup-address__main {
  flex: 1 1 0;
}

.gp-signup-address .gp-signup-address__detail {
  flex: 1.8 1 0;
}

.gp-signup-terms {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}

.gp-signup-terms__item {
  margin: 0;
  padding-left: 0.125rem;
}

.gp-signup-terms__item .form-check-label {
  font-size: 0.9375rem;
  line-height: 1.5;
  color: var(--gp-text);
}

.gp-signup-terms__badge {
  display: inline-block;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 0.125rem 0.4375rem;
  border-radius: 4px;
  margin-right: 0.375rem;
  vertical-align: middle;
}

.gp-signup-terms__badge--required {
  background: #eff6ff;
  color: var(--gp-primary);
}

.gp-signup-terms__badge--optional {
  background: #f3f4f6;
  color: var(--gp-text-muted);
}

.gp-signup-terms__link {
  color: var(--gp-primary);
  font-weight: 600;
  text-decoration: none;
}

.gp-signup-terms__link:hover {
  color: var(--gp-primary-dark);
  text-decoration: underline;
}

.gp-signup-terms__all {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  margin: 0;
  padding: 0.875rem 1rem;
  border: 1.5px solid var(--gp-primary);
  border-radius: 12px;
  background: var(--gp-primary-light);
  font-size: 1rem;
  font-weight: 700;
  color: var(--gp-navy);
  cursor: pointer;
}

.gp-signup-terms__all .form-check-input {
  margin: 0;
  flex-shrink: 0;
}

.gp-signup-terms__card {
  border: 1px solid var(--gp-border);
  border-radius: 12px;
  padding: 1rem 1.125rem;
  background: var(--gp-surface-white);
}

.gp-signup-terms__head {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.gp-signup-terms__name {
  flex: 1;
  min-width: 0;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--gp-text);
}

.gp-signup-terms__toggle {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.25rem 0.5rem;
  border: none;
  background: transparent;
  color: var(--gp-text-muted);
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
}

.gp-signup-terms__toggle:hover {
  color: var(--gp-primary);
}

.gp-signup-terms__toggle .bi {
  transition: transform 0.2s ease;
  font-size: 0.75rem;
}

.gp-signup-terms__toggle[aria-expanded="true"] .bi {
  transform: rotate(180deg);
}

.gp-signup-terms__doc {
  max-height: 180px;
  overflow-y: auto;
  margin-top: 0.75rem;
  padding: 0.875rem 1rem;
  border: 1px solid var(--gp-border);
  border-radius: 8px;
  background: var(--gp-surface);
  font-size: 0.8125rem;
  line-height: 1.65;
  color: var(--gp-text-muted);
}

.gp-signup-terms__doc p {
  margin-bottom: 0.625rem;
}

.gp-signup-terms__doc p:last-child {
  margin-bottom: 0;
}

.gp-signup-terms__doc strong {
  color: var(--gp-text);
}

.gp-signup-terms__check {
  margin-top: 0.75rem;
  padding-left: 1.75rem;
}

.gp-signup-terms__check .form-check-label {
  font-size: 0.9375rem;
  color: var(--gp-text);
  cursor: pointer;
}

.gp-btn--primary:disabled,
.gp-btn--primary[disabled] {
  background: #c5cdd8;
  color: #fff;
  border: none;
  cursor: not-allowed;
  transform: none;
  box-shadow: none;
}

.gp-btn--primary:disabled:hover,
.gp-btn--primary[disabled]:hover {
  background: #c5cdd8;
  color: #fff;
  transform: none;
  box-shadow: none;
}

/* ── Console site ── */

.gp-console-auth-header {
  background: #fff;
  border-bottom: 1px solid var(--gp-border);
}

.gp-console-auth-header__brand {
  display: inline-block;
  padding: 1rem 0;
  font-weight: 700;
  color: var(--gp-primary);
  text-decoration: none;
}

.gp-console-auth-footer {
  padding: 1.5rem 0 2rem;
  color: var(--gp-text-muted);
}

.gp-console-hero {
  padding-bottom: 1.5rem;
}

.gp-console-login-form__forgot {
  color: var(--gp-text-muted);
  text-decoration: none;
}

.gp-console-login-form__forgot:hover {
  color: var(--gp-primary);
}

.gp-console-login-form__links {
  gap: 0.75rem;
}

.gp-console-login-form__sep {
  color: var(--gp-border);
  margin: 0 0.5rem;
}

/* ── 아이디 찾기 ── */

.gp-find-id-hero.gp-inquiry-hero {
  padding: 3rem 0 0.5rem;
}

.gp-find-id-hero__desc {
  margin-bottom: 0;
}

.gp-find-id-page {
  padding: 1.25rem 0 3rem;
}

.gp-find-id-notice {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  margin-bottom: 1.5rem;
  padding: 1.25rem 1.375rem;
  border: 1px solid #bfdbfe;
  border-radius: var(--gp-radius-md);
  background: linear-gradient(180deg, #f8fbff 0%, #eff6ff 100%);
  color: #1e3a5f;
}

.gp-find-id-notice__icon {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 999px;
  background: #dbeafe;
  color: #2563eb;
  font-size: 1.25rem;
}

.gp-find-id-notice__body {
  flex: 1;
  min-width: 0;
}

.gp-find-id-notice__title {
  margin: 0 0 0.375rem;
  font-size: 1rem;
  font-weight: 700;
  color: #0f172a;
}

.gp-find-id-notice__lead {
  margin: 0 0 0.75rem;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #334155;
}

.gp-find-id-notice__lead strong {
  color: #1d4ed8;
  font-weight: 700;
}

.gp-find-id-notice__items {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin: 0 0 0.75rem;
  padding: 0;
  list-style: none;
}

.gp-find-id-notice__items li {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.35rem 0.75rem;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid #bfdbfe;
  font-size: 0.875rem;
  font-weight: 600;
  color: #1e40af;
}

.gp-find-id-notice__items li::before {
  content: "";
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 50%;
  background: #3b82f6;
}

.gp-find-id-notice__note {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.55;
  color: #475569;
}

.gp-find-id-notice__example {
  display: inline-block;
  margin-left: 0.25rem;
  padding: 0.1rem 0.45rem;
  border-radius: 0.25rem;
  background: #fff;
  border: 1px solid #cbd5e1;
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #0f172a;
}

.gp-find-id-help {
  padding: 1.125rem 1.25rem;
  border: 1px solid var(--gp-border);
  border-radius: var(--gp-radius-md);
  background: #fff;
}

.gp-find-id-help__title {
  margin: 0 0 0.625rem;
  font-size: 1rem;
  font-weight: 600;
  color: var(--gp-text);
}

.gp-find-id-help__list {
  margin: 0;
  padding-left: 1.25rem;
  font-size: 0.9375rem;
  line-height: 1.65;
  color: var(--gp-text-muted);
}

.gp-find-id-help__list li + li {
  margin-top: 0.5rem;
}

.gp-find-id-help__list a {
  color: var(--gp-primary);
  font-weight: 600;
  text-decoration: none;
}

.gp-find-id-help__list a:hover {
  text-decoration: underline;
}

.gp-find-id-help__list strong {
  font-weight: 700;
  color: var(--gp-text);
}

.gp-find-id-result__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  gap: 0.75rem;
}

.gp-find-id-result__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.125rem;
  border: 1px solid var(--gp-border);
  border-radius: var(--gp-radius-md);
  background: #fff;
}

.gp-find-id-result__label {
  font-size: 0.875rem;
  color: var(--gp-text-muted);
}

.gp-find-id-result__value {
  font-size: 1.125rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--gp-text);
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

.gp-find-password-result__hint {
  margin: 0.875rem 0 0;
  font-size: 0.875rem;
  line-height: 1.6;
  color: var(--gp-text-muted);
  text-align: center;
}

.gp-console-app-body {
  background: var(--gp-surface);
  overflow-x: hidden;
}

.gp-console-app {
  display: flex;
  min-height: 100vh;
}

.gp-console-sidebar {
  width: 260px;
  flex-shrink: 0;
  background: #fff;
  border-right: 1px solid var(--gp-border);
  display: flex;
  flex-direction: column;
  position: sticky;
  top: 0;
  height: 100vh;
  overflow-y: auto;
  z-index: 1030;
}

.gp-console-sidebar__brand {
  padding: 1.25rem 1.25rem 1rem;
  border-bottom: 1px solid var(--gp-border);
}

.gp-console-sidebar__brand-link {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  font-weight: 700;
  color: var(--gp-primary);
  text-decoration: none;
  font-size: 1rem;
}

.gp-console-sidebar__brand-link i {
  font-size: 1.125rem;
}

.gp-console-sidebar__nav {
  padding: 1rem 0.75rem 1.5rem;
  flex: 1;
}

.gp-console-sidebar__group {
  margin-bottom: 1.25rem;
}

.gp-console-sidebar__group-label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  color: var(--gp-text-muted);
  padding: 0 0.75rem;
  margin-bottom: 0.5rem;
}

.gp-console-sidebar__menu {
  list-style: none;
  margin: 0;
  padding: 0;
}

.gp-console-sidebar__link {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  width: 100%;
  padding: 0.625rem 0.75rem;
  border: none;
  border-radius: 10px;
  background: transparent;
  color: var(--gp-text);
  font-size: 0.9375rem;
  font-weight: 500;
  text-decoration: none;
  transition: background 0.15s, color 0.15s;
}

.gp-console-sidebar__link:hover {
  background: var(--gp-primary-light);
  color: var(--gp-primary);
}

.gp-console-sidebar__link--active {
  background: var(--gp-primary-light);
  color: var(--gp-primary);
  font-weight: 600;
}

.gp-console-sidebar__link--logout {
  color: #64748b;
}

.gp-console-app__main {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

.gp-console-topbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.875rem 1.5rem;
  background: #fff;
  border-bottom: 1px solid var(--gp-border);
  position: sticky;
  top: 0;
  z-index: 1020;
}

.gp-console-topbar__left {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  min-width: 0;
}

.gp-console-topbar__menu-btn {
  border: 1px solid var(--gp-border);
  background: #fff;
  border-radius: 8px;
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--gp-text);
}

.gp-console-topbar__title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--gp-navy);
  margin: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.gp-console-topbar__right {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-shrink: 0;
}

.gp-console-topbar__did {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0.5rem 0.95rem;
  border-radius: 999px;
  background: linear-gradient(135deg, #e8f1ff 0%, #d6e6ff 100%);
  border: 2px solid var(--gp-primary);
  box-shadow:
    0 0 0 3px rgba(0, 102, 255, 0.1),
    0 4px 14px rgba(0, 82, 204, 0.16);
  white-space: nowrap;
}

.gp-console-topbar__did-icon {
  font-size: 1.25rem;
  color: var(--gp-primary);
}

.gp-console-topbar__did-label {
  font-size: 0.8125rem;
  font-weight: 800;
  letter-spacing: 0.06em;
  color: var(--gp-primary);
}

.gp-console-topbar__did-sep {
  font-size: 1.0625rem;
  font-weight: 800;
  color: var(--gp-primary-dark);
  line-height: 1;
}

.gp-console-topbar__did-number {
  font-size: 1.0625rem;
  font-weight: 800;
  color: var(--gp-navy);
  font-variant-numeric: tabular-nums;
  letter-spacing: 0.03em;
}

.gp-console-topbar__did--unassigned {
  background: #f8fafc;
  border-color: #cbd5e1;
  box-shadow: none;
}

.gp-console-topbar__did--unassigned .gp-console-topbar__did-icon,
.gp-console-topbar__did--unassigned .gp-console-topbar__did-label,
.gp-console-topbar__did--unassigned .gp-console-topbar__did-sep {
  color: #64748b;
}

.gp-console-topbar__did--unassigned .gp-console-topbar__did-number {
  font-size: 0.875rem;
  font-weight: 700;
  color: #64748b;
}

/* 알림(종 모양) 버튼 — 읽지 않은 알림 수를 배지로 표시 */
.gp-console-topbar__notify {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border: 1px solid var(--gp-border);
  border-radius: 8px;
  background: #fff;
  color: var(--gp-text);
  font-size: 1.125rem;
  transition: background 0.15s ease, color 0.15s ease;
}

.gp-console-topbar__notify:hover {
  background: var(--gp-primary-light);
  color: var(--gp-primary);
}

.gp-console-topbar__notify-badge {
  position: absolute;
  top: -0.3rem;
  right: -0.3rem;
  min-width: 1.05rem;
  height: 1.05rem;
  padding: 0 0.3rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  background: #dc2626;
  color: #fff;
  font-size: 0.6875rem;
  font-weight: 700;
  line-height: 1;
}

/* 요청 티켓 배지 — 알림(빨강)과 구분되도록 프라이머리 색 사용 */
.gp-console-topbar__notify-badge--ticket {
  background: var(--gp-primary);
}

.gp-console-topbar__user {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--gp-navy);
  white-space: nowrap;
}

.gp-console-topbar__user .gp-console-badge {
  font-size: 0.875rem;
  padding: 0.3rem 0.7rem;
}

.gp-console-content {
  flex: 1;
  padding: 1.5rem;
}

.gp-console-sidebar-overlay {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.4);
  z-index: 1025;
}

.gp-dashboard-head {
  width: 100%;
}

.gp-dashboard-head .gp-console-topbar__did {
  flex-shrink: 0;
  margin-left: auto;
  gap: 0.55rem;
  padding: 0.75rem 1.35rem;
  border-width: 3px;
  box-shadow:
    0 0 0 4px rgba(0, 102, 255, 0.12),
    0 6px 20px rgba(0, 82, 204, 0.2);
}

.gp-dashboard-head .gp-console-topbar__did-icon {
  font-size: 1.75rem;
}

.gp-dashboard-head .gp-console-topbar__did-label {
  font-size: 1.0625rem;
}

.gp-dashboard-head .gp-console-topbar__did-sep {
  font-size: 1.3125rem;
}

.gp-dashboard-head .gp-console-topbar__did-number {
  font-size: 1.5rem;
}

.gp-dashboard-head .gp-console-topbar__did--unassigned .gp-console-topbar__did-number {
  font-size: 1.125rem;
}

.gp-console-page__heading {
  font-size: 1.375rem;
  font-weight: 700;
  color: var(--gp-navy);
  margin-bottom: 0.375rem;
}

.gp-console-page__desc {
  color: var(--gp-text-muted);
  font-size: var(--gp-type-body-size);
  line-height: var(--gp-type-body-lh);
}

.gp-console-panel {
  background: #fff;
  border: 1px solid var(--gp-border);
  border-radius: var(--gp-radius-lg);
  padding: 1.25rem 1.5rem;
  box-shadow: var(--gp-shadow);
}

.gp-console-panel__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.gp-console-panel__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--gp-navy);
  margin: 0;
}

.gp-console-panel__link {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--gp-primary);
  text-decoration: none;
}

.gp-console-panel__link:hover {
  color: var(--gp-primary-dark);
}

.gp-console-stat-card {
  display: flex;
  align-items: center;
  gap: 1rem;
  background: #fff;
  border: 1px solid var(--gp-border);
  border-radius: var(--gp-radius-lg);
  padding: 1.25rem;
  height: 100%;
  box-shadow: var(--gp-shadow);
}

.gp-console-stat-card__icon {
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.25rem;
  flex-shrink: 0;
}

.gp-console-stat-card--primary .gp-console-stat-card__icon {
  background: var(--gp-primary-light);
  color: var(--gp-primary);
}

.gp-console-stat-card--success .gp-console-stat-card__icon {
  background: #ecfdf5;
  color: #059669;
}

.gp-console-stat-card--info .gp-console-stat-card__icon {
  background: #eff6ff;
  color: #2563eb;
}

.gp-console-stat-card--warning .gp-console-stat-card__icon {
  background: #fffbeb;
  color: #d97706;
}

.gp-console-stat-card--danger .gp-console-stat-card__icon {
  background: #fef2f2;
  color: #dc2626;
}

.gp-console-stat-card__label {
  font-size: 0.9375rem;
  color: var(--gp-text-muted);
}

.gp-console-stat-card__value {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--gp-navy);
}

.gp-console-stat-card__valrow {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.25rem 0.5rem;
}

.gp-console-stat-card__delta {
  display: inline-flex;
  align-items: center;
  font-size: 0.75rem;
  font-weight: 600;
  color: #94a3b8;
}

.gp-console-stat-card__delta i {
  font-size: 1rem;
  margin-right: -0.1rem;
}

.gp-console-stat-card__delta--up {
  color: #059669;
}

.gp-console-stat-card__delta--down {
  color: #dc2626;
}

/* ── 대시보드 위젯 (처리 필요/알림, 사용량 게이지) ── */

.gp-dash-alert-count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 1.5rem;
  height: 1.5rem;
  padding: 0 0.4rem;
  border-radius: 999px;
  background: #fef2f2;
  color: #dc2626;
  font-size: 0.8125rem;
  font-weight: 700;
}

.gp-dash-alert-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.gp-dash-alert {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  padding: 0.75rem 0.875rem;
  border: 1px solid var(--gp-border);
  border-left-width: 3px;
  border-radius: 10px;
  background: #fff;
  text-decoration: none;
  transition: background 0.15s, border-color 0.15s, transform 0.15s;
}

.gp-dash-alert:hover {
  background: #f8fafc;
  transform: translateX(2px);
}

.gp-dash-alert__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  border-radius: 8px;
  font-size: 1.125rem;
  flex-shrink: 0;
}

.gp-dash-alert__body {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}

.gp-dash-alert__label {
  font-size: 0.9375rem;
  font-weight: 700;
  color: var(--gp-navy);
}

.gp-dash-alert__count {
  color: inherit;
}

.gp-dash-alert__desc {
  font-size: 0.8125rem;
  color: #64748b;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.gp-dash-alert__chevron {
  color: #cbd5e1;
  flex-shrink: 0;
}

.gp-dash-alert--danger {
  border-left-color: #dc2626;
}
.gp-dash-alert--danger .gp-dash-alert__icon {
  background: #fef2f2;
  color: #dc2626;
}

.gp-dash-alert--warning {
  border-left-color: #d97706;
}
.gp-dash-alert--warning .gp-dash-alert__icon {
  background: #fffbeb;
  color: #d97706;
}

.gp-dash-alert--info {
  border-left-color: #2563eb;
}
.gp-dash-alert--info .gp-dash-alert__icon {
  background: #eff6ff;
  color: #2563eb;
}

.gp-dash-alert--success {
  border-left-color: #059669;
}
.gp-dash-alert--success .gp-dash-alert__icon {
  background: #ecfdf5;
  color: #059669;
}

.gp-dash-alert-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 2rem 1rem;
  color: #64748b;
}

.gp-dash-alert-empty i {
  font-size: 1.75rem;
  color: #34d399;
}

.gp-dash-usage {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

.gp-dash-usage__top {
  display: flex;
  align-items: baseline;
  gap: 0.375rem;
}

.gp-dash-usage__used {
  font-size: 1.75rem;
  font-weight: 800;
  color: var(--gp-navy);
  letter-spacing: -0.02em;
}

.gp-dash-usage__total {
  font-size: 1rem;
  font-weight: 600;
  color: #94a3b8;
}

.gp-dash-usage__bar {
  height: 0.625rem;
  border-radius: 999px;
  background: #f1f5f9;
  overflow: hidden;
}

.gp-dash-usage__bar-fill {
  height: 100%;
  border-radius: 999px;
  background: var(--gp-primary);
}

.gp-dash-usage__bar-fill--warning {
  background: #d97706;
}

.gp-dash-usage__bar-fill--danger {
  background: #dc2626;
}

.gp-dash-usage__meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  font-size: 0.8125rem;
  color: #64748b;
}

.gp-dash-usage__billing {
  font-weight: 700;
  color: var(--gp-navy);
}

.gp-console-table {
  font-size: 0.875rem;
}

.gp-console-table--center thead th,
.gp-console-table--center tbody td {
  text-align: center;
}

.gp-console-table thead th {
  background: #f8fafc;
  color: var(--gp-text-muted);
  font-weight: 600;
  border-bottom: 1px solid var(--gp-border);
  white-space: nowrap;
}

.gp-console-table tbody td {
  vertical-align: middle;
  border-color: var(--gp-border);
}

/* 행 수가 적은 표(대시보드 최근 통화내역)에서 카드 세로폭을 유지하기 위해 행 높이를 키웁니다. */
.gp-console-table--roomy tbody td {
  padding-top: 0.85rem;
  padding-bottom: 0.85rem;
}

.gp-console-badge {
  display: inline-block;
  padding: 0.2rem 0.5rem;
  border-radius: 6px;
  font-size: 0.75rem;
  font-weight: 600;
}

/* 콜백관리 — 상태 배지 데이터 한 단계 크게 */
[data-callback-status].gp-console-badge {
  font-size: 0.8125rem;
}

.gp-console-badge--success { background: #ecfdf5; color: #047857; }
.gp-console-badge--info { background: #eff6ff; color: #1d4ed8; }
.gp-console-badge--warning { background: #fffbeb; color: #b45309; }
.gp-console-badge--muted { background: #f1f5f9; color: #64748b; }
.gp-console-badge--danger { background: #fef2f2; color: #dc2626; }
.gp-console-badge--primary { background: var(--gp-primary-light); color: var(--gp-primary); }

/* 계정정보 — 비밀번호 변경 버튼 */
.gp-account-password-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  min-height: calc(1.5em + 0.75rem + 2px);
  font-weight: 700;
  box-shadow: 0 4px 14px rgba(0, 102, 255, 0.22);
}

.gp-account-password-btn:hover,
.gp-account-password-btn:focus-visible {
  box-shadow: 0 8px 22px rgba(0, 102, 255, 0.32);
}

.gp-account-password-btn .bi {
  font-size: 1.05rem;
}

/* 계정정보 — 담당자 목록 */
.gp-account-grade-field {
  display: flex;
  align-items: center;
  min-height: calc(1.5em + 0.75rem + 2px);
}

.gp-account-grade-field .gp-console-badge {
  font-size: 1.0625rem;
  font-weight: 700;
  padding: 0.45rem 1.1rem;
  border-radius: 8px;
}

.gp-account-managers__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}

.gp-account-table th,
.gp-account-table td {
  vertical-align: middle;
}

/* 행 수가 적어 공지사항처럼 크고 읽기 쉽게 키웁니다. */
.gp-account-table {
  font-size: 1rem;
}

.gp-account-table thead th {
  font-size: 0.9375rem;
  padding-top: 0.95rem;
  padding-bottom: 0.95rem;
}

.gp-account-table tbody td {
  padding-top: 1.05rem;
  padding-bottom: 1.05rem;
}

.gp-account-table .gp-console-badge {
  font-size: 0.875rem;
  padding: 0.3rem 0.7rem;
}

.gp-account-row-actions {
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.35rem;
}

.gp-account-action-badge {
  display: inline-flex;
  align-items: center;
  border: none;
  border-radius: 6px;
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1.2;
  padding: 0.3rem 0.65rem;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, box-shadow 0.15s;
}

.gp-account-action-badge--password {
  background: #eff6ff;
  color: #1d4ed8;
}

.gp-account-action-badge--password:hover,
.gp-account-action-badge--password:focus-visible {
  background: #dbeafe;
  color: #1e40af;
  box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.18);
}

.gp-account-self-tag {
  display: inline-block;
  margin-left: 0.375rem;
  padding: 0.05rem 0.4rem;
  border-radius: 5px;
  font-size: 0.75rem;
  font-weight: 600;
  background: var(--gp-primary-light);
  color: var(--gp-primary);
  vertical-align: middle;
}

.gp-console-verify {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem 0.875rem;
  margin-bottom: 1.5rem;
  padding: 1rem 1.25rem;
  border-radius: 12px;
  border: 1px solid var(--gp-border);
  border-left-width: 4px;
  background: #fff;
}

.gp-console-verify__label {
  font-weight: 700;
  color: var(--gp-navy);
}

.gp-console-verify__desc {
  font-size: 0.9375rem;
  color: var(--gp-text-muted);
}

.gp-console-verify .gp-console-badge {
  font-size: 0.875rem;
  padding: 0.3rem 0.7rem;
}

.gp-console-verify--success { border-left-color: #047857; background: #f0fdf9; }
.gp-console-verify--warning { border-left-color: #b45309; background: #fffbeb; }
.gp-console-verify--danger { border-left-color: #dc2626; background: #fef2f2; }

.gp-console-status-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.gp-console-status-list__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.875rem 0;
  border-bottom: 1px solid var(--gp-border);
}

.gp-console-status-list__item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

/* AI 상담원 상태 — 한 줄 표시 (제목 + 상태 인라인) */
.gp-console-status-list__info {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.25rem 0.625rem;
  min-width: 0;
}

.gp-console-status-list__state {
  font-size: 0.8125rem;
  font-weight: 600;
}

.gp-console-status-list__state--done {
  color: #059669;
}

.gp-console-status-list__state--todo {
  color: #d97706;
}

/* 좌측 통화내역 카드와 밑선을 맞추기 위해 목록을 세로로 균등 분배 */
.gp-console-status-list--fill {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

/* AI 설정 확인 목록 — 살짝 들여쓰기하고 항목 라벨 폰트를 한 단계 작게 */
.gp-console-status-list--indent {
  padding-left: 0.75rem;
}

.gp-console-status-list--indent .gp-console-status-list__info .fw-semibold {
  font-size: 0.875rem;
}

/* 사용량 패널 — 플랜 업그레이드 권유 */
.gp-dash-upgrade {
  margin-top: auto;
  padding-top: 1.25rem;
  border-top: 1px solid var(--gp-border);
}

.gp-dash-upgrade__head {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  margin-bottom: 0.5rem;
}

.gp-dash-upgrade__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.25rem;
  height: 2.25rem;
  flex-shrink: 0;
  border-radius: 10px;
  background: var(--gp-primary-light);
  color: var(--gp-primary);
  font-size: 1.125rem;
}

.gp-dash-upgrade__title {
  margin: 0;
  font-size: 1rem;
  font-weight: 700;
  color: var(--gp-navy);
}

.gp-dash-upgrade__desc {
  margin: 0 0 0.875rem;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: var(--gp-text-muted);
}

/* ── 공지사항 (대시보드 위젯) ── */

.gp-dash-notice-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
}

.gp-dash-notice-list > li {
  border-bottom: 1px solid var(--gp-border);
}

.gp-dash-notice-list > li:last-child {
  border-bottom: none;
}

.gp-dash-notice {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 0.5rem 0.625rem;
  padding: 0.75rem 0;
  text-decoration: none;
  color: inherit;
}

.gp-dash-notice:hover {
  color: inherit;
}

.gp-dash-notice:hover .gp-dash-notice__title {
  color: var(--gp-primary);
}

.gp-dash-notice__title {
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--gp-navy);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.gp-dash-notice__date {
  font-size: 0.75rem;
  color: var(--gp-text-muted);
  white-space: nowrap;
}

/* ── 공지사항 페이지 ── */

/* 공지사항 — 분류 필터 버튼 */
.gp-notice-filter {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.375rem;
}

.gp-notice-filter__btn {
  padding: 0.4rem 0.85rem;
  border: 1px solid var(--gp-border);
  border-radius: 999px;
  background: #fff;
  color: var(--gp-text-muted);
  font-size: 0.8125rem;
  font-weight: 600;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.gp-notice-filter__btn:hover {
  border-color: var(--gp-primary);
  color: var(--gp-primary);
}

.gp-notice-filter__btn--active {
  background: var(--gp-primary);
  border-color: var(--gp-primary);
  color: #fff;
}

.gp-notice-filter__btn--active:hover {
  color: #fff;
}

/* 공지사항 — 아코디언 목록 */
.gp-notice-accordion {
  --bs-accordion-border-color: var(--gp-border);
  --bs-accordion-btn-focus-box-shadow: 0 0 0 3px var(--gp-primary-light);
  --bs-accordion-active-bg: #f8fafc;
  --bs-accordion-active-color: var(--gp-navy);
  --bs-accordion-btn-color: var(--gp-navy);
  border-radius: 10px;
  overflow: hidden;
}

.gp-notice-item__btn {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem 0.75rem;
  font-weight: 600;
}

.gp-notice-item__btn::after {
  margin-left: 0.5rem;
}

.gp-notice-item__title {
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--gp-navy);
}

.gp-notice-item__date {
  margin-left: auto;
  font-size: 0.8125rem;
  color: var(--gp-text-muted);
  white-space: nowrap;
}

.gp-notice-item__content {
  font-size: 0.9375rem;
  line-height: 1.6;
  color: #475569;
}

/* ── 알림정보 페이지 ── */

a.gp-console-topbar__notify {
  text-decoration: none;
}

.gp-notify-summary .gp-console-stat-card {
  height: 100%;
  padding: 1.5rem 1.75rem;
  gap: 1.25rem;
}

.gp-notify-summary .gp-console-stat-card__icon {
  width: 4.25rem;
  height: 4.25rem;
  border-radius: 12px;
  font-size: 2rem;
}

.gp-notify-summary .gp-console-stat-card__label {
  font-size: 1.1875rem;
  font-weight: 600;
  margin-bottom: 0.25rem;
}

.gp-notify-summary .gp-console-stat-card__value {
  font-size: 3rem;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.02em;
}

.gp-notify-toolbar {
  gap: 0.875rem;
}

.gp-notify-toolbar__filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.25rem;
}

.gp-notify-filter {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.375rem;
}

.gp-notify-filter__btn {
  padding: 0.4rem 0.85rem;
  border: 1px solid var(--gp-border);
  border-radius: 999px;
  background: #fff;
  color: var(--gp-text-muted);
  font-size: 0.8125rem;
  font-weight: 600;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

.gp-notify-filter__btn:hover {
  border-color: var(--gp-primary);
  color: var(--gp-primary);
}

/* 확인 상태 — 프라이머리(파랑) */
.gp-notify-filter--read .gp-notify-filter__btn:hover {
  border-color: var(--gp-primary);
  color: var(--gp-primary);
}

.gp-notify-filter--read .gp-notify-filter__btn--active-read {
  background: var(--gp-primary);
  border-color: var(--gp-primary);
  color: #fff;
}

.gp-notify-filter--read .gp-notify-filter__btn--active-read:hover {
  color: #fff;
}

/* 중요도 — 앰버 */
.gp-notify-filter--priority .gp-notify-filter__btn {
  border-color: #fcd34d;
  color: #92400e;
}

.gp-notify-filter--priority .gp-notify-filter__btn:hover {
  border-color: #f59e0b;
  color: #b45309;
  background: #fffbeb;
}

.gp-notify-filter--priority .gp-notify-filter__btn--active-priority {
  background: #f59e0b;
  border-color: #f59e0b;
  color: #fff;
}

.gp-notify-filter--priority .gp-notify-filter__btn--active-priority:hover {
  background: #d97706;
  border-color: #d97706;
  color: #fff;
}

/* 분류 — 바이올렛 */
.gp-notify-filter--category .gp-notify-filter__btn {
  border-color: #c4b5fd;
  color: #5b21b6;
}

.gp-notify-filter--category .gp-notify-filter__btn:hover {
  border-color: #8b5cf6;
  color: #6d28d9;
  background: #f5f3ff;
}

.gp-notify-filter--category .gp-notify-filter__btn--active-category {
  background: #7c3aed;
  border-color: #7c3aed;
  color: #fff;
}

.gp-notify-filter--category .gp-notify-filter__btn--active-category:hover {
  background: #6d28d9;
  border-color: #6d28d9;
  color: #fff;
}

.gp-notify-table {
  table-layout: fixed;
  width: 100%;
}

.gp-notify-table__col-priority {
  width: 5.5rem;
}

.gp-notify-table__col-category {
  width: 4.5rem;
}

.gp-notify-table__col-read {
  width: 5.5rem;
}

.gp-notify-table__col-date {
  width: 9.5rem;
}

.gp-notify-table__col-action {
  width: 4.5rem;
}

.gp-notify-table__col-title {
  width: auto;
}

.gp-notify-table__title-cell {
  min-width: 0;
  width: 100%;
}

.gp-notify-table__title {
  display: block;
  font-weight: 600;
  color: var(--gp-navy);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.gp-notify-table__title--unread {
  font-weight: 700;
}

.gp-notify-table__preview {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.8125rem;
  color: var(--gp-text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

.gp-notify-table__row--unread {
  background: #f8fbff;
}

.gp-notify-table__row--unread td {
  border-bottom-color: #e2e8f0;
}

.gp-notify-modal__head {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  flex: 1;
  min-width: 0;
  padding-right: 1rem;
}

.gp-notify-modal__title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--gp-navy);
  margin-bottom: 0.75rem;
}

.gp-notify-modal__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem 1.25rem;
  font-size: 0.875rem;
  color: var(--gp-text-muted);
  margin-bottom: 1rem;
}

.gp-notify-modal__meta strong {
  color: var(--gp-navy);
  font-weight: 600;
}

.gp-notify-modal__content {
  font-size: 0.9375rem;
  line-height: 1.65;
  color: #475569;
  white-space: pre-wrap;
}

/* ── 티켓관리 페이지 ── */

a.gp-console-topbar__notify--ticket {
  text-decoration: none;
}

.gp-ticket-summary .gp-console-stat-card {
  height: 100%;
  padding: 1.5rem 1.75rem;
  gap: 1.25rem;
}

.gp-ticket-summary .gp-console-stat-card__icon {
  width: 4.25rem;
  height: 4.25rem;
  border-radius: 12px;
  font-size: 2rem;
}

.gp-ticket-summary .gp-console-stat-card__label {
  font-size: 1.1875rem;
  font-weight: 600;
  margin-bottom: 0.25rem;
}

.gp-ticket-summary .gp-console-stat-card__value {
  font-size: 3rem;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: -0.02em;
}

.gp-ticket-toolbar {
  gap: 0.875rem;
}

.gp-ticket-toolbar__filters {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1.25rem;
}

.gp-ticket-filter {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.375rem;
}

.gp-ticket-filter__btn {
  padding: 0.4rem 0.85rem;
  border: 1px solid var(--gp-border);
  border-radius: 999px;
  background: #fff;
  font-size: 0.8125rem;
  font-weight: 600;
  transition: background 0.15s ease, color 0.15s ease, border-color 0.15s ease;
}

/* 상태 — 프라이머리(파랑) */
.gp-ticket-filter--status .gp-ticket-filter__btn {
  color: var(--gp-text-muted);
}

.gp-ticket-filter--status .gp-ticket-filter__btn:hover {
  border-color: var(--gp-primary);
  color: var(--gp-primary);
}

.gp-ticket-filter--status .gp-ticket-filter__btn--active-status {
  background: var(--gp-primary);
  border-color: var(--gp-primary);
  color: #fff;
}

.gp-ticket-filter--status .gp-ticket-filter__btn--active-status:hover {
  color: #fff;
}

/* 유형 — 틸 */
.gp-ticket-filter--category .gp-ticket-filter__btn {
  border-color: #5eead4;
  color: #0f766e;
}

.gp-ticket-filter--category .gp-ticket-filter__btn:hover {
  border-color: #14b8a6;
  color: #0d9488;
  background: #f0fdfa;
}

.gp-ticket-filter--category .gp-ticket-filter__btn--active-category {
  background: #0d9488;
  border-color: #0d9488;
  color: #fff;
}

.gp-ticket-filter--category .gp-ticket-filter__btn--active-category:hover {
  background: #0f766e;
  border-color: #0f766e;
  color: #fff;
}

/* 우선순위 — 앰버 */
.gp-ticket-filter--priority .gp-ticket-filter__btn {
  border-color: #fcd34d;
  color: #92400e;
}

.gp-ticket-filter--priority .gp-ticket-filter__btn:hover {
  border-color: #f59e0b;
  color: #b45309;
  background: #fffbeb;
}

.gp-ticket-filter--priority .gp-ticket-filter__btn--active-priority {
  background: #f59e0b;
  border-color: #f59e0b;
  color: #fff;
}

.gp-ticket-filter--priority .gp-ticket-filter__btn--active-priority:hover {
  background: #d97706;
  border-color: #d97706;
  color: #fff;
}

.gp-ticket-table {
  table-layout: fixed;
  width: 100%;
}

.gp-ticket-table__col-id {
  width: 7.5rem;
}

.gp-ticket-table__col-category {
  width: 5.5rem;
}

.gp-ticket-table__col-priority {
  width: 5rem;
}

.gp-ticket-table__col-status {
  width: 5.5rem;
}

.gp-ticket-table__col-requester {
  width: 5rem;
}

.gp-ticket-table__col-date {
  width: 9.5rem;
}

.gp-ticket-table__col-action {
  width: 4.5rem;
}

.gp-ticket-table__col-title {
  width: auto;
}

.gp-ticket-table__id {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.8125rem;
  color: var(--gp-primary);
}

.gp-ticket-table__title-cell {
  min-width: 0;
  width: 100%;
}

.gp-ticket-table__title {
  display: block;
  font-weight: 600;
  color: var(--gp-navy);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.gp-ticket-table__preview {
  display: block;
  margin-top: 0.2rem;
  font-size: 0.8125rem;
  color: var(--gp-text-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}

.gp-ticket-table__row--active {
  background: #f8fbff;
}

.gp-ticket-table__row--active td {
  border-bottom-color: #e2e8f0;
}

.gp-ticket-modal__head {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
  flex: 1;
  min-width: 0;
  padding-right: 1rem;
}

.gp-ticket-modal__id {
  font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--gp-primary);
}

.gp-ticket-modal__title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--gp-navy);
  margin-bottom: 1rem;
}

.gp-ticket-modal__meta {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(10rem, 1fr));
  gap: 0.75rem 1.25rem;
  margin-bottom: 1.25rem;
  padding: 0.875rem 1rem;
  background: #f8fafc;
  border-radius: 10px;
  border: 1px solid var(--gp-border);
}

.gp-ticket-modal__meta dt {
  font-size: 0.75rem;
  color: var(--gp-text-muted);
  margin-bottom: 0.15rem;
}

.gp-ticket-modal__meta dd {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--gp-navy);
  margin: 0;
}

.gp-ticket-modal__desc {
  font-size: 0.9375rem;
  line-height: 1.65;
  color: #475569;
  white-space: pre-wrap;
  margin-bottom: 1.25rem;
}

.gp-ticket-thread__label {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--gp-navy);
  margin-bottom: 0.75rem;
}

.gp-ticket-thread__list {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.gp-ticket-thread__item {
  padding: 0.875rem 1rem;
  border: 1px solid var(--gp-border);
  border-radius: 10px;
  background: #fff;
}

.gp-ticket-thread__item--support {
  background: #f0f9ff;
  border-color: #bae6fd;
}

.gp-ticket-thread__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  margin-bottom: 0.5rem;
  font-size: 0.8125rem;
}

.gp-ticket-thread__role {
  color: var(--gp-text-muted);
}

.gp-ticket-thread__time {
  margin-left: auto;
  color: var(--gp-text-muted);
  font-size: 0.75rem;
}

.gp-ticket-thread__body {
  margin: 0;
  font-size: 0.875rem;
  line-height: 1.6;
  color: #475569;
}

.gp-ticket-thread__empty {
  font-size: 0.875rem;
}

.gp-console-quick-link {
  display: flex;
  align-items: center;
  gap: 0.875rem;
  padding: 0.875rem 1rem;
  border: 1px solid var(--gp-border);
  border-radius: 10px;
  text-decoration: none;
  color: inherit;
  transition: border-color 0.15s, box-shadow 0.15s;
}

.gp-console-quick-link:hover {
  border-color: var(--gp-primary);
  box-shadow: 0 4px 12px rgba(0, 102, 255, 0.08);
  color: inherit;
}

.gp-console-quick-link i:first-child {
  font-size: 1.25rem;
  color: var(--gp-primary);
}

.gp-console-quick-link span {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}

.gp-console-quick-link small {
  color: var(--gp-text-muted);
}

.gp-console-bar-chart {
  display: flex;
  align-items: flex-end;
  gap: 1rem;
  height: 180px;
  padding-top: 1rem;
}

.gp-console-bar-chart__item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}

.gp-console-bar-chart__bar-wrap {
  width: 100%;
  max-width: 48px;
  height: 140px;
  display: flex;
  align-items: flex-end;
  background: #f1f5f9;
  border-radius: 8px 8px 4px 4px;
  overflow: hidden;
}

.gp-console-bar-chart__bar {
  width: 100%;
  background: linear-gradient(180deg, #4d9fff 0%, var(--gp-primary) 100%);
  border-radius: 8px 8px 0 0;
  min-height: 8px;
}

.gp-console-bar-chart__label {
  font-size: 0.75rem;
  color: var(--gp-text-muted);
}

/* ───────────── 사용량 통계 페이지 ───────────── */

.gp-usage-period-note {
  font-size: 0.8125rem;
  color: var(--gp-text-muted);
}

.gp-usage-caption {
  margin: 0.75rem 0 0;
  font-size: 0.75rem;
  color: var(--gp-text-muted);
}

/* 범례 (공용) */
.gp-usage-legend {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 0.25rem 1rem;
}

.gp-usage-legend__item {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.8125rem;
  color: var(--gp-text-muted);
}

.gp-usage-dot {
  width: 0.625rem;
  height: 0.625rem;
  border-radius: 50%;
  display: inline-block;
  flex-shrink: 0;
}

/* 일별 통화량 누적 스택 막대 */
.gp-usage-stackbar {
  display: flex;
  align-items: flex-end;
  gap: 0.75rem;
  height: 200px;
  padding-top: 1.25rem;
}

.gp-usage-stackbar__item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.4rem;
  min-width: 0;
  height: 100%;
  justify-content: flex-end;
}

.gp-usage-stackbar__total {
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--gp-text-muted);
}

.gp-usage-stackbar__col {
  width: 100%;
  max-width: 46px;
  height: 150px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background: #f1f5f9;
  border-radius: 6px;
  overflow: hidden;
}

.gp-usage-stackbar__seg {
  width: 100%;
  min-height: 2px;
}

.gp-usage-stackbar__seg:last-child {
  border-radius: 6px 6px 0 0;
}

.gp-usage-stackbar__label {
  font-size: 0.75rem;
  color: var(--gp-text-muted);
}

/* 응대 결과 도넛 */
.gp-usage-donut-wrap {
  display: flex;
  align-items: center;
  gap: 1.5rem;
  flex-wrap: wrap;
}

.gp-usage-donut {
  width: 160px;
  height: 160px;
  border-radius: 50%;
  position: relative;
  flex-shrink: 0;
}

.gp-usage-donut__hole {
  position: absolute;
  inset: 26px;
  background: #fff;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.gp-usage-donut__num {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--gp-navy);
  line-height: 1.1;
}

.gp-usage-donut__cap {
  font-size: 0.75rem;
  color: var(--gp-text-muted);
}

.gp-usage-donut-legend {
  list-style: none;
  margin: 0;
  padding: 0;
  flex: 1;
  min-width: 180px;
}

.gp-usage-donut-legend li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 0;
  border-bottom: 1px solid var(--gp-border);
}

.gp-usage-donut-legend li:last-child {
  border-bottom: none;
}

.gp-usage-donut-legend__label {
  font-size: 0.875rem;
  color: var(--gp-navy);
}

.gp-usage-donut-legend__val {
  margin-left: auto;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--gp-text-muted);
  white-space: nowrap;
}

/* 요일×시간대 히트맵 */
.gp-usage-heatmap {
  display: flex;
  flex-direction: column;
  gap: 4px;
  overflow-x: auto;
}

.gp-usage-heatmap__row {
  display: flex;
  align-items: center;
  gap: 4px;
}

.gp-usage-heatmap__daylabel {
  width: 1.5rem;
  flex-shrink: 0;
  font-size: 0.75rem;
  color: var(--gp-text-muted);
  text-align: center;
}

.gp-usage-heatmap__hour {
  flex: 1;
  min-width: 22px;
  font-size: 0.6875rem;
  color: var(--gp-text-muted);
  text-align: center;
}

.gp-usage-heatmap__cell {
  flex: 1;
  min-width: 22px;
  height: 22px;
  border-radius: 4px;
  background: #f1f5f9;
}

.gp-usage-heatmap__cell--lvl0 { background: #f1f5f9; }
.gp-usage-heatmap__cell--lvl1 { background: #cfe2ff; }
.gp-usage-heatmap__cell--lvl2 { background: #8ec0ff; }
.gp-usage-heatmap__cell--lvl3 { background: #4d9fff; }
.gp-usage-heatmap__cell--lvl4 { background: var(--gp-primary); }

.gp-usage-heatmap__legend {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  margin-top: 0.75rem;
  font-size: 0.75rem;
  color: var(--gp-text-muted);
}

.gp-usage-heatmap__legend .gp-usage-heatmap__cell {
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  min-width: 18px;
}

.gp-usage-insight {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  margin-top: 1rem;
  padding: 0.75rem 0.875rem;
  background: #f0f7ff;
  border: 1px solid #bfdbfe;
  border-radius: 10px;
  font-size: 0.8125rem;
  line-height: 1.5;
  color: #1e3a8a;
}

.gp-usage-insight i {
  color: var(--gp-primary);
  margin-top: 0.1rem;
}

/* 콜백 회수 funnel */
.gp-usage-funnel {
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}

.gp-usage-funnel__meta {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 0.3rem;
}

.gp-usage-funnel__label {
  font-size: 0.875rem;
  color: var(--gp-navy);
}

.gp-usage-funnel__count {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--gp-text-muted);
}

.gp-usage-funnel__track {
  background: #f1f5f9;
  border-radius: 8px;
  height: 1.5rem;
  overflow: hidden;
}

.gp-usage-funnel__fill {
  height: 100%;
  border-radius: 8px;
}

.gp-usage-funnel__fill--danger { background: #f59e0b; }
.gp-usage-funnel__fill--warning { background: #4d9fff; }
.gp-usage-funnel__fill--success { background: var(--gp-primary); }

/* 상담 주제 Top5 */
.gp-usage-topics {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.875rem;
}

.gp-usage-topics__item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.gp-usage-topics__rank {
  width: 1.5rem;
  height: 1.5rem;
  flex-shrink: 0;
  border-radius: 50%;
  background: var(--gp-primary-light);
  color: var(--gp-primary);
  font-size: 0.75rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}

.gp-usage-topics__body {
  flex: 1;
  min-width: 0;
}

.gp-usage-topics__meta {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: 0.3rem;
}

.gp-usage-topics__label {
  font-size: 0.875rem;
  color: var(--gp-navy);
}

.gp-usage-topics__val {
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--gp-text-muted);
}

.gp-usage-topics__track {
  background: #f1f5f9;
  border-radius: 6px;
  height: 0.5rem;
  overflow: hidden;
}

.gp-usage-topics__fill {
  height: 100%;
  background: var(--gp-primary);
  border-radius: 6px;
}

/* 플랜 사용량 + 월말 예상 */
.gp-usage-plan__top {
  display: flex;
  align-items: baseline;
  gap: 0.375rem;
  margin-bottom: 0.5rem;
}

.gp-usage-plan__used {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--gp-navy);
}

.gp-usage-plan__total {
  font-size: 0.9375rem;
  color: var(--gp-text-muted);
}

.gp-usage-plan__bar {
  position: relative;
  height: 0.875rem;
  background: #f1f5f9;
  border-radius: 999px;
  overflow: visible;
}

.gp-usage-plan__bar-fill {
  height: 100%;
  border-radius: 999px;
}

.gp-usage-plan__bar-fill--primary { background: var(--gp-primary); }
.gp-usage-plan__bar-fill--warning { background: #f59e0b; }
.gp-usage-plan__bar-fill--danger { background: #dc2626; }

.gp-usage-plan__bar-projected {
  position: absolute;
  top: -4px;
  bottom: -4px;
  width: 2px;
  background: var(--gp-navy);
  transform: translateX(-1px);
}

.gp-usage-plan__bar-projected::after {
  content: "예상";
  position: absolute;
  top: -1.25rem;
  left: 50%;
  transform: translateX(-50%);
  font-size: 0.625rem;
  font-weight: 600;
  color: var(--gp-navy);
  white-space: nowrap;
}

.gp-usage-plan__scale {
  display: flex;
  justify-content: space-between;
  margin-top: 0.5rem;
  font-size: 0.75rem;
  color: var(--gp-text-muted);
}

.gp-usage-plan-side {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.gp-usage-plan-stat {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}

.gp-usage-plan-stat__label {
  font-size: 0.875rem;
  color: var(--gp-text-muted);
}

.gp-usage-plan-stat__value {
  font-size: 1.0625rem;
  font-weight: 700;
  color: var(--gp-navy);
}

.gp-usage-plan-stat__value--over {
  color: #dc2626;
}

.gp-usage-plan-warn {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.625rem 0.75rem;
  background: #fffbeb;
  border: 1px solid #fde68a;
  border-radius: 10px;
  font-size: 0.8125rem;
  color: #b45309;
}

.gp-usage-export {
  background: none;
  border: none;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}

/* ── Console page notices ── */

.gp-console-notice {
  margin-bottom: 1.5rem;
  padding: 0.875rem 1rem;
  border-radius: 10px;
  background: #f0f7ff;
  border: 1px solid #bfdbfe;
}

.gp-console-notice .gp-console-intro {
  color: #1e3a8a;
  font-size: 1rem;
  line-height: 1.6;
  font-weight: 500;
  margin: 0;
}

.gp-console-notice .gp-console-intro + .gp-console-intro {
  margin-top: 0.375rem;
}

/* ── Business hours (app-style) ── */

.gp-bh-intro {
  color: var(--gp-text-muted);
  font-size: 1rem;
  line-height: 1.6;
}

.gp-bh-notice {
  margin-top: 1rem;
  padding: 0.875rem 1rem;
  border-radius: 10px;
  background: #fffbeb;
  border: 1px solid #fde68a;
}

.gp-bh-notice .gp-bh-intro {
  color: #92400e;
  font-weight: 600;
}

.gp-bh-days {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.gp-bh-day-card {
  background: #fff;
  border: 1px solid var(--gp-border);
  border-radius: 14px;
  padding: 1rem 1.125rem;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}

.gp-bh-day-card--off {
  background: #fafbfc;
}

.gp-bh-day-card__main {
  display: flex;
  align-items: center;
  gap: 0.875rem;
}

.gp-bh-day-badge {
  flex-shrink: 0;
  width: 2.75rem;
  height: 2.75rem;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1rem;
  font-weight: 700;
  color: #fff;
}

.gp-bh-day-badge--weekday {
  background: #22a06b;
}

.gp-bh-day-badge--saturday {
  background: #3b82f6;
}

.gp-bh-day-badge--sunday {
  background: #ef4444;
}

.gp-bh-switch {
  position: relative;
  flex-shrink: 0;
  width: 3.25rem;
  height: 1.75rem;
  cursor: pointer;
}

.gp-bh-switch__input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.gp-bh-switch__track {
  position: absolute;
  inset: 0;
  background: #cbd5e1;
  border-radius: 999px;
  transition: background 0.2s;
}

.gp-bh-switch__track::after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 1.5rem;
  height: 1.5rem;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.15);
  transition: transform 0.2s;
}

.gp-bh-switch__input:checked + .gp-bh-switch__track {
  background: var(--gp-primary);
}

.gp-bh-switch__input:checked + .gp-bh-switch__track::after {
  transform: translateX(1.5rem);
}

.gp-bh-day-card__content {
  flex: 1;
  min-width: 0;
}

.gp-bh-day-card__closed {
  margin: 0.5rem 0 0;
  font-size: 0.9375rem;
  font-weight: 600;
  color: #94a3b8;
}

.gp-bh-bulk-days {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.gp-bh-bulk-day {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  margin: 0;
  padding: 0.5rem 0.75rem;
  border: 1px solid #dbeafe;
  border-radius: 999px;
  background: #f8fbff;
  color: #1e3a8a;
  font-size: 0.875rem;
  font-weight: 600;
  cursor: pointer;
}

.gp-bh-bulk-day:has(input:checked) {
  border-color: #93c5fd;
  background: #eef5ff;
  color: #1d4ed8;
}

.gp-bh-chips {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.gp-bh-chip {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.375rem 0.375rem 0.375rem 0.625rem;
  background: #eef5ff;
  border: 1px solid #d6e6ff;
  border-radius: 999px;
  color: #1d4ed8;
  font-size: 0.875rem;
  font-weight: 600;
}

.gp-bh-chip__label {
  border: none;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 600;
  padding: 0;
  cursor: pointer;
}

.gp-bh-chip__label:hover {
  text-decoration: underline;
}

.gp-bh-chip__time {
  border: none;
  background: transparent;
  color: inherit;
  font: inherit;
  font-weight: 600;
  padding: 0;
  width: 4.5rem;
  cursor: pointer;
}

.gp-bh-chip__time:focus {
  outline: none;
}

.gp-bh-chip__time::-webkit-calendar-picker-indicator {
  display: none;
}

.gp-bh-chip__sep {
  color: #64748b;
  font-weight: 500;
}

.gp-bh-chip__remove {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.375rem;
  height: 1.375rem;
  margin-left: 0.125rem;
  padding: 0;
  border: none;
  border-radius: 50%;
  background: transparent;
  color: #64748b;
  font-size: 0.6875rem;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}

.gp-bh-chip__remove:hover {
  background: rgba(29, 78, 216, 0.1);
  color: #1d4ed8;
}

.gp-bh-add-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.375rem 0.75rem;
  border: 1px dashed #93c5fd;
  border-radius: 999px;
  background: #f8fbff;
  color: var(--gp-primary);
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}

.gp-bh-add-btn:hover {
  background: #eef5ff;
  border-color: var(--gp-primary);
}

.gp-bh-actions {
  margin-top: 0;
}

/* ── AI instruction (FAQ-style) ── */

.gp-ai-instruction-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin: 1.25rem 0 1rem;
}

.gp-ai-instruction-toolbar__count {
  font-size: 0.9375rem;
  color: var(--gp-text-muted);
}

.gp-ai-instruction-toolbar__count strong {
  color: var(--gp-navy);
}

.gp-ai-instruction-toolbar__actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

.gp-ai-instruction-sample-intro {
  margin-bottom: 1rem;
  color: var(--gp-text-muted);
  font-size: 0.9375rem;
  line-height: 1.6;
}

.gp-ai-instruction-sample-list {
  margin-top: 0;
}

.gp-ai-instruction-item--sample .accordion-body {
  padding-bottom: 1rem;
}

.gp-console-form-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
  padding-top: 0.25rem;
}

.gp-ai-profile-section-desc {
  margin: -0.25rem 0 1.25rem;
  color: var(--gp-text-muted);
  font-size: 0.875rem;
  line-height: 1.6;
}

.gp-ai-profile-section-desc a {
  color: var(--gp-primary);
  text-decoration: none;
  font-weight: 600;
}

.gp-ai-profile-section-desc a:hover {
  text-decoration: underline;
}

.gp-form-optional {
  font-size: 0.75rem;
  font-weight: 600;
  color: #94a3b8;
  margin-left: 0.25rem;
}

.gp-console-popup-body {
  background: #f1f5f9;
  min-height: 100vh;
}

.gp-console-popup-header {
  position: sticky;
  top: 0;
  z-index: 20;
  background: #fff;
  border-bottom: 1px solid var(--gp-border);
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
}

.gp-console-popup-header__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0.875rem 1.25rem;
}

.gp-console-popup-header__title {
  margin: 0;
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--gp-navy);
}

.gp-console-popup-header__close .bi {
  margin-right: 0.25rem;
}

.gp-console-popup-content {
  max-width: 1200px;
  margin: 0 auto;
  padding: 1.25rem;
}

.gp-ai-profile-example-page .gp-console-notice {
  margin-bottom: 1rem;
}

.gp-ai-profile-example-notice {
  background: #eff6ff;
  border-color: #bfdbfe;
}

.gp-ai-profile-example-notice .gp-console-intro {
  color: #1e40af;
}

.gp-ai-profile-example-notice .bi {
  margin-right: 0.35rem;
}

.gp-ai-profile-form--example .gp-inquiry-form__input[readonly],
.gp-ai-profile-form--example textarea[readonly] {
  background-color: #fff;
  color: var(--gp-text);
  cursor: default;
}

.gp-ai-profile-counted-field {
  display: flex;
  flex-direction: column;
}

.gp-ai-profile-char-count {
  margin-top: 0.35rem;
  text-align: right;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #94a3b8;
}

.gp-ai-profile-guide {
  height: 9.6rem;
  min-height: 9.6rem;
  max-height: 9.6rem;
  line-height: 1.65;
  resize: none;
  overflow-y: auto;
}

.gp-ai-profile-ops-field {
  height: 8rem;
  min-height: 8rem;
  max-height: 8rem;
  line-height: 1.6;
  resize: none;
  overflow: hidden;
}


/* ── Call forwarding settings ── */

.gp-forwarding-toolbar {
  max-width: 760px;
}

.gp-forwarding-list {
  display: flex;
  flex-direction: column;
  max-width: 760px;
}

.gp-forwarding-segment {
  display: flex;
  flex-direction: column;
}

.gp-forwarding-card {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  padding: 1rem 1rem 0.875rem;
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.05);
}

.gp-forwarding-card__row {
  display: flex;
  align-items: center;
  gap: 0.875rem;
}

.gp-forwarding-card__order {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background: #2563eb;
  color: #fff;
  font-size: 0.9375rem;
  font-weight: 700;
}

.gp-forwarding-card__info {
  flex: 1;
  min-width: 0;
}

.gp-forwarding-card__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.375rem;
  margin-bottom: 0.25rem;
}

.gp-forwarding-card__type {
  display: inline-flex;
  align-items: center;
  padding: 0.125rem 0.5rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1.4;
}

.gp-forwarding-card__type--external {
  background: #fee2e2;
  color: #b91c1c;
}

.gp-forwarding-card__type--internal {
  background: #dcfce7;
  color: #15803d;
}

.gp-forwarding-card__name {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #0f172a;
}

.gp-forwarding-card__number {
  margin: 0;
  font-size: 1.375rem;
  font-weight: 700;
  color: #0f172a;
  letter-spacing: -0.01em;
  line-height: 1.3;
}

.gp-forwarding-card__timeout {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  padding: 0.625rem 1.125rem;
  border-radius: 999px;
  background: #eff4ff;
  color: #2563eb;
  font-size: 1.0625rem;
  font-weight: 700;
  white-space: nowrap;
}

.gp-forwarding-card__reorder {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

.gp-forwarding-card__move {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.125rem;
  height: 2.125rem;
  padding: 0;
  border: 1px solid #bfdbfe;
  border-radius: 10px;
  background: #fff;
  color: #2563eb;
  font-size: 1rem;
  line-height: 1;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s;
}

.gp-forwarding-card__move:hover:not(:disabled) {
  background: #eff6ff;
  border-color: #2563eb;
}

.gp-forwarding-card__move:disabled {
  opacity: 0.35;
  cursor: not-allowed;
}

.gp-forwarding-card__actions {
  flex-shrink: 0;
  display: flex;
  gap: 0.5rem;
}

.gp-forwarding-card__action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 4.5rem;
  padding: 0.375rem 0.875rem;
  border-radius: 8px;
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.4;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}

.gp-forwarding-card__action--edit {
  border: 1px solid #2563eb;
  background: #fff;
  color: #2563eb;
}

.gp-forwarding-card__action--edit:hover {
  background: #eff6ff;
}

.gp-forwarding-card__action--delete {
  border: 1px solid #ef4444;
  background: #fff;
  color: #ef4444;
}

.gp-forwarding-card__action--delete:hover {
  background: #fef2f2;
}

.gp-forwarding-flow {
  display: flex;
  justify-content: center;
  padding: 0.5rem 0;
  color: #2563eb;
  font-size: 1.25rem;
  line-height: 1;
}

.gp-forwarding-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  max-width: 760px;
  padding: 3rem 1.5rem;
  border: 1px dashed #cbd5e1;
  border-radius: 14px;
  background: #f8fafc;
}

.gp-forwarding-empty__icon {
  font-size: 2rem;
  color: #94a3b8;
  margin-bottom: 0.75rem;
}

.gp-forwarding-empty__title {
  margin: 0 0 0.375rem;
  font-size: 1rem;
  font-weight: 700;
  color: #0f172a;
}

.gp-forwarding-empty__desc {
  margin: 0 0 1rem;
  font-size: 0.9375rem;
  color: #64748b;
}

@media (max-width: 575.98px) {
  .gp-forwarding-card__row {
    flex-wrap: wrap;
  }

  .gp-forwarding-card__order {
    order: 0;
  }

  .gp-forwarding-card__info {
    flex: 1 1 calc(100% - 4rem);
    order: 1;
  }

  .gp-forwarding-card__timeout {
    order: 2;
    margin-left: 3.875rem;
  }

  .gp-forwarding-card__actions {
    order: 3;
  }

  .gp-forwarding-card__reorder {
    flex-direction: row;
    order: 4;
    margin-left: auto;
  }
}

/* ── 직통전화 설정 ── */

/* ── 목록 검색창 (직통전화·수신차단 공용) ── */

.gp-list-search {
  position: relative;
  flex: 1 1 320px;
  min-width: 220px;
  max-width: 480px;
}

/* 알림정보 — 공용 검색창 스타일보다 뒤에 두어 폭 오버라이드 */
.gp-notify-toolbar .gp-list-search.gp-notify-search {
  flex: 0 0 308px;
  width: 308px;
  min-width: 210px;
  max-width: 308px;
}

/* 티켓관리 — 검색창 폭 */
.gp-ticket-toolbar .gp-list-search.gp-ticket-search {
  flex: 0 0 308px;
  width: 308px;
  min-width: 210px;
  max-width: 308px;
}

.gp-list-search__icon {
  position: absolute;
  left: 0.875rem;
  top: 50%;
  transform: translateY(-50%);
  color: #94a3b8;
  font-size: 0.95rem;
  pointer-events: none;
}

.gp-list-search__input {
  width: 100%;
  padding: 0.5rem 0.875rem 0.5rem 2.4rem;
  border: 1px solid #cbd5e1;
  border-radius: 10px;
  font-size: 0.9375rem;
  color: #0f172a;
  background: #fff;
}

.gp-list-search__input:focus {
  outline: none;
  border-color: var(--gp-primary);
  box-shadow: 0 0 0 3px var(--gp-primary-light);
}

.gp-directcall-toolbar {
  width: 100%;
}

.gp-directcall-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  width: 100%;
}

.gp-directcall-card {
  display: grid;
  grid-template-columns: 2.5rem minmax(0, 1.1fr) minmax(0, 1.7fr) minmax(0, 1.1fr) 6rem 5rem auto;
  align-items: center;
  column-gap: 1.25rem;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 0.625rem 1.25rem;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
  transition: background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.gp-directcall-card--highlight {
  border-color: #3b82f6;
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.18);
  animation: gp-directcall-highlight 2.4s ease-out;
}

@keyframes gp-directcall-highlight {
  0% {
    background-color: #eff6ff;
  }
  100% {
    background-color: #fff;
  }
}

.gp-directcall-card__avatar {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background: var(--gp-primary-light);
  color: var(--gp-primary);
  font-size: 1.125rem;
}

.gp-directcall-card__name {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.gp-directcall-card__memo {
  margin: 0;
  font-size: 0.875rem;
  font-weight: 500;
  color: #64748b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.gp-directcall-card__number {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 500;
  color: #475569;
  letter-spacing: -0.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.gp-directcall-card__holiday,
.gp-directcall-card__scope {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 0.375rem;
}

.gp-directcall-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.625rem;
  border-radius: 999px;
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
}

.gp-directcall-badge--holiday {
  background: #ffe4e6;
  color: #be123c;
}

.gp-directcall-badge--holiday-off {
  background: #f1f5f9;
  color: #94a3b8;
}

.gp-directcall-badge--always {
  background: #eff6ff;
  color: #1d4ed8;
}

.gp-directcall-badge--business {
  background: #dcfce7;
  color: #15803d;
}

.gp-directcall-card__actions {
  flex-shrink: 0;
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
}

.gp-directcall-card__action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 4rem;
  padding: 0.375rem 0.875rem;
  border-radius: 8px;
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.4;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}

.gp-directcall-card__action--edit {
  border: 1px solid #2563eb;
  background: #fff;
  color: #2563eb;
}

.gp-directcall-card__action--edit:hover {
  background: #eff6ff;
}

.gp-directcall-card__action--delete {
  border: 1px solid #ef4444;
  background: #fff;
  color: #ef4444;
}

.gp-directcall-card__action--delete:hover {
  background: #fef2f2;
}

.gp-directcall-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  width: 100%;
  padding: 3rem 1.5rem;
  border: 1px dashed #cbd5e1;
  border-radius: 14px;
  background: #f8fafc;
}

.gp-directcall-empty__icon {
  font-size: 2rem;
  color: #94a3b8;
  margin-bottom: 0.75rem;
}

.gp-directcall-empty__title {
  margin: 0 0 0.375rem;
  font-size: 1rem;
  font-weight: 700;
  color: #0f172a;
}

.gp-directcall-empty__desc {
  margin: 0 0 1rem;
  font-size: 0.9375rem;
  color: #64748b;
}

@media (max-width: 767.98px) {
  .gp-directcall-card {
    grid-template-columns: 2.5rem minmax(0, 1fr) auto;
    grid-template-areas:
      "avatar name actions"
      "avatar memo memo"
      "avatar number scope"
      "avatar holiday holiday";
    column-gap: 0.875rem;
    row-gap: 0.25rem;
  }

  .gp-directcall-card__avatar {
    grid-area: avatar;
  }

  .gp-directcall-card__name {
    grid-area: name;
  }

  .gp-directcall-card__memo {
    grid-area: memo;
  }

  .gp-directcall-card__number {
    grid-area: number;
  }

  .gp-directcall-card__holiday {
    grid-area: holiday;
  }

  .gp-directcall-card__scope {
    grid-area: scope;
    justify-content: flex-end;
  }

  .gp-directcall-card__actions {
    grid-area: actions;
  }
}

/* ── 수신차단 설정 ── */

.gp-callblock-toolbar {
  width: 100%;
}

.gp-callblock-list {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  width: 100%;
}

.gp-callblock-card {
  display: grid;
  grid-template-columns: 2.5rem minmax(0, 1.3fr) minmax(0, 1.2fr) minmax(0, 1.2fr) 6.5rem auto;
  align-items: center;
  column-gap: 1.25rem;
  background: #fff;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  padding: 0.625rem 1.25rem;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
  transition: background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease;
}

.gp-callblock-card--highlight {
  border-color: #f43f5e;
  box-shadow: 0 0 0 3px rgba(244, 63, 94, 0.18);
  animation: gp-callblock-highlight 2.4s ease-out;
}

@keyframes gp-callblock-highlight {
  0% {
    background-color: #fff1f2;
  }
  100% {
    background-color: #fff;
  }
}

.gp-callblock-card__avatar {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  background: #ffe4e6;
  color: #be123c;
  font-size: 1.125rem;
}

.gp-callblock-card__name {
  margin: 0;
  font-size: 0.95rem;
  font-weight: 700;
  color: #0f172a;
  line-height: 1.3;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.gp-callblock-card__number {
  margin: 0;
  font-size: 0.9375rem;
  font-weight: 500;
  color: #475569;
  letter-spacing: -0.01em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.gp-callblock-card__reason {
  display: flex;
  align-items: center;
  gap: 0.25rem;
  margin: 0;
  font-size: 0.875rem;
  font-weight: 500;
  color: #64748b;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.gp-callblock-card__badges {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 0.375rem;
}

.gp-callblock-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.625rem;
  border-radius: 999px;
  font-size: 0.8125rem;
  font-weight: 700;
  line-height: 1.4;
  white-space: nowrap;
}

.gp-callblock-badge--count {
  background: #fef2f2;
  color: #dc2626;
}

.gp-callblock-card__actions {
  flex-shrink: 0;
  display: flex;
  justify-content: flex-end;
  gap: 0.5rem;
}

.gp-callblock-card__action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 4rem;
  padding: 0.375rem 0.875rem;
  border-radius: 8px;
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.4;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}

.gp-callblock-card__action--edit {
  border: 1px solid #2563eb;
  background: #fff;
  color: #2563eb;
}

.gp-callblock-card__action--edit:hover {
  background: #eff6ff;
}

.gp-callblock-card__action--delete {
  border: 1px solid #ef4444;
  background: #fff;
  color: #ef4444;
}

.gp-callblock-card__action--delete:hover {
  background: #fef2f2;
}

.gp-callblock-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  width: 100%;
  padding: 3rem 1.5rem;
  border: 1px dashed #cbd5e1;
  border-radius: 14px;
  background: #f8fafc;
}

.gp-callblock-empty__icon {
  font-size: 2rem;
  color: #94a3b8;
  margin-bottom: 0.75rem;
}

.gp-callblock-empty__title {
  margin: 0 0 0.375rem;
  font-size: 1rem;
  font-weight: 700;
  color: #0f172a;
}

.gp-callblock-empty__desc {
  margin: 0 0 1rem;
  font-size: 0.9375rem;
  color: #64748b;
}

@media (max-width: 767.98px) {
  .gp-callblock-card {
    grid-template-columns: 2.5rem minmax(0, 1fr) auto;
    grid-template-areas:
      "avatar name actions"
      "avatar number badges"
      "avatar reason reason";
    column-gap: 0.875rem;
    row-gap: 0.25rem;
  }

  .gp-callblock-card__avatar {
    grid-area: avatar;
  }

  .gp-callblock-card__name {
    grid-area: name;
  }

  .gp-callblock-card__number {
    grid-area: number;
  }

  .gp-callblock-card__reason {
    grid-area: reason;
  }

  .gp-callblock-card__badges {
    grid-area: badges;
    justify-content: flex-end;
  }

  .gp-callblock-card__actions {
    grid-area: actions;
  }
}

/* ── 콜백 접수내역 ── */

.gp-callback-meta {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 0.875rem 1rem;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #f8fafc;
}

.gp-callback-meta__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.gp-callback-meta__label {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #64748b;
}

.gp-callback-meta__value {
  font-size: 0.9375rem;
  color: #0f172a;
}

.gp-callback-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 3rem 1.5rem;
  border: 1px dashed #cbd5e1;
  border-radius: 14px;
  background: #f8fafc;
}

.gp-callback-empty__icon {
  font-size: 2rem;
  color: #94a3b8;
  margin-bottom: 0.75rem;
}

.gp-callback-empty__title {
  margin: 0 0 0.375rem;
  font-size: 1rem;
  font-weight: 700;
  color: #0f172a;
}

.gp-callback-empty__desc {
  margin: 0;
  font-size: 0.9375rem;
  color: #64748b;
}

/* ── 결제관리 ── */

.gp-billing-summary {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr);
  gap: 1rem;
}

.gp-billing-card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--gp-border);
  border-radius: var(--gp-radius-lg);
  padding: 1.125rem 1.5rem;
  box-shadow: var(--gp-shadow);
}

.gp-billing-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 0.75rem;
}

.gp-billing-card__eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 1rem;
  font-weight: 700;
  color: #64748b;
}

.gp-billing-card__eyebrow i {
  font-size: 1.375rem;
}

/* 상단 카드 상태 배지 한 단계 크게 */
.gp-billing-card__head .gp-console-badge {
  font-size: 0.875rem;
  padding: 0.25rem 0.625rem;
}

.gp-billing-plan__body {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr);
  gap: 1rem 1.5rem;
  align-items: center;
  margin-bottom: 1rem;
}

.gp-billing-plan__headline {
  padding-right: 1.5rem;
  border-right: 1px solid var(--gp-border);
}

.gp-billing-plan__name {
  margin: 0 0 0.25rem;
  font-size: 1.375rem;
  font-weight: 700;
  color: var(--gp-navy);
}

.gp-billing-plan__price {
  margin: 0;
  font-size: 1.75rem;
  font-weight: 800;
  color: var(--gp-primary);
  letter-spacing: -0.02em;
}

.gp-billing-plan__meta {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
}

.gp-billing-plan__meta li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 1rem;
  color: #475569;
}

.gp-billing-plan__meta i {
  color: #94a3b8;
}

.gp-billing-card__actions {
  margin-top: auto;
  display: flex;
  gap: 0.5rem;
}

.gp-billing-creditcard {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 0.875rem 1.125rem;
  margin-bottom: 1rem;
  border-radius: 14px;
  background: linear-gradient(135deg, #1e293b 0%, #334155 55%, #475569 100%);
  color: #fff;
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.18);
}

.gp-billing-creditcard__top {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 0.25rem 0.75rem;
}

.gp-billing-creditcard__brand {
  font-size: 0.875rem;
  font-weight: 700;
  letter-spacing: 0.02em;
  opacity: 0.92;
}

.gp-billing-creditcard__number {
  font-size: 1.0625rem;
  font-weight: 600;
  letter-spacing: 0.1em;
}

.gp-billing-creditcard__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 0.8125rem;
  opacity: 0.85;
}

.gp-billing-detail__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.gp-billing-detail__invoice-no {
  font-size: 0.8125rem;
  font-weight: 600;
  color: #64748b;
}

.gp-billing-detail__meta {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
  padding: 0.875rem 1rem;
  margin-bottom: 1rem;
  border: 1px solid var(--gp-border);
  border-radius: 12px;
  background: #f8fafc;
}

.gp-billing-detail__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  font-size: 0.9rem;
}

.gp-billing-detail__row span:first-child {
  color: #64748b;
}

.gp-billing-detail__row span:last-child {
  font-weight: 600;
  color: #0f172a;
  text-align: right;
}

.gp-billing-detail__items {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}

.gp-billing-detail__items th,
.gp-billing-detail__items td {
  padding: 0.5rem 0.25rem;
  border-bottom: 1px solid var(--gp-border);
  text-align: left;
}

.gp-billing-detail__items td:last-child,
.gp-billing-detail__items th:last-child {
  text-align: right;
  white-space: nowrap;
}

.gp-billing-detail__items tfoot td {
  border-bottom: none;
  padding-top: 0.75rem;
  font-size: 1.0625rem;
  font-weight: 800;
  color: var(--gp-navy);
}

@media (max-width: 767.98px) {
  .gp-billing-summary {
    grid-template-columns: 1fr;
  }

  .gp-billing-plan__body {
    grid-template-columns: 1fr;
    gap: 0.875rem;
  }

  .gp-billing-plan__headline {
    padding-right: 0;
    padding-bottom: 0.875rem;
    border-right: none;
    border-bottom: 1px solid var(--gp-border);
  }
}

/* ── 목록 페이지네이션 (공용) ── */

.gp-pager {
  max-width: 760px;
  margin-top: 1rem;
}

/* 테이블 등 전체 폭 목록에서는 페이지 버튼을 우측 끝으로 정렬 */
.gp-pager--wide {
  max-width: none;
}

.gp-pager__bar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}

.gp-pager__left {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  flex-wrap: wrap;
}

.gp-pager__size {
  display: flex;
  align-items: center;
  gap: 0.375rem;
  font-size: 0.8125rem;
  color: #64748b;
}

.gp-pager__size select {
  width: auto;
  min-width: 4.5rem;
  padding: 0.25rem 1.75rem 0.25rem 0.625rem;
  font-size: 0.8125rem;
  border-radius: 8px;
  border: 1px solid #e2e8f0;
  color: #0f172a;
  background-color: #fff;
}

.gp-pager__summary {
  font-size: 0.8125rem;
  font-weight: 500;
  color: #94a3b8;
  white-space: nowrap;
}

.gp-pager__nav {
  display: flex;
  align-items: center;
  gap: 0.25rem;
}

.gp-pager__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 2.25rem;
  height: 2.25rem;
  padding: 0 0.5rem;
  border: 1px solid #e2e8f0;
  border-radius: 8px;
  background: #fff;
  color: #475569;
  font-size: 0.875rem;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  transition: background 0.15s, color 0.15s, border-color 0.15s;
}

.gp-pager__btn:hover:not(.gp-pager__btn--active):not(.gp-pager__btn--disabled) {
  background: #f1f5f9;
  border-color: #cbd5e1;
}

.gp-pager__btn--active {
  background: var(--gp-primary);
  border-color: var(--gp-primary);
  color: #fff;
  cursor: default;
}

.gp-pager__btn--disabled {
  color: #cbd5e1;
  cursor: not-allowed;
}

.gp-pager__ellipsis {
  display: inline-flex;
  align-items: flex-end;
  justify-content: center;
  min-width: 1.75rem;
  height: 2.25rem;
  padding-bottom: 0.375rem;
  color: #94a3b8;
  font-size: 0.875rem;
}

@media (max-width: 575.98px) {
  .gp-pager__bar {
    flex-direction: column;
    align-items: stretch;
  }

  .gp-pager__left {
    justify-content: space-between;
  }

  .gp-pager__nav {
    justify-content: center;
  }
}

/* ── 녹음 설정 ── */

.gp-recording-form {
  display: flex;
  flex-direction: column;
  gap: 1.75rem;
}

.gp-recording-section {
  display: flex;
  flex-direction: column;
}

.gp-recording-section__title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0 0 0.875rem;
  font-size: 1.0625rem;
  font-weight: 700;
  color: #1e293b;
  line-height: 1.3;
}

.gp-recording-section__title::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 1.125rem;
  border-radius: 2px;
  background: var(--gp-primary);
}

.gp-recording-options {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  max-width: 32rem;
}

.gp-recording-option {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin: 0;
  padding: 0.875rem 1rem;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
  transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
}

.gp-recording-option:hover {
  border-color: #c7d2fe;
}

.gp-recording-option input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.gp-recording-option__radio {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.375rem;
  height: 1.375rem;
  border-radius: 50%;
  border: 2px solid #cbd5e1;
  background: #fff;
  transition: border-color 0.15s;
}

.gp-recording-option__radio::after {
  content: "";
  width: 0.6875rem;
  height: 0.6875rem;
  border-radius: 50%;
  background: var(--gp-primary);
  transform: scale(0);
  transition: transform 0.15s;
}

.gp-recording-option__label {
  font-size: 0.9875rem;
  font-weight: 600;
  color: #334155;
}

.gp-recording-option:has(input:checked) {
  border-color: var(--gp-primary);
  background: #f5f8ff;
  box-shadow: 0 0 0 1px var(--gp-primary) inset;
}

.gp-recording-option:has(input:checked) .gp-recording-option__radio {
  border-color: var(--gp-primary);
}

.gp-recording-option:has(input:checked) .gp-recording-option__radio::after {
  transform: scale(1);
}

.gp-recording-option:has(input:focus-visible) {
  outline: 2px solid var(--gp-primary);
  outline-offset: 2px;
}

.gp-recording-select {
  max-width: 22rem;
  padding: 0.75rem 1rem;
  border: 1px solid var(--gp-primary);
  border-radius: 12px;
  font-size: 0.9375rem;
  font-weight: 600;
  color: #1e293b;
}

.gp-recording-notice-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  max-width: 34rem;
}

.gp-recording-notice-row__label {
  font-size: 1rem;
  font-weight: 700;
  color: #1e293b;
}

.gp-recording-notice-row__desc {
  max-width: 34rem;
  margin: 0.5rem 0 0;
  font-size: 0.875rem;
  color: #94a3b8;
  line-height: 1.5;
}

.gp-recording-switch {
  margin: 0;
  padding: 0;
  min-height: auto;
}

.gp-recording-switch .form-check-input {
  width: 3rem;
  height: 1.625rem;
  margin: 0;
  cursor: pointer;
  background-color: #cbd5e1;
  border-color: #cbd5e1;
}

.gp-recording-switch .form-check-input:checked {
  background-color: var(--gp-primary);
  border-color: var(--gp-primary);
}

.gp-recording-switch .form-check-input:focus {
  box-shadow: 0 0 0 0.2rem rgba(0, 102, 255, 0.2);
}

.gp-holiday-switch {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin: 0;
  padding: 0;
  min-height: auto;
}

.gp-holiday-switch .form-check-input {
  width: 3rem;
  height: 1.625rem;
  margin: 0;
  cursor: pointer;
  background-color: #cbd5e1;
  border-color: #cbd5e1;
}

.gp-holiday-switch .form-check-input:checked {
  background-color: var(--gp-primary);
  border-color: var(--gp-primary);
}

.gp-holiday-switch .form-check-input:focus {
  box-shadow: 0 0 0 0.2rem rgba(0, 102, 255, 0.2);
}

.gp-holiday-switch .form-check-label {
  font-size: 1rem;
  font-weight: 500;
  padding-top: 0.125rem;
  cursor: pointer;
}

.gp-holiday-table {
  table-layout: fixed;
  width: 100%;
}

.gp-holiday-table th,
.gp-holiday-table td {
  width: 20%;
  word-wrap: break-word;
  overflow-wrap: break-word;
  vertical-align: middle;
}

.gp-holiday-table--temporary th,
.gp-holiday-table--temporary td {
  width: 16.6667%;
}

.gp-recording-audio {
  max-width: 34rem;
  margin-top: 1rem;
  padding: 1.25rem;
  border: 1px solid #e2e8f0;
  border-radius: 16px;
  background: #f8fafc;
}

.gp-recording-audio__script {
  margin: 0 0 1rem;
  text-align: center;
  font-size: 0.9375rem;
  font-weight: 600;
  color: #334155;
  line-height: 1.6;
}

.gp-recording-audio__player {
  display: flex;
  align-items: center;
  gap: 0.875rem;
}

.gp-recording-audio__play {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  border: none;
  border-radius: 50%;
  background: var(--gp-primary);
  color: #fff;
  font-size: 1.5rem;
  line-height: 1;
  cursor: pointer;
  transition: background 0.15s;
}

.gp-recording-audio__play:hover {
  background: var(--gp-primary-dark);
}

.gp-recording-audio__track {
  position: relative;
  flex: 1;
  height: 4px;
  border-radius: 999px;
  background: #d8dee9;
  cursor: pointer;
}

.gp-recording-audio__progress {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: var(--gp-primary);
}

.gp-recording-audio__thumb {
  position: absolute;
  top: 50%;
  left: 0;
  width: 0.875rem;
  height: 0.875rem;
  border-radius: 50%;
  background: var(--gp-primary);
  transform: translate(-50%, -50%);
  box-shadow: 0 1px 4px rgba(15, 23, 42, 0.25);
}

.gp-recording-audio__times {
  display: flex;
  justify-content: space-between;
  margin-top: 0.625rem;
  padding-left: 3.875rem;
  font-size: 0.8125rem;
  color: #94a3b8;
}

.gp-recording-save {
  align-self: flex-start;
  margin-top: 0.5rem;
  min-width: 9rem;
  padding: 0.75rem 1.75rem;
  border: none;
  border-radius: 10px;
  background: var(--gp-primary);
  color: #fff;
  font-size: 0.9375rem;
  font-weight: 700;
  cursor: pointer;
  transition: background 0.15s;
}

.gp-recording-save:hover {
  background: var(--gp-primary-dark);
}

.gp-ai-instruction-list {
  margin-top: 0;
}

.gp-ai-instruction-item .accordion-button {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding: 1rem 1.25rem;
}

.gp-ai-instruction-item .accordion-button::after {
  margin-top: 0.375rem;
}

.gp-ai-instruction-item__badge {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.625rem;
  height: 1.625rem;
  border-radius: 50%;
  background: var(--gp-primary);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 700;
  line-height: 1;
}

.gp-ai-instruction-item__badge--answer {
  background: #64748b;
  margin-top: 0.125rem;
}

.gp-ai-instruction-item__question {
  flex: 1;
  min-width: 0;
  text-align: left;
  line-height: 1.5;
  word-break: keep-all;
  overflow-wrap: anywhere;
}

.gp-ai-instruction-item__answer-wrap {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.gp-ai-instruction-item__answer {
  flex: 1;
  min-width: 0;
  color: var(--gp-text-muted);
  font-size: var(--gp-type-body-size);
  line-height: var(--gp-type-body-lh);
  white-space: pre-wrap;
  word-break: keep-all;
  overflow-wrap: anywhere;
}

.gp-ai-instruction-item__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  padding-top: 0.875rem;
  border-top: 1px solid var(--gp-border);
}

.gp-ai-instruction-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 3rem 1.5rem;
  border: 1px dashed #cbd5e1;
  border-radius: 14px;
  background: #f8fafc;
}

.gp-ai-instruction-empty__icon {
  font-size: 2rem;
  color: #94a3b8;
  margin-bottom: 0.75rem;
}

.gp-ai-instruction-empty__title {
  margin: 0 0 0.375rem;
  font-size: 1rem;
  font-weight: 700;
  color: var(--gp-navy);
}

.gp-ai-instruction-empty__desc {
  margin: 0 0 1rem;
  font-size: 0.9375rem;
  color: var(--gp-text-muted);
}

@media (max-width: 575.98px) {
  .gp-bh-day-card__main {
    flex-wrap: wrap;
  }

  .gp-bh-day-card__content {
    width: 100%;
    padding-left: 3.625rem;
  }
}

@media (max-width: 991.98px) {
  .gp-console-sidebar {
    position: fixed;
    left: 0;
    top: 0;
    transform: translateX(-100%);
    transition: transform 0.25s ease;
    box-shadow: 0 8px 32px rgba(15, 23, 42, 0.12);
  }

  .gp-console-sidebar--open {
    transform: translateX(0);
  }

  .gp-console-topbar__user {
    display: none;
  }

  .gp-console-topbar__did {
    padding: 0.4rem 0.7rem;
    gap: 0.25rem;
  }

  .gp-console-topbar__did-icon {
    font-size: 1.125rem;
  }

  .gp-console-topbar__did-sep {
    font-size: 1rem;
  }

  .gp-console-topbar__did-label {
    display: none;
  }

  .gp-console-topbar__did-number {
    font-size: 0.9375rem;
  }

  .gp-dashboard-head .gp-console-topbar__did {
    margin-left: 0;
    align-self: flex-end;
    padding: 0.6rem 1rem;
  }

  .gp-dashboard-head .gp-console-topbar__did-icon {
    font-size: 1.5rem;
  }

  .gp-dashboard-head .gp-console-topbar__did-label {
    display: inline;
    font-size: 0.9375rem;
  }

  .gp-dashboard-head .gp-console-topbar__did-sep {
    font-size: 1.125rem;
  }

  .gp-dashboard-head .gp-console-topbar__did-number {
    font-size: 1.25rem;
  }

  .gp-dashboard-head .gp-console-topbar__did--unassigned .gp-console-topbar__did-number {
    font-size: 1rem;
  }

  .gp-console-content {
    padding: 1rem;
  }
}

.gp-signup-success__icon {
  font-size: 3rem;
  color: #059669;
  margin-bottom: 1rem;
}

.gp-signup-success__title {
  font-size: 1.375rem;
  font-weight: 700;
  color: var(--gp-navy);
  margin-bottom: 1rem;
}

.gp-signup-success__desc {
  color: var(--gp-text-muted);
  line-height: 1.7;
  margin-bottom: 1.75rem;
}

@media (max-width: 767.98px) {
  .gp-signup-form {
    padding: 1.5rem 1.25rem 1.75rem;
  }

  .gp-signup-section {
    margin-bottom: 1.75rem;
    padding-bottom: 1.75rem;
  }

  .gp-signup-phone-verify,
  .gp-signup-id-check,
  .gp-signup-address {
    flex-direction: column;
  }

  .gp-signup-phone-verify__btn,
  .gp-signup-id-check__btn,
  .gp-signup-address__btn {
    width: 100%;
  }
}

.gp-notice {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  padding: 1.5rem 2rem;
  background: var(--gp-primary-light);
  border-radius: var(--gp-radius);
  color: var(--gp-primary-dark);
  font-size: var(--gp-type-body-size);
  line-height: var(--gp-type-body-lh);
  font-weight: 500;
}

.gp-faq {
  padding: 4.5rem 0 5rem;
  background: var(--gp-surface);
}

.gp-faq-page {
  background: #fff;
}

.gp-faq-category__title {
  font-size: var(--gp-type-card-title-size);
  font-weight: var(--gp-type-card-title-weight);
  line-height: var(--gp-type-card-title-lh);
  color: var(--gp-navy);
  margin-bottom: 1.25rem;
  padding-bottom: 0.75rem;
  border-bottom: 2px solid var(--gp-primary-light);
}

.gp-accordion .accordion-item {
  border: 1px solid var(--gp-border);
  border-radius: var(--gp-radius) !important;
  margin-bottom: 0.75rem;
  overflow: hidden;
  background: #fff;
}

.gp-accordion .accordion-item:last-child {
  margin-bottom: 0;
}

.gp-accordion .accordion-button {
  font-weight: var(--gp-type-card-title-weight);
  font-size: var(--gp-type-body-size);
  padding: 1.25rem 1.5rem;
  background: #fff;
}

.gp-accordion .accordion-button:not(.collapsed) {
  background: var(--gp-primary-light);
  color: var(--gp-primary);
  box-shadow: none;
}

.gp-accordion .accordion-body {
  padding: 1rem 1.5rem 1.25rem;
  font-size: var(--gp-type-body-size);
  line-height: var(--gp-type-body-lh);
  color: var(--gp-text-muted);
}

/* ── Subpages (features, faq, etc.) ── */

.page-header {
  background: var(--gp-surface);
}

.page-header h1 {
  font-size: var(--gp-type-title-size);
  font-weight: var(--gp-type-title-weight);
  letter-spacing: var(--gp-type-title-tracking);
  color: var(--gp-navy);
  margin-bottom: 0.625rem;
}

.page-header p {
  font-size: var(--gp-type-lead-size);
  line-height: var(--gp-type-lead-lh);
  color: var(--gp-text-muted);
}

.page-header .card h3,
.page-header ~ section .card h3,
.page-header ~ section .card h4 {
  font-size: var(--gp-type-card-title-size);
  font-weight: var(--gp-type-card-title-weight);
  line-height: var(--gp-type-card-title-lh);
  color: var(--gp-navy);
}

.page-header ~ section .text-muted,
.page-header ~ section .card .text-muted {
  font-size: var(--gp-type-body-size);
  line-height: var(--gp-type-body-lh);
  color: var(--gp-text-muted) !important;
}

.page-header ~ section .accordion .accordion-button {
  font-size: var(--gp-type-body-size);
  font-weight: var(--gp-type-card-title-weight);
}

.page-header ~ section .accordion .accordion-body {
  padding: 1rem 1.5rem 1.25rem;
  font-size: var(--gp-type-body-size);
  line-height: var(--gp-type-body-lh);
  color: var(--gp-text-muted);
}

.feature-icon,
.feature-icon-lg {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--gp-primary-light);
  border-radius: 14px;
  color: var(--gp-primary);
}

.feature-icon {
  width: 48px;
  height: 48px;
  font-size: 1.5rem;
}

.feature-icon-lg {
  width: 56px;
  height: 56px;
  font-size: 1.75rem;
}

.feature-card {
  transition: transform 0.2s, box-shadow 0.2s;
}

.feature-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--gp-shadow-lg) !important;
}

/* ── Features detail page ── */

.gp-features-hero {
  padding: 4rem 0 2rem;
  background: linear-gradient(180deg, #e6ebf3 0%, #f5f7fb 100%);
}

.gp-features-page {
  position: relative;
  padding: 2.5rem 0 5rem;
  background: linear-gradient(180deg, #f0f4fc 0%, var(--gp-surface) 40%, #fff 100%);
  overflow: hidden;
}

.gp-features-page__decor {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}

.gp-features-page__orb {
  position: absolute;
  border-radius: 50%;
  filter: blur(80px);
  opacity: 0.5;
}

.gp-features-page__orb--1 {
  width: 420px;
  height: 420px;
  top: -100px;
  right: -120px;
  background: rgba(0, 102, 255, 0.18);
}

.gp-features-page__orb--2 {
  width: 360px;
  height: 360px;
  bottom: 10%;
  left: -100px;
  background: rgba(124, 58, 237, 0.12);
}

.gp-feature-detail-list {
  display: flex;
  flex-direction: column;
  gap: 1.75rem;
}

.gp-feature-detail {
  position: relative;
  background: #fff;
  border: 1px solid var(--gp-border);
  border-radius: var(--gp-radius-lg);
  padding: 2.25rem 2.5rem 2rem;
  box-shadow: var(--gp-shadow);
  overflow: hidden;
  transition: transform 0.28s ease, box-shadow 0.28s ease, border-color 0.28s ease;
}

.gp-feature-detail::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: linear-gradient(90deg, var(--fd-accent, var(--gp-primary)), transparent 85%);
}

.gp-feature-detail::after {
  content: "";
  position: absolute;
  right: -48px;
  bottom: -48px;
  width: 160px;
  height: 160px;
  border-radius: 50%;
  background: var(--fd-bg, var(--gp-primary-light));
  opacity: 0.55;
  transition: transform 0.35s ease, opacity 0.35s ease;
}

.gp-feature-detail:hover {
  transform: translateY(-4px);
  border-color: rgba(0, 102, 255, 0.18);
  box-shadow: var(--gp-shadow-lg);
}

.gp-feature-detail:hover::after {
  transform: scale(1.12);
  opacity: 0.72;
}

.gp-feature-detail:nth-child(1) { --fd-accent: #0066ff; --fd-bg: #e8f1ff; }
.gp-feature-detail:nth-child(2) { --fd-accent: #0d9488; --fd-bg: #e6faf8; }
.gp-feature-detail:nth-child(3) { --fd-accent: #7c3aed; --fd-bg: #f0ebff; }
.gp-feature-detail:nth-child(4) { --fd-accent: #ea580c; --fd-bg: #fff4eb; }
.gp-feature-detail:nth-child(5) { --fd-accent: #059669; --fd-bg: #ecfdf5; }
.gp-feature-detail:nth-child(6) { --fd-accent: #4f46e5; --fd-bg: #eef2ff; }

.gp-feature-detail__bg-num {
  position: absolute;
  top: 1rem;
  right: 1.5rem;
  font-size: 4.5rem;
  font-weight: 800;
  line-height: 1;
  letter-spacing: -0.04em;
  color: var(--fd-accent, var(--gp-primary));
  opacity: 0.1;
  z-index: 0;
  pointer-events: none;
}

.gp-feature-detail__head {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  gap: 1.75rem;
  margin-bottom: 0;
}

.gp-feature-detail__icon {
  flex-shrink: 0;
  width: 104px;
  height: 104px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(145deg, var(--fd-bg, var(--gp-primary-light)) 0%, #fff 100%);
  border: 1px solid rgba(255, 255, 255, 0.85);
  border-radius: 24px;
  color: var(--fd-accent, var(--gp-primary));
  font-size: 2.75rem;
  box-shadow: 0 12px 28px rgba(10, 22, 40, 0.1);
  transition: transform 0.28s ease;
}

.gp-feature-detail:hover .gp-feature-detail__icon {
  transform: scale(1.06) rotate(-3deg);
}

.gp-feature-detail__intro {
  flex: 1;
  min-width: 0;
  padding-top: 0.25rem;
}

.gp-feature-detail__num {
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  color: var(--fd-accent, var(--gp-primary));
  background: var(--fd-bg, var(--gp-primary-light));
  padding: 0.3rem 0.75rem;
  border-radius: 999px;
  margin-bottom: 0.75rem;
}

.gp-feature-detail__title {
  font-size: clamp(1.375rem, 2.2vw, 1.625rem);
  font-weight: 800;
  line-height: 1.35;
  color: var(--gp-navy);
  margin-bottom: 0.5rem;
}

.gp-feature-detail__summary {
  font-size: var(--gp-type-body-size);
  line-height: var(--gp-type-body-lh);
  font-weight: 500;
  color: var(--gp-text-muted);
  margin-bottom: 0;
  padding-left: 0;
  border-left: none;
}

.gp-feature-detail__body {
  position: relative;
  z-index: 1;
  padding-top: 1.5rem;
  margin-top: 1.5rem;
  border-top: 1px solid var(--gp-border);
}

.gp-feature-detail__points {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem;
}

.gp-feature-detail__points li {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  font-size: var(--gp-type-body-size);
  line-height: var(--gp-type-body-lh);
  color: var(--gp-text);
  background: var(--gp-surface);
  border: 1px solid var(--gp-border);
  border-radius: 12px;
  padding: 0.875rem 1rem;
}

.gp-feature-detail__points i {
  flex-shrink: 0;
  margin-top: 0.15rem;
  font-size: 1.125rem;
  color: var(--fd-accent, var(--gp-primary));
}

.gp-features-page__cta {
  margin-top: 2.5rem;
  border-radius: var(--gp-radius-lg);
  background: linear-gradient(135deg, var(--gp-navy) 0%, var(--gp-navy-mid) 100%);
  padding: 2.25rem 2.5rem;
  box-shadow: var(--gp-shadow-lg);
}

.gp-features-page__cta-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 1.5rem 2rem;
}

.gp-features-page__cta-title {
  font-size: var(--gp-type-card-title-size);
  font-weight: 800;
  color: #fff;
  margin-bottom: 0.375rem;
}

.gp-features-page__cta-lead {
  font-size: var(--gp-type-lead-size);
  line-height: var(--gp-type-lead-lh);
  color: rgba(255, 255, 255, 0.75);
}

.landing-card {
  border: 1px solid var(--gp-border);
  border-radius: var(--gp-radius);
  box-shadow: var(--gp-shadow);
}

.landing-notice {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 1.25rem 1.5rem;
  background: var(--gp-primary-light);
  border-radius: var(--gp-radius);
  color: var(--gp-primary-dark);
  font-size: var(--gp-type-body-size);
  line-height: var(--gp-type-body-lh);
}

.accordion-button:focus {
  box-shadow: 0 0 0 0.2rem rgba(0, 102, 255, 0.2);
}

/* ── Footer ── */

.gp-footer {
  background: var(--gp-navy) !important;
  color: rgba(255, 255, 255, 0.6);
  border-top: none !important;
  padding: 2.5rem 0 !important;
  margin-top: auto;
}

.gp-footer__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  text-align: center;
}

.gp-footer__brand-block {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
}

.gp-footer__info {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  align-items: center;
}

.gp-footer__company {
  font-size: 1rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 0;
}

.gp-footer__tagline {
  font-size: 0.875rem;
  color: rgba(255, 255, 255, 0.55);
  margin-bottom: 0;
}

.gp-footer__contact {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem 1.5rem;
  font-size: 0.875rem;
}

.gp-footer__contact a {
  color: rgba(255, 255, 255, 0.8);
  text-decoration: none;
}

.gp-footer__contact a:hover {
  color: #fff;
  text-decoration: underline;
}

.gp-footer__address {
  font-size: 0.8125rem;
  line-height: 1.65;
  color: rgba(255, 255, 255, 0.45);
  max-width: 40rem;
  margin-bottom: 0;
}

.gp-footer__copy {
  font-size: 0.8125rem;
  color: rgba(255, 255, 255, 0.4);
  margin-bottom: 0;
  padding-top: 0.875rem;
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  width: 100%;
}

.gp-footer__inner p {
  margin-bottom: 0;
}

.gp-footer .gp-footer__brand,
.gp-footer .text-muted {
  color: rgba(255, 255, 255, 0.45) !important;
}

/* ── Layout ── */

html, body {
  min-height: 100%;
}

body {
  display: flex;
  flex-direction: column;
}

main {
  flex: 1;
}

/* ── Responsive ── */

@media (max-width: 1199.98px) {
  .gp-targets__grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .gp-stats__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 991.98px) {
  .gp-hero {
    padding: 3.5rem 0 4rem;
  }

  .gp-hero__visual {
    max-width: 520px;
    margin: 0 auto;
  }

  .gp-cta__actions {
    margin-left: 0;
  }

  .gp-trial__card {
    padding: 2.5rem;
  }

  .gp-trial__cta {
    margin-left: 0;
    width: 100%;
    text-align: left;
  }
}

@media (max-width: 767.98px) {
  .gp-pain-section,
  .gp-showcase,
  .gp-features,
  .gp-benefit,
  .gp-targets,
  .gp-pricing,
  .gp-setup {
    padding: 3.5rem 0;
  }

  .gp-trial {
    padding: 2.5rem 0;
  }

  .gp-setup__result {
    padding: 1.5rem;
  }

  .gp-trial__card {
    flex-direction: column;
    align-items: flex-start;
    padding: 2rem 1.5rem;
    gap: 1.5rem;
  }

  .gp-trial__btn {
    width: 100%;
    text-align: center;
  }

  .gp-pricing-hero {
    padding: 3rem 0 1.5rem;
  }

  .gp-features-hero {
    padding: 3rem 0 1.5rem;
  }

  .gp-features-page {
    padding: 1.5rem 0 3.5rem;
  }

  .gp-feature-detail {
    padding: 1.5rem 1.25rem;
  }

  .gp-feature-detail__head {
    flex-direction: column;
    align-items: flex-start;
    gap: 1.25rem;
  }

  .gp-feature-detail__icon {
    width: 88px;
    height: 88px;
    font-size: 2.25rem;
    border-radius: 20px;
  }

  .gp-feature-detail__bg-num {
    font-size: 3rem;
    top: 0.75rem;
    right: 1rem;
  }

  .gp-feature-detail__points {
    grid-template-columns: 1fr;
  }

  .gp-features-page__cta {
    padding: 1.75rem 1.5rem;
  }

  .gp-features-page__cta-inner {
    flex-direction: column;
    align-items: flex-start;
  }

  .gp-features-page__cta-inner .btn {
    width: 100%;
  }

  .gp-pricing-page {
    padding: 1.5rem 0 3.5rem;
  }

  .gp-pricing-cta {
    padding: 2rem 1.5rem;
  }

  .gp-pricing-cta__inner {
    flex-direction: column;
    align-items: flex-start;
  }

  .gp-pricing-cta__inner .btn {
    width: 100%;
  }

  .gp-pricing-table thead th,
  .gp-pricing-table tbody th,
  .gp-pricing-table tbody td {
    padding: 0.875rem 1rem;
    font-size: 0.9375rem;
  }

  .gp-targets__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .gp-cta__inner {
    flex-direction: column;
    align-items: flex-start;
  }

  .gp-cta__actions {
    width: 100%;
  }

  .gp-hero__actions {
    flex-direction: column;
  }

  .gp-hero__actions .btn {
    width: 100%;
    text-align: center;
  }

  .gp-compare__block {
    padding: 1.5rem 1.25rem;
  }

  .gp-compare__block--before {
    padding-right: 1.25rem;
  }

  .gp-compare__block-deco {
    display: none;
  }

  .gp-compare__chips {
    grid-template-columns: 1fr;
  }

  .gp-compare__pipeline {
    flex-direction: column;
    align-items: stretch;
  }

  .gp-compare__pipe-item,
  .gp-compare__pipe-item--ai {
    width: 100%;
    justify-content: center;
  }

  .gp-compare__pipe-link {
    flex: none;
    width: 0;
    height: 20px;
    max-width: none;
    border-top: none;
    border-left: 2px dotted #b8c4d8;
    margin: 0 auto;
  }

  .gp-compare__photo {
    min-height: 280px;
    aspect-ratio: 4 / 3;
  }
}

@media (max-width: 575.98px) {
  .gp-stats {
    padding: 2rem 0;
  }

  .gp-stats__grid {
    grid-template-columns: 1fr 1fr;
    gap: 1.5rem 1rem;
  }

  .gp-stat {
    padding: 0.5rem 0.75rem 0.75rem;
  }

  .gp-stat__icon {
    width: 72px;
    height: 72px;
    margin-bottom: 1.125rem;
    border-radius: 18px;
    font-size: 2rem;
  }

  .gp-stat__value {
    font-size: 1.25rem;
  }
}

/* ── 통화내역 목록 (균등 폭) ── */

.gp-calls-table {
  table-layout: fixed;
  width: 100%;
}

.gp-calls-table th,
.gp-calls-table td {
  width: 12.5%;
  white-space: normal;
  word-break: break-word;
  overflow-wrap: anywhere;
}

/* ── IVR 시나리오 (노드 흐름 + TTS) ── */

.gp-ivr-flow {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1.25rem;
  align-items: start;
}

.gp-ivr-node {
  background: #fff;
  border: 1px solid var(--gp-border);
  border-radius: var(--gp-radius-lg);
  padding: 1.25rem 1.5rem;
  box-shadow: var(--gp-shadow);
  transition: opacity 0.15s;
}

.gp-ivr-node--off {
  opacity: 0.6;
}

.gp-ivr-node__header {
  display: flex;
  align-items: flex-start;
  gap: 0.875rem;
}

.gp-ivr-node__index {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 1.875rem;
  height: 1.875rem;
  border-radius: 50%;
  background: var(--gp-primary);
  color: #fff;
  font-size: 0.9375rem;
  font-weight: 700;
}

.gp-ivr-node__titlewrap {
  flex: 1;
  min-width: 0;
}

.gp-ivr-node__title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  font-size: 1.1875rem;
  font-weight: 700;
  color: #1e293b;
}

.gp-ivr-node__title i {
  color: var(--gp-primary);
}

.gp-ivr-node__desc {
  margin: 0.25rem 0 0;
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.5;
}

.gp-ivr-node__switchwrap {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 0.625rem;
}

.gp-ivr-node__switch-label {
  font-size: 0.875rem;
  font-weight: 700;
  color: #64748b;
  white-space: nowrap;
}

.gp-ivr-node--off .gp-ivr-node__switch-label {
  color: #94a3b8;
}

.gp-ivr-node__switch {
  flex-shrink: 0;
}

.gp-ivr-node__body {
  margin-top: 1.125rem;
  padding-left: 2.75rem;
}

.gp-ivr-badge {
  flex-shrink: 0;
  padding: 0.3125rem 0.75rem;
  border-radius: 999px;
  font-size: 0.875rem;
  font-weight: 700;
  white-space: nowrap;
}

.gp-ivr-badge--required {
  background: #eef2ff;
  color: #4338ca;
  border: 1px solid #c7d2fe;
}

/* TTS 에디터 */
.gp-ivr-tts {
  width: 100%;
}

/* 재생바 가로폭을 텍스트 입력박스와 동일하게 */
.gp-ivr-tts__player.gp-recording-audio {
  max-width: none;
  width: 100%;
}

.gp-ivr-tts__head {
  margin-bottom: 0.5rem;
}

.gp-ivr-tts__bar {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  margin-top: 0.75rem;
}

.gp-ivr-tts__btns {
  flex-shrink: 0;
  display: flex;
  gap: 0.5rem;
}

.gp-ivr-tts__btns .btn {
  min-width: 6.5rem;
}

.gp-ivr-tts__count {
  flex-shrink: 0;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #94a3b8;
  white-space: nowrap;
}

.gp-ivr-tts__status {
  flex: 1;
  text-align: center;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #94a3b8;
}

.gp-ivr-tts__status--done {
  color: #15803d;
}

.gp-ivr-tts__status--applied {
  color: #15803d;
}

.gp-ivr-tts__status--stale {
  color: #b45309;
}

.gp-ivr-tts__status--loading {
  color: var(--gp-primary);
}

.gp-ivr-tts__status--pending {
  color: #b45309;
}

.gp-ivr-tts__status--off {
  color: #94a3b8;
}

.gp-ivr-tts__player {
  margin-top: 1rem;
}

.gp-ivr-note {
  margin: 1rem 0 0;
  font-size: 0.8125rem;
  color: #64748b;
  line-height: 1.6;
}

.gp-ivr-note i {
  color: var(--gp-primary);
  margin-right: 0.25rem;
}

/* AI 상담 노드 */
.gp-ivr-ai__lead {
  margin: 0 0 0.875rem;
  font-size: 0.9375rem;
  color: #334155;
}

.gp-ivr-ai__links {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.gp-ivr-ai__link {
  display: flex;
  align-items: flex-start;
  gap: 0.875rem;
  padding: 1rem;
  border: 1px solid var(--gp-border);
  border-radius: 12px;
  background: #f8fafc;
  text-decoration: none;
  transition: border-color 0.15s, background 0.15s;
}

.gp-ivr-ai__link:hover {
  border-color: var(--gp-primary);
  background: #f0f7ff;
}

.gp-ivr-ai__link-icon {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 10px;
  background: #eef2ff;
  color: var(--gp-primary);
  font-size: 1.125rem;
}

.gp-ivr-ai__link-text {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 0.1875rem;
}

.gp-ivr-ai__link-title {
  font-size: 0.9375rem;
  font-weight: 700;
  color: #1e293b;
}

.gp-ivr-ai__link-desc {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.55;
}

.gp-ivr-ai__link-status {
  flex-shrink: 0;
  align-self: flex-start;
  padding: 0.25rem 0.625rem;
  border-radius: 999px;
  font-size: 0.75rem;
  font-weight: 700;
  white-space: nowrap;
}

.gp-ivr-ai__link-status--done {
  background: #ecfdf5;
  color: #047857;
  border: 1px solid #a7f3d0;
}

.gp-ivr-ai__link-status--todo {
  background: #fff7ed;
  color: #c2410c;
  border: 1px solid #fed7aa;
}

.gp-ivr-ai__link-arrow {
  align-self: center;
  flex-shrink: 0;
  color: #cbd5e1;
  font-size: 1rem;
}

.gp-ivr-ai__link:hover .gp-ivr-ai__link-arrow {
  color: var(--gp-primary);
}

.gp-ivr-applynote {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  margin-top: 1.5rem;
  padding: 1rem 1.25rem;
  border: 1px solid #fecaca;
  border-left: 4px solid #dc2626;
  border-radius: 10px;
  background: #fef2f2;
  color: #991b1b;
  font-size: 1rem;
  font-weight: 600;
}

.gp-ivr-applynote i {
  flex-shrink: 0;
  font-size: 1.25rem;
  color: #dc2626;
}

.gp-ivr-applynote strong {
  font-weight: 800;
}

.gp-ivr-setup-banner {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
  margin-bottom: 1.25rem;
  padding: 1rem 1.25rem;
  border: 1px solid #bfdbfe;
  border-left: 4px solid var(--gp-primary);
  border-radius: 10px;
  background: #f0f7ff;
  color: #1e3a8a;
  font-size: 0.9375rem;
  line-height: 1.6;
}

.gp-ivr-setup-banner i {
  flex-shrink: 0;
  margin-top: 0.125rem;
  font-size: 1.125rem;
  color: var(--gp-primary);
}

.gp-ivr-setup-banner strong {
  font-weight: 800;
}

@media (max-width: 991.98px) {
  .gp-ivr-flow {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 575.98px) {
  .gp-ivr-node__body {
    padding-left: 0;
  }

  .gp-ivr-node__switchwrap {
    flex-direction: column;
    align-items: flex-end;
    gap: 0.25rem;
  }

  .gp-ivr-tts__bar {
    flex-wrap: wrap;
  }

  .gp-ivr-tts__btns {
    width: 100%;
  }

  .gp-ivr-tts__status {
    flex: 1 1 100%;
    order: 3;
    text-align: left;
    margin-top: 0.125rem;
  }

  .gp-ivr-ai__link {
    flex-wrap: wrap;
  }

  .gp-ivr-ai__link-status {
    order: 4;
    margin-left: 3.375rem;
  }

  .gp-ivr-ai__link-arrow {
    margin-left: auto;
  }
}

/* ── 녹취내역 (선택/재생/다운로드) ── */

.gp-rec-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-end;
  gap: 0.75rem;
  margin-bottom: 1rem;
}

.gp-rec-select-count {
  font-size: 0.875rem;
  font-weight: 600;
  color: #475569;
}

.gp-rec-table th.gp-rec-col-check,
.gp-rec-table td.gp-rec-col-check {
  width: 2.75rem;
  text-align: center;
  vertical-align: middle;
}

.gp-rec-table th.gp-rec-col-actions {
  width: 1%;
  white-space: nowrap;
}

.gp-rec-actions {
  white-space: nowrap;
}

.gp-rec-actions .btn + .btn {
  margin-left: 0.375rem;
}

/* ── 고객정보 팝업 (웹훅 호출) ── */

.gp-cpopup-enable-row {
  max-width: 42rem;
}

.gp-cpopup-config {
  margin: 0;
  padding: 0;
  border: 0;
  min-width: 0;
  transition: opacity 0.15s;
}

.gp-cpopup-config--off {
  opacity: 0.55;
}

.gp-cpopup-field + .gp-cpopup-field {
  margin-top: 1.25rem;
}

.gp-cpopup-url {
  max-width: 42rem;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  font-size: 0.875rem;
}

.gp-cpopup-method {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
}

.gp-cpopup-method__option {
  margin: 0;
  cursor: pointer;
}

.gp-cpopup-method__option input {
  position: absolute;
  opacity: 0;
  width: 0;
  height: 0;
}

.gp-cpopup-method__box {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  min-width: 12rem;
  padding: 0.75rem 1rem;
  border: 1px solid var(--gp-border);
  border-radius: 12px;
  background: #fff;
  transition: border-color 0.15s, background 0.15s, box-shadow 0.15s;
}

.gp-cpopup-method__box strong {
  font-size: 0.9375rem;
  font-weight: 700;
  color: #1e293b;
}

.gp-cpopup-method__box small {
  font-size: 0.8125rem;
  color: #94a3b8;
}

.gp-cpopup-method__option input:checked + .gp-cpopup-method__box {
  border-color: var(--gp-primary);
  background: #f0f7ff;
  box-shadow: 0 0 0 1px var(--gp-primary) inset;
}

.gp-cpopup-method__option input:focus-visible + .gp-cpopup-method__box {
  box-shadow: 0 0 0 0.2rem rgba(0, 102, 255, 0.2);
}

.gp-cpopup-help {
  margin: 0 0 0.875rem;
  font-size: 0.875rem;
  color: #64748b;
  line-height: 1.6;
}

.gp-cpopup-vartable {
  display: flex;
  flex-direction: column;
  border: 1px solid #e2e8f0;
  border-radius: 12px;
  overflow: hidden;
  max-width: 42rem;
}

.gp-cpopup-varrow {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 0.875rem 1rem;
  background: #fff;
}

.gp-cpopup-varrow + .gp-cpopup-varrow {
  border-top: 1px solid #e2e8f0;
}

.gp-cpopup-code {
  flex-shrink: 0;
  min-width: 5.5rem;
  padding: 0.3125rem 0.625rem;
  border-radius: 8px;
  background: #0f172a;
  color: #7dd3fc;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  font-size: 0.875rem;
  font-weight: 600;
  text-align: center;
}

.gp-cpopup-varinfo {
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  flex: 1;
  min-width: 0;
}

.gp-cpopup-varname {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #1e293b;
}

.gp-cpopup-varex {
  font-size: 0.8125rem;
  color: #94a3b8;
}

.gp-cpopup-insert {
  flex-shrink: 0;
  padding: 0.4375rem 0.875rem;
  border: 1px solid var(--gp-primary);
  border-radius: 8px;
  background: #fff;
  color: var(--gp-primary);
  font-size: 0.8125rem;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s, color 0.15s;
}

.gp-cpopup-insert:hover {
  background: var(--gp-primary);
  color: #fff;
}

.gp-cpopup-example {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.625rem;
  max-width: 42rem;
  margin-top: 1rem;
  padding: 0.875rem 1rem;
  border: 1px dashed #cbd5e1;
  border-radius: 12px;
  background: #f8fafc;
}

.gp-cpopup-example__label {
  flex-shrink: 0;
  font-size: 0.8125rem;
  font-weight: 700;
  color: #64748b;
}

.gp-cpopup-example__code {
  flex: 1;
  min-width: 0;
  color: #334155;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  font-size: 0.8125rem;
  word-break: break-all;
}

.gp-cpopup-preview {
  max-width: 42rem;
  padding: 1rem;
  border-radius: 12px;
  background: #0f172a;
}

.gp-cpopup-preview__row {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}

.gp-cpopup-preview__method {
  flex-shrink: 0;
  padding: 0.25rem 0.625rem;
  border-radius: 6px;
  background: #1d4ed8;
  color: #fff;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  font-size: 0.8125rem;
  font-weight: 700;
}

.gp-cpopup-preview__url {
  flex: 1;
  min-width: 0;
  color: #e2e8f0;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
  font-size: 0.8125rem;
  line-height: 1.7;
  word-break: break-all;
}

.gp-cpopup-preview__url--empty {
  color: #64748b;
}

@media (max-width: 575.98px) {
  .gp-cpopup-varrow {
    flex-wrap: wrap;
  }

  .gp-cpopup-insert {
    margin-left: auto;
  }

  .gp-cpopup-method__box {
    min-width: 0;
  }

  .gp-cpopup-method__option {
    flex: 1;
  }
}