/**
 * Module CSS: 38-conversion-v3.css
 * Trích nguyên văn dòng 2494-2712 của pctech-homepage.css gốc.
 * Không đổi nội dung — chỉ tách file theo đúng marker sẵn có trong code gốc.
 */
    /* ── Conversion V3 ── */
    .slot-50k-bar {
      background: linear-gradient(90deg, #1a4a8f, #0d6e4a);
      color: #fff;
      padding: 12px 0;
      border-bottom: 2px solid var(--orange);
    }
    .slot-inner {
      display: flex;
      align-items: center;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 12px;
      font-size: 0.9rem;
    }
    .slot-inner strong { color: #ffd080; }
    .slot-hold-timer {
      font-size: 0.8rem;
      background: rgba(255,255,255,0.15);
      padding: 4px 12px;
      border-radius: 50px;
      display: none;
    }
    .slot-hold-timer.active { display: inline-block; }
    .intent-filter {
      padding: 40px 0;
      background: var(--white);
      border-bottom: 1px solid var(--gray-100);
    }
    .intent-filter p {
      text-align: center;
      font-weight: 700;
      color: var(--blue-dark);
      margin-bottom: 20px;
      font-size: 1.05rem;
    }
    .intent-btns {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 16px;
      max-width: 900px;
      margin: 0 auto;
    }
    .intent-btn {
      padding: 24px 20px;
      border: 2px solid var(--gray-200);
      border-radius: var(--radius);
      background: var(--white);
      font-family: inherit;
      cursor: pointer;
      text-align: center;
      transition: all 0.3s;
    }
    .intent-btn:hover, .intent-btn.active {
      border-color: var(--orange);
      background: var(--orange-light);
      transform: translateY(-4px);
      box-shadow: var(--shadow);
    }
    .intent-btn .intent-icon { font-size: 2rem; display: block; margin-bottom: 8px; }
    .intent-btn strong { display: block; color: var(--blue-dark); font-size: 1rem; margin-bottom: 4px; }
    .intent-btn span { font-size: 0.82rem; color: var(--gray-500); }
    .pledge-sticky {
      position: fixed;
      top: var(--header-h);
      left: 0; right: 0;
      z-index: 997;
      background: linear-gradient(90deg, var(--blue-deeper), var(--blue-dark));
      color: #fff;
      padding: 8px 16px;
      font-size: 0.78rem;
      font-weight: 600;
      text-align: center;
      display: flex;
      justify-content: center;
      flex-wrap: wrap;
      gap: 8px 20px;
      transform: translateY(-100%);
      opacity: 0;
      transition: transform 0.35s ease, opacity 0.35s ease;
      box-shadow: 0 4px 16px rgba(0,0,0,0.2);
    }
    .pledge-sticky.visible { transform: translateY(0); opacity: 1; }
    .pledge-sticky span::before { content: '✓ '; color: var(--orange); }
    .compare-section { padding: 48px 0; background: var(--gray-50); }
    .compare-table {
      width: 100%;
      border-collapse: collapse;
      background: var(--white);
      border-radius: var(--radius);
      overflow: hidden;
      box-shadow: var(--shadow);
    }
    .compare-table th, .compare-table td {
      padding: 16px 20px;
      text-align: left;
      border-bottom: 1px solid var(--gray-100);
      font-size: 0.9rem;
    }
    .compare-table th { background: var(--blue-dark); color: #fff; font-weight: 700; }
    .compare-table th.pctech-col { background: var(--orange-dark); }
    .compare-table td.pctech-col { background: var(--orange-light); font-weight: 600; }
    .compare-table .yes { color: var(--green); font-weight: 700; }
    .compare-table .no { color: #dc2626; }
    .compare-table .warn { color: var(--orange-dark); }
    .map-live-wrap { position: relative; }
    .map-pins {
      position: absolute;
      inset: 0;
      pointer-events: none;
      z-index: 2;
    }
    .map-pin {
      position: absolute;
      transform: translate(-50%, -50%);
      pointer-events: auto;
      cursor: pointer;
    }
    .map-pin-dot {
      width: 14px; height: 14px;
      background: var(--orange);
      border: 2px solid #fff;
      border-radius: 50%;
      box-shadow: 0 0 0 0 rgba(232,135,10,0.6);
      animation: mapPinPulse 2s ease infinite;
    }
  .map-pin-label {
      position: absolute;
      left: 50%; top: 100%;
      transform: translateX(-50%);
      margin-top: 6px;
      background: rgba(6,42,85,0.92);
      color: #fff;
      font-size: 0.65rem;
      font-weight: 600;
      padding: 4px 8px;
      border-radius: 6px;
      white-space: nowrap;
      opacity: 0;
      transition: opacity 0.2s;
      pointer-events: none;
    }
    .map-pin:hover .map-pin-label { opacity: 1; }
    @keyframes mapPinPulse {
      0%, 100% { box-shadow: 0 0 0 0 rgba(232,135,10,0.6); }
      50% { box-shadow: 0 0 0 10px rgba(232,135,10,0); }
    }
    .done-ticker {
      position: fixed;
      left: calc(var(--side-rail-w) + 8px);
      top: calc(var(--header-h) + 80px);
      z-index: 9985;
      max-width: 240px;
      display: flex;
      flex-direction: column;
      gap: 8px;
      pointer-events: none;
    }
    .done-ticker-item {
      background: var(--white);
      border-left: 3px solid var(--green);
      border-radius: 10px;
      padding: 10px 12px;
      font-size: 0.72rem;
      box-shadow: var(--shadow);
      opacity: 0;
      transform: translateX(-20px);
      transition: opacity 0.4s, transform 0.4s;
    }
    .done-ticker-item.show { opacity: 1; transform: translateX(0); }
    .done-ticker-item strong { color: var(--green); }
    .quickbook-steps { display: flex; gap: 8px; margin-bottom: 24px; }
    .quickbook-step-dot {
      flex: 1; height: 4px; border-radius: 2px;
      background: var(--gray-200);
      transition: background 0.3s;
    }
    .quickbook-step-dot.active, .quickbook-step-dot.done { background: var(--green); }
    .quickbook-panel { display: none; }
    .quickbook-panel.active { display: block; }
    .quickbook-svc-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 16px; }
    .quickbook-svc {
      padding: 16px 12px;
      border: 2px solid var(--gray-200);
      border-radius: var(--radius-sm);
      background: var(--white);
      font-family: inherit;
      font-size: 0.85rem;
      font-weight: 600;
      cursor: pointer;
      text-align: center;
    }
    .quickbook-svc:hover, .quickbook-svc.selected { border-color: var(--green); background: var(--green-light); }
    .quickbook-success { text-align: center; padding: 16px 0; }
    .quickbook-success .success-icon { font-size: 3rem; margin-bottom: 12px; }
    .price-hold-banner {
      background: var(--orange-light);
      border: 1px solid var(--orange);
      border-radius: var(--radius-sm);
      padding: 10px 14px;
      font-size: 0.85rem;
      margin-bottom: 16px;
      text-align: center;
      display: none;
    }
    .price-hold-banner.active { display: block; }
    .price-hold-banner strong { color: var(--orange-dark); font-size: 1.1rem; }
    @media (max-width: 1100px) {
      .done-ticker { left: 12px; }
    }
    @media (max-width: 768px) {
      .intent-btns { grid-template-columns: 1fr; }
      .done-ticker { display: none; }
      .pledge-sticky { font-size: 0.7rem; padding: 6px 10px; gap: 4px 12px; }
      .compare-table { font-size: 0.8rem; }
      .compare-table th, .compare-table td { padding: 10px 12px; }
      .quickbook-svc-grid { grid-template-columns: 1fr; }
    }

