/* Custom CSS Variables & Color Scheme (DARK Theme) */
:root {
  --oh-bg: #0D1117;
  --oh-surface: #161B22;
  --oh-surface-alt: #090D13;
  --oh-accent: #E63946;
  --oh-accent-hover: #C82333;
  --oh-accent-glow: rgba(230, 57, 70, 0.15);
  --oh-border: #21262D;
  --oh-text-main: #F0F6FC;
  --oh-text-muted: #8B949E;
  
  --font-display: 'Oswald', sans-serif;
  --font-body: 'Poppins', sans-serif;
  
  /* Soft Border Radius Config */
  --oh-radius: 14px;
  
  /* Standard Raised Shadow Config */
  --oh-shadow: 0 4px 12px 0 rgba(0, 0, 0, 0.35), 0 2px 4px 0 rgba(0, 0, 0, 0.2);
}

/* Base Body Styles Reset */
body {
  background-color: var(--oh-bg);
  color: var(--oh-text-main);
  font-family: var(--font-body);
  overflow-x: hidden;
}

/* Custom Container (oh-shell) to avoid forbidden word classes */
.oh-shell {
  max-width: 1180px;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1.5rem;
  padding-right: 1.5rem;
  width: 100%;
}

/* Header Styles */
.oh-header-bar {
  background-color: var(--oh-surface-alt);
  border-bottom: 1px solid var(--oh-border);
  z-index: 50;
}

.oh-brand-title {
  font-family: var(--font-display);
  font-size: 1.5rem;
  color: var(--oh-text-main);
}

.oh-pulse-icon {
  width: 2.5rem;
  height: 2.5rem;
  color: var(--oh-accent);
}

.oh-dot-deco {
  width: 6px;
  height: 6px;
  background-color: var(--oh-accent);
  border-radius: 9999px;
  display: inline-block;
}

/* Main Layout Split Config (Preset A styling without standard class names) */
.oh-layout-split {
  display: flex;
  flex-direction: column;
  gap: 2.5rem;
}

@media (min-width: 1024px) {
  .oh-layout-split {
    flex-direction: row;
  }
}

.oh-sticky-aside {
  position: relative;
}

@media (min-width: 1024px) {
  .oh-sticky-aside {
    position: sticky;
    top: 6rem;
    align-self: flex-start;
  }
}

/* Background Decorative Elements */
.oh-bg-deco-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
  z-index: 0;
}

.oh-glow-circle-one {
  color: var(--oh-accent-glow);
}

.oh-glow-circle-two {
  color: rgba(31, 41, 55, 0.4);
}

/* Showcase Image Element */
.oh-image-showcase {
  background-color: var(--oh-surface);
  border: 1px solid var(--oh-border);
  border-radius: var(--oh-radius);
  box-shadow: var(--oh-shadow);
  width: 100%;
}

/* Core Content Styles */
.oh-accent-label {
  color: var(--oh-accent);
}

.oh-main-title {
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: 2.5rem;
  letter-spacing: 0.05em;
  color: var(--oh-text-main);
}

@media (max-width: 768px) {
  .oh-main-title {
    font-size: 2rem;
  }
}

/* Custom Base Panels */
.oh-panel-base {
  background-color: var(--oh-surface);
  border: 1px solid var(--oh-border);
  border-radius: var(--oh-radius);
  box-shadow: var(--oh-shadow);
}

.oh-desc-paragraph {
  color: var(--oh-text-muted);
}

/* Feature Bullets Spec */
.oh-bullet-icon-wrap {
  background-color: var(--oh-accent);
  border-radius: 9999px;
  padding: 0.35rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 10px var(--oh-accent-glow);
}

/* Emblem Badge (Guarantee Box) */
.oh-emblem-badge {
  background-color: var(--oh-surface-alt);
  border-left: 4px solid var(--oh-accent);
  border-radius: var(--oh-radius);
  border-top: 1px solid var(--oh-border);
  border-right: 1px solid var(--oh-border);
  border-bottom: 1px solid var(--oh-border);
}

.oh-badge-icon-holder {
  color: var(--oh-accent);
}

/* Price & CTA Panel */
.oh-price-cta-panel {
  background-color: var(--oh-surface);
  border: 1px solid var(--oh-border);
  border-radius: var(--oh-radius);
  box-shadow: var(--oh-shadow);
}

.oh-price-tag-badge {
  background-color: var(--oh-accent);
  color: #FFFFFF;
  font-family: var(--font-display);
  font-size: 1.85rem;
  border-radius: var(--oh-radius);
  letter-spacing: 0.05em;
  box-shadow: 0 4px 14px var(--oh-accent-glow);
}

/* CTA Action Trigger */
.oh-trigger-action {
  background-color: var(--oh-accent);
  color: #FFFFFF;
  font-family: var(--font-display);
  font-size: 1.15rem;
  border-radius: var(--oh-radius);
  box-shadow: 0 4px 14px var(--oh-accent-glow);
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.oh-trigger-action:hover {
  background-color: var(--oh-accent-hover);
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(230, 57, 70, 0.3);
}

.oh-trigger-action:active {
  transform: translateY(1px);
}

/* Horizontal Row Features Divider Layout */
.oh-section-divider {
  background-color: var(--oh-surface-alt);
  border-top: 1px solid var(--oh-border);
  border-bottom: 1px solid var(--oh-border);
  position: relative;
  z-index: 10;
}

.oh-section-title {
  font-family: var(--font-display);
  text-transform: uppercase;
  font-size: 2rem;
  letter-spacing: 0.05em;
}

.oh-layout-rows {
  display: flex;
  flex-direction: column;
}

.oh-row-feature-item {
  background-color: var(--oh-surface);
  border: 1px solid var(--oh-border);
  border-radius: var(--oh-radius);
  transition: transform 0.3s ease;
}

.oh-row-feature-item:hover {
  transform: scale(1.01);
}

.oh-icon-circle {
  background-color: var(--oh-accent-glow);
  color: var(--oh-accent);
  border-radius: 9999px;
  padding: 1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 0 15px var(--oh-accent-glow);
}

/* Testimonials Block Styles */
.oh-testimonials-block {
  background-color: var(--oh-bg);
  position: relative;
  z-index: 10;
}

.oh-layout-triple {
  display: flex;
  flex-direction: column;
}

@media (min-width: 768px) {
  .oh-layout-triple {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 1024px) {
  .oh-layout-triple {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
}

.oh-opinion-card {
  background-color: var(--oh-surface);
  border-top: 4px solid var(--oh-accent);
  border-left: 1px solid var(--oh-border);
  border-right: 1px solid var(--oh-border);
  border-bottom: 1px solid var(--oh-border);
  border-radius: var(--oh-radius);
  box-shadow: var(--oh-shadow);
  transition: transform 0.3s ease;
}

.oh-opinion-card:hover {
  transform: translateY(-4px);
}

.oh-star-accent {
  color: #FFD166;
  font-size: 1.1rem;
}

.oh-avatar-circle {
  background-color: var(--oh-accent);
  color: #FFFFFF;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 9999px;
  box-shadow: 0 0 10px var(--oh-accent-glow);
}

/* Footer Section */
.oh-footer-bar {
  background-color: var(--oh-surface-alt);
  border-top: 1px solid var(--oh-border);
  color: var(--oh-text-muted);
  z-index: 50;
}

.oh-footer-link {
  color: var(--oh-text-muted);
  transition: color 0.3s ease;
}

.oh-footer-link:hover {
  color: var(--oh-accent);
}