/* WinPin site-specific styles */

/* Pin icon next to brand text */
.navbar-brand::before,
.navbar-mobile-brand::before {
  content: "";
  display: inline-block;
  width: 1.25em;
  height: 1.25em;
  margin-right: 0.35em;
  vertical-align: -0.15em;
  background: currentColor;
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='60 0 420 460'%3E%3Cpath d='M 146.787 271.547 L 106.826 209.569 L 212.097 176.099 L 247.562 150.506 L 283.506 124.567 L 316.571 163.93 L 364.65 189.864 L 343.849 226.392 L 323.37 262.354 L 307.767 360.63 L 236.582 338.006 L 157.799 386.946 L 77.489 436.838 L 146.787 271.547 Z M 163.414 270.303 L 107.513 401.638 L 149.245 375.29 L 231.509 322.038 L 295.724 344.828 L 311.23 258.965 L 330.074 222.432 L 348.613 192.005 L 309.702 173.362 L 287.842 141.428 L 257.814 162.065 L 220.227 189.297 L 128.673 218.427 L 163.414 270.303 Z'/%3E%3Ccircle fill='none' stroke='black' stroke-width='12.65' transform='matrix(0.63383,-0.773473,0.816077,0.668742,37.02906,311.14563)' cx='354.724' cy='116.366' r='68.931'/%3E%3Cpolyline fill='none' stroke='black' stroke-width='13' points='153.502 266.866 186.665 312.353 232.325 329.084'/%3E%3Cpolyline fill='none' stroke='black' stroke-width='13' points='318.093 255.701 253.05 235.87 218.508 181.819'/%3E%3C/svg%3E");
  mask-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='60 0 420 460'%3E%3Cpath d='M 146.787 271.547 L 106.826 209.569 L 212.097 176.099 L 247.562 150.506 L 283.506 124.567 L 316.571 163.93 L 364.65 189.864 L 343.849 226.392 L 323.37 262.354 L 307.767 360.63 L 236.582 338.006 L 157.799 386.946 L 77.489 436.838 L 146.787 271.547 Z M 163.414 270.303 L 107.513 401.638 L 149.245 375.29 L 231.509 322.038 L 295.724 344.828 L 311.23 258.965 L 330.074 222.432 L 348.613 192.005 L 309.702 173.362 L 287.842 141.428 L 257.814 162.065 L 220.227 189.297 L 128.673 218.427 L 163.414 270.303 Z'/%3E%3Ccircle fill='none' stroke='black' stroke-width='12.65' transform='matrix(0.63383,-0.773473,0.816077,0.668742,37.02906,311.14563)' cx='354.724' cy='116.366' r='68.931'/%3E%3Cpolyline fill='none' stroke='black' stroke-width='13' points='153.502 266.866 186.665 312.353 232.325 329.084'/%3E%3Cpolyline fill='none' stroke='black' stroke-width='13' points='318.093 255.701 253.05 235.87 218.508 181.819'/%3E%3C/svg%3E");
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

/* Feature detail section */
.feature-detail {
  max-width: 42rem;
}

/* Problem/Solution layout */
.problem-solution {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}

.problem-solution-block p {
  color: var(--color-muted-foreground);
  line-height: var(--font-leading-relaxed);
  margin-bottom: 1rem;
}

.problem-solution-block p:last-child {
  margin-bottom: 0;
}

/* Tech specs */
.tech-specs {
  max-width: 42rem;
  margin: 0 auto;
}

.tech-specs ul {
  list-style: none;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
}

.tech-specs li {
  color: var(--color-muted-foreground);
  padding-left: 1.5rem;
  position: relative;
}

.tech-specs li::before {
  content: "\2022";
  position: absolute;
  left: 0;
  color: var(--color-primary);
}

/* Primary section text override — ensure readability on colored background */
.section-primary .section-heading,
.section-primary .section-subheading {
  color: var(--color-primary-foreground);
}