/* ============================================================================
   LVTC DESIGN SYSTEM
   Reusable components, tokens, and utilities for all articles
   Reference implementation: Article 001
   ============================================================================ */

/* ---------- TYPOGRAPHY TOKENS ---------- */
:root {
  /* Display / H1 */
  --lvtc-h1-size-mobile: clamp(28px, 8vw, 52px);
  --lvtc-h1-size-desktop: 52px;
  --lvtc-h1-line-height: 1.2;
  --lvtc-h1-weight: 700;
  --lvtc-h1-letter-spacing: -0.01em;

  /* H2 */
  --lvtc-h2-size-mobile: clamp(24px, 6vw, 40px);
  --lvtc-h2-size-desktop: 40px;
  --lvtc-h2-line-height: 1.3;
  --lvtc-h2-weight: 700;
  --lvtc-h2-margin-top: 48px;
  --lvtc-h2-margin-bottom: 24px;

  /* H3 */
  --lvtc-h3-size-mobile: clamp(18px, 5vw, 24px);
  --lvtc-h3-size-desktop: 24px;
  --lvtc-h3-line-height: 1.4;
  --lvtc-h3-weight: 600;
  --lvtc-h3-margin-top: 32px;
  --lvtc-h3-margin-bottom: 16px;

  /* Body */
  --lvtc-body-size-mobile: 16px;
  --lvtc-body-size-desktop: 18px;
  --lvtc-body-line-height: 1.75;
  --lvtc-body-weight: 400;

  /* Lead Paragraph */
  --lvtc-lead-size: clamp(16px, 2.5vw, 20px);
  --lvtc-lead-line-height: 1.8;
  --lvtc-lead-weight: 500;

  /* Caption */
  --lvtc-caption-size: 14px;
  --lvtc-caption-line-height: 1.6;
  --lvtc-caption-color: var(--lvtc-ink-2);

  /* Small Text */
  --lvtc-small-size: 13px;
  --lvtc-small-line-height: 1.5;

  /* Meta Text (byline, date) */
  --lvtc-meta-size: 13px;
  --lvtc-meta-line-height: 1.6;
  --lvtc-meta-color: var(--lvtc-ink-2);

  /* Quote Text */
  --lvtc-quote-size: clamp(18px, 3vw, 24px);
  --lvtc-quote-line-height: 1.8;
  --lvtc-quote-style: italic;
  --lvtc-quote-weight: 500;
}

/* ---------- SPACING TOKENS ---------- */
:root {
  --lvtc-space-xs: 8px;
  --lvtc-space-sm: 12px;
  --lvtc-space-md: 16px;
  --lvtc-space-lg: 24px;
  --lvtc-space-xl: 32px;
  --lvtc-space-2xl: 48px;
  --lvtc-space-3xl: 64px;

  /* Article column width */
  --lvtc-article-width: 760px;
  --lvtc-article-width-wide: 900px;
  --lvtc-article-gutter: var(--lvtc-container-pad);
}

/* ---------- COMPONENT SIZE TOKENS ---------- */
:root {
  /* Images */
  --lvtc-image-hero-height: clamp(300px, 50vw, 500px);
  --lvtc-image-inline-max-width: 100%;
  --lvtc-image-caption-padding: 12px;

  /* Tables */
  --lvtc-table-cell-padding: 16px;
  --lvtc-table-border: 1px solid var(--lvtc-line-2);
  --lvtc-table-header-bg: rgba(200,163,90,0.12);

  /* Lists */
  --lvtc-list-item-spacing: 12px;
  --lvtc-list-padding: 1.2em;

  /* Callouts */
  --lvtc-callout-padding: 24px;
  --lvtc-callout-border-left: 4px solid var(--lvtc-gold);
  --lvtc-callout-margin: 32px 0;
}

/* ---------- ARTICLE TYPOGRAPHY CLASSES ---------- */
.lvtc-article__title,
.lvtc-article__title h1 {
  font-size: var(--lvtc-h1-size-mobile);
  line-height: var(--lvtc-h1-line-height);
  font-weight: var(--lvtc-h1-weight);
  letter-spacing: var(--lvtc-h1-letter-spacing);
  margin: var(--lvtc-space-xl) 0 var(--lvtc-space-2xl);
  color: var(--lvtc-ink);
}

@media (min-width: 768px) {
  .lvtc-article__title,
  .lvtc-article__title h1 {
    font-size: var(--lvtc-h1-size-desktop);
  }
}

.lvtc-article__content h2 {
  font-size: var(--lvtc-h2-size-mobile);
  line-height: var(--lvtc-h2-line-height);
  font-weight: var(--lvtc-h2-weight);
  margin-top: var(--lvtc-h2-margin-top);
  margin-bottom: var(--lvtc-h2-margin-bottom);
  color: var(--lvtc-ink);
  scroll-margin-top: 100px;
}

@media (min-width: 768px) {
  .lvtc-article__content h2 {
    font-size: var(--lvtc-h2-size-desktop);
  }
}

.lvtc-article__content h3 {
  font-size: var(--lvtc-h3-size-mobile);
  line-height: var(--lvtc-h3-line-height);
  font-weight: var(--lvtc-h3-weight);
  margin-top: var(--lvtc-h3-margin-top);
  margin-bottom: var(--lvtc-h3-margin-bottom);
  color: var(--lvtc-ink);
  scroll-margin-top: 100px;
}

@media (min-width: 768px) {
  .lvtc-article__content h3 {
    font-size: var(--lvtc-h3-size-desktop);
  }
}

.lvtc-article__content p {
  font-size: var(--lvtc-body-size-mobile);
  line-height: var(--lvtc-body-line-height);
  font-weight: var(--lvtc-body-weight);
  margin: var(--lvtc-space-lg) 0;
  color: var(--lvtc-ink);
}

@media (min-width: 768px) {
  .lvtc-article__content p {
    font-size: var(--lvtc-body-size-desktop);
  }
}

.lvtc-article__dek {
  font-size: var(--lvtc-lead-size);
  line-height: var(--lvtc-lead-line-height);
  font-weight: var(--lvtc-lead-weight);
  color: var(--lvtc-ink-2);
  margin: var(--lvtc-space-lg) 0;
}

/* ---------- REUSABLE COMPONENT STYLES ---------- */

/* Editorial Note Block */
.lvtc-editorial-note {
  background: rgba(200,163,90,0.08);
  border-left: var(--lvtc-callout-border-left);
  padding: var(--lvtc-callout-padding);
  margin: var(--lvtc-callout-margin);
  border-radius: 2px;
}

.lvtc-editorial-note__label {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--lvtc-gold);
  font-weight: 600;
  margin-bottom: var(--lvtc-space-sm);
}

.lvtc-editorial-note__text {
  font-size: var(--lvtc-caption-size);
  color: var(--lvtc-ink-2);
  line-height: var(--lvtc-caption-line-height);
  margin: var(--lvtc-space-sm) 0;
}

/* Vegas Insider Tip */
.lvtc-insider-tip {
  background: rgba(200,163,90,0.06);
  border-left: var(--lvtc-callout-border-left);
  padding: var(--lvtc-callout-padding);
  margin: var(--lvtc-callout-margin);
  border-radius: 2px;
  font-size: 15px;
}

/* Nevada Law Notice */
.lvtc-law-notice {
  background: rgba(255,45,122,0.06);
  border-left: 4px solid var(--lvtc-neon);
  padding: var(--lvtc-callout-padding);
  margin: var(--lvtc-callout-margin);
  border-radius: 2px;
}

/* Summary/Key Takeaways */
.lvtc-summary-box {
  background: rgba(200,163,90,0.05);
  border: 1px solid rgba(200,163,90,0.2);
  padding: var(--lvtc-callout-padding);
  margin: var(--lvtc-space-2xl) 0;
  border-radius: 4px;
}

.lvtc-summary-box h2 {
  font-size: var(--lvtc-h2-size-desktop);
  margin-top: 0;
  margin-bottom: var(--lvtc-space-lg);
}

.lvtc-summary-box ul li {
  margin: var(--lvtc-list-item-spacing) 0;
  line-height: var(--lvtc-body-line-height);
  font-size: 15px;
}

/* Tables */
.lvtc-article__content table {
  width: 100%;
  margin: var(--lvtc-space-2xl) 0;
  border-collapse: collapse;
  font-size: clamp(13px, 1.5vw, 15px);
  background: rgba(200,163,90,0.02);
  border-radius: 4px;
  overflow: hidden;
}

.lvtc-article__content thead {
  background: var(--lvtc-table-header-bg);
}

.lvtc-article__content th {
  padding: var(--lvtc-table-cell-padding);
  text-align: left;
  color: var(--lvtc-gold);
  font-weight: 600;
  border-bottom: 2px solid var(--lvtc-line-2);
}

.lvtc-article__content td {
  padding: var(--lvtc-table-cell-padding);
  border-bottom: 1px solid var(--lvtc-line-2);
  line-height: 1.6;
}

.lvtc-article__content tbody tr:nth-child(even) {
  background: rgba(255,255,255,0.02);
}

.lvtc-article__content tbody tr:hover {
  background: rgba(200,163,90,0.08);
}

/* Lists */
.lvtc-article__content ul,
.lvtc-article__content ol {
  margin: var(--lvtc-space-lg) 0 var(--lvtc-space-lg) var(--lvtc-list-padding);
  padding-left: 0;
  font-size: clamp(15px, 2vw, 18px);
}

.lvtc-article__content li {
  margin: var(--lvtc-list-item-spacing) 0;
  line-height: var(--lvtc-body-line-height);
}

/* Related Guides Cards */
.lvtc-related-guides {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--lvtc-space-lg);
  margin: var(--lvtc-space-2xl) 0;
}

.lvtc-guide-card {
  background: rgba(200,163,90,0.06);
  border: 1px solid var(--lvtc-line-2);
  border-radius: 4px;
  padding: var(--lvtc-callout-padding);
  transition: all 0.3s var(--lvtc-ease);
}

.lvtc-guide-card:hover {
  background: rgba(200,163,90,0.1);
  border-color: var(--lvtc-gold);
  transform: translateY(-2px);
}

.lvtc-guide-card__label {
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--lvtc-gold);
  font-weight: 600;
  margin-bottom: var(--lvtc-space-sm);
}

.lvtc-guide-card__title {
  font-size: 16px;
  color: var(--lvtc-ink);
  margin: var(--lvtc-space-sm) 0;
  font-weight: 600;
}

.lvtc-guide-card__description {
  font-size: var(--lvtc-caption-size);
  color: var(--lvtc-ink-2);
  line-height: 1.6;
  margin: var(--lvtc-space-sm) 0;
}

.lvtc-guide-card__link {
  color: var(--lvtc-gold);
  font-weight: 600;
  display: inline-block;
  margin-top: var(--lvtc-space-lg);
  transition: color 0.2s var(--lvtc-ease);
}

.lvtc-guide-card__link:hover {
  text-decoration: underline;
}

/* Trust & Editorial Standards */
.lvtc-trust-signals {
  background: rgba(200,163,90,0.08);
  border-left: var(--lvtc-callout-border-left);
  padding: var(--lvtc-callout-padding);
  margin: var(--lvtc-space-2xl) 0;
  border-radius: 2px;
  font-size: 13px;
}

.lvtc-trust-signals h3 {
  margin-top: 0;
  color: var(--lvtc-gold);
  font-size: 16px;
  margin-bottom: var(--lvtc-space-md);
}

.lvtc-trust-signals p {
  margin: var(--lvtc-space-sm) 0;
  line-height: 1.7;
}

/* Images */
.lvtc-article__image {
  width: 100%;
  margin: var(--lvtc-space-2xl) 0;
  border-radius: 4px;
  overflow: hidden;
}

.lvtc-article__image img {
  width: 100%;
  height: auto;
  display: block;
}

.lvtc-image-caption {
  margin-top: var(--lvtc-image-caption-padding);
  font-size: var(--lvtc-caption-size);
  color: var(--lvtc-ink-2);
  line-height: var(--lvtc-caption-line-height);
}

/* Article Meta */
.lvtc-article__meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--lvtc-space-md);
  font-size: var(--lvtc-meta-size);
  color: var(--lvtc-ink-2);
  margin: var(--lvtc-space-lg) 0;
}

.lvtc-article__meta-sep {
  color: var(--lvtc-line-2);
}

/* FAQ Accordion */
.lvtc-faq-item {
  margin: var(--lvtc-space-lg) 0;
  border-bottom: 1px solid var(--lvtc-line);
  padding-bottom: var(--lvtc-space-lg);
}

.lvtc-faq-item:last-child {
  border-bottom: none;
}

.lvtc-faq-item h3 {
  margin: var(--lvtc-space-md) 0;
  cursor: pointer;
  transition: color 0.2s var(--lvtc-ease);
}

.lvtc-faq-item h3:hover {
  color: var(--lvtc-gold);
}

.lvtc-faq-item__answer {
  margin-top: var(--lvtc-space-md);
  font-size: var(--lvtc-body-size-mobile);
  line-height: var(--lvtc-body-line-height);
  color: var(--lvtc-ink);
}

@media (min-width: 768px) {
  .lvtc-faq-item__answer {
    font-size: var(--lvtc-body-size-desktop);
  }
}

/* Checklist */
.lvtc-checklist {
  list-style: none;
  padding: 0;
  margin: var(--lvtc-space-lg) 0;
}

.lvtc-checklist li {
  display: flex;
  align-items: flex-start;
  gap: var(--lvtc-space-md);
  margin: var(--lvtc-space-md) 0;
  font-size: var(--lvtc-body-size-mobile);
  line-height: var(--lvtc-body-line-height);
}

@media (min-width: 768px) {
  .lvtc-checklist li {
    font-size: var(--lvtc-body-size-desktop);
  }
}

.lvtc-checklist li::before {
  content: "☐";
  flex-shrink: 0;
  color: var(--lvtc-gold);
  font-weight: bold;
  width: 20px;
}

/* Pull Quote */
.lvtc-pull-quote {
  border-left: 4px solid var(--lvtc-gold);
  padding-left: var(--lvtc-space-lg);
  margin: var(--lvtc-space-2xl) 0;
  font-size: var(--lvtc-quote-size);
  line-height: var(--lvtc-quote-line-height);
  font-style: var(--lvtc-quote-style);
  font-weight: var(--lvtc-quote-weight);
  color: var(--lvtc-ink);
}

.lvtc-pull-quote__attribution {
  margin-top: var(--lvtc-space-md);
  font-size: var(--lvtc-meta-size);
  color: var(--lvtc-ink-2);
  font-style: normal;
  font-weight: normal;
}

/* Responsive Images */
@media (max-width: 767px) {
  .lvtc-article__image {
    margin-left: calc(var(--lvtc-article-gutter) * -1);
    margin-right: calc(var(--lvtc-article-gutter) * -1);
    width: calc(100% + (var(--lvtc-article-gutter) * 2));
    border-radius: 0;
  }
}