/* Local static enhancements for the mirrored Pentagon Solar page. */
:root {
  --background: 0 0% 100%;
  --foreground: 216 86% 18%;
  --card: 0 0% 100%;
  --card-foreground: 216 86% 18%;
  --primary: 214 88% 25%;
  --primary-foreground: 0 0% 100%;
  --secondary: 214 38% 95%;
  --secondary-foreground: 216 86% 18%;
  --muted: 214 32% 96%;
  --muted-foreground: 216 16% 37%;
  --accent: 42 74% 50%;
  --accent-foreground: 216 86% 18%;
  --border: 214 28% 88%;
  --ring: 42 74% 50%;
}
body {
  background: #f8fafc;
  color: #0b356c;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  color: #082f63;
}
.text-foreground,
.text-card-foreground {
  color: #082f63 !important;
}
.text-muted-foreground,
.text-gray-600 {
  color: #4a5568 !important;
}
.text-accent,
.hover\:text-accent:hover {
  color: #c8901c !important;
}
.bg-primary {
  background-color: #083a78 !important;
}
.text-primary {
  color: #083a78 !important;
}
.text-primary-foreground {
  color: #ffffff !important;
}
.bg-accent {
  background-color: #d7a72f !important;
}
.hover\:bg-accent\/90:hover {
  background-color: #c8901c !important;
}
.bg-accent\/10,
.hover\:bg-accent\/10:hover,
.bg-accent\/5 {
  background-color: rgba(215, 167, 47, 0.12) !important;
}
.border-accent,
.hover\:border-accent:hover {
  border-color: #d7a72f !important;
}
.border-accent\/20 {
  border-color: rgba(215, 167, 47, 0.28) !important;
}
.hover\:border-accent\/50:hover {
  border-color: rgba(215, 167, 47, 0.58) !important;
}
.bg-card,
[data-slot="card"] {
  border-color: rgba(8, 58, 120, 0.12);
}
.shadow-sm,
.hover\:shadow-md:hover,
.hover\:shadow-lg:hover {
  box-shadow: 0 12px 28px rgba(8, 47, 99, 0.08) !important;
}
nav.lg\:flex,
nav.lg\:hidden {
  background: linear-gradient(180deg, #ffffff 0%, #f7fbff 100%) !important;
  border-color: rgba(8, 58, 120, 0.14) !important;
}
nav a:hover,
nav button:hover,
.mobile-menu-panel a:hover {
  color: #c8901c !important;
}
.from-muted\/30 {
  --tw-gradient-from: rgba(232, 239, 248, 0.7) var(--tw-gradient-from-position) !important;
}
.to-background {
  --tw-gradient-to: #ffffff var(--tw-gradient-to-position) !important;
}
.mobile-menu-panel {
  display: none;
  border-top: 1px solid hsl(var(--border, 214.3 31.8% 91.4%));
  background: #fff;
  padding: 1rem 1.5rem 1.25rem;
  box-shadow: 0 18px 35px rgba(15, 23, 42, 0.12);
}
.mobile-menu-panel.is-open {
  display: block;
}
.mobile-menu-panel a {
  display: block;
  padding: 0.75rem 0;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
  color: hsl(var(--foreground, 222.2 84% 4.9%));
  font-weight: 500;
}
.mobile-menu-panel .mobile-sub a {
  padding-left: 1.25rem;
  color: hsl(var(--muted-foreground, 215.4 16.3% 46.9%));
  font-size: 0.95rem;
}
[data-slot="accordion-content"][hidden] {
  display: none !important;
}
[data-slot="accordion-trigger"] svg {
  transition: transform 0.2s ease;
}
[data-slot="accordion-trigger"][aria-expanded="true"] svg {
  transform: rotate(180deg);
}
.local-form-note {
  margin-top: 1rem;
  border-radius: 0.75rem;
  border: 1px solid rgba(215, 167, 47, 0.32);
  background: rgba(8, 58, 120, 0.08);
  color: #083a78;
  padding: 0.85rem 1rem;
  font-size: 0.95rem;
}
video {
  background: #000;
}

/* Preserve readable body copy while keeping controls and navigation tidy. */
body p,
body li,
body [data-slot="card-description"],
body .local-justified {
  text-align: left !important;
  text-align-last: left;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  overflow-wrap: break-word;
  word-break: normal;
}
nav,
nav *,
button:not(.quiz-option),
summary,
h1,
h2,
h3,
h4,
h5,
h6,
[data-slot="card-header"],
.mobile-menu-panel a {
  text-align: initial !important;
}
.text-center h1,
.text-center h2,
.text-center h3,
.text-center [data-slot="card-title"],
.text-center [data-slot="card-description"] {
  text-align: center !important;
}
.quiz-option { text-align: left !important; }
.quiz-option.border-green-500 { border-color: #22c55e; }
.quiz-option.border-red-500 { border-color: #ef4444; }
.quiz-option.bg-green-50 { background: #f0fdf4; }
.quiz-option.bg-red-50 { background: #fef2f2; }
.local-form-note { grid-column: 1 / -1; }

/* More even justified copy and crisper small media. */
html { -webkit-locale: "de"; }
body p,
body li,
body [data-slot="card-description"],
body .local-justified {
  hyphenate-limit-chars: 6 3 3;
  hyphenate-limit-lines: 2;
  line-break: auto;
  text-wrap: pretty;
  word-spacing: normal;
}
.group p,
[data-slot="card"] p,
[data-slot="card-description"],
.text-sm.leading-relaxed {
  text-align: left !important;
  -webkit-hyphens: auto;
  -ms-hyphens: auto;
  hyphens: auto;
  overflow-wrap: break-word;
}
.product-fact {
  align-items: flex-start !important;
  line-height: 1.35;
}
.product-fact-value {
  text-align: left !important;
  text-align-last: left;
  -webkit-hyphens: none;
  -ms-hyphens: none;
  hyphens: none;
  overflow-wrap: normal;
  word-break: normal;
  white-space: normal;
}
.product-fact-value,
.product-fact-value * {
  word-spacing: normal !important;
}
@media (min-width: 1024px) {
  #company-intro p,
  main > main p,
  .mx-auto.max-w-3xl > p,
  .mx-auto.max-w-4xl p {
    text-align: justify !important;
    word-spacing: -0.01em;
  }
}
.group .relative.mb-4.h-24.w-24,
.group .relative.mb-4.h-24.w-24 img {
  width: 7.5rem !important;
  height: 7.5rem !important;
}
.group .relative.mb-4.h-24.w-24 img,
[data-nimg="fill"] {
  image-rendering: auto;
  transform: translateZ(0);
  backface-visibility: hidden;
}

img[src="/images/design-mode/pentagon-solar-logo.png"] {
  width: auto !important;
  max-width: 100% !important;
  height: auto !important;
  max-height: 6.25rem !important;
  object-fit: contain;
}
nav.lg\:flex img[src="/images/design-mode/pentagon-solar-logo.png"] {
  max-width: calc(var(--sidebar-w) - 1rem) !important;
  max-height: calc(var(--sidebar-w) - 1rem) !important;
  padding: 0.125rem;
}
nav.lg\:hidden img[src="/images/design-mode/pentagon-solar-logo.png"] {
  max-width: min(72vw, 25rem) !important;
  max-height: 5.75rem !important;
}

/* Stable product quality backgrounds for dynamically switched cards. */
.product-quality-low {
  background: linear-gradient(135deg, rgba(239, 68, 68, 0.2), rgba(249, 115, 22, 0.2)) !important;
  border-color: rgba(239, 68, 68, 0.3) !important;
}
.product-quality-medium {
  background: linear-gradient(135deg, rgba(250, 204, 21, 0.2), rgba(245, 158, 11, 0.2)) !important;
  border-color: rgba(250, 204, 21, 0.3) !important;
}
.product-quality-high {
  background: linear-gradient(135deg, rgba(16, 185, 129, 0.2), rgba(34, 197, 94, 0.2)) !important;
  border-color: rgba(16, 185, 129, 0.32) !important;
}