/* ==================================================
   Tinnitus Pattern Watch
   ================================================== */

.tpw-page {
  max-width: 1100px;
  margin: 0 auto;
  padding: 24px 16px 56px;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: #1f2a2a !important;
  line-height: 1.6;
}

.tpw-page h1,
.tpw-page h2,
.tpw-page h3,
.tpw-page p,
.tpw-page li {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

.tpw-hero {
  background: linear-gradient(135deg, #eef5f3 0%, #f9fbfa 100%);
  border: 1px solid #d9e3e1;
  border-radius: 24px;
  padding: 32px 24px;
  margin-bottom: 24px;
  box-shadow: 0 10px 28px rgba(31, 42, 42, 0.08);
}

.tpw-hero h1,
.tpw-hero h2,
.tpw-hero h3 {
  color: #183131 !important;
  margin-top: 0;
}

.tpw-hero p {
  color: #586767 !important;
  max-width: 820px;
}

.tpw-kicker {
  display: inline-block;
  font-size: 0.9rem;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #245752 !important;
  background: #eaf3f1;
  border: 1px solid #d4e5e1;
  padding: 6px 10px;
  border-radius: 999px;
  margin-bottom: 14px;
}

.tpw-intro,
.tpw-share {
  background: #ffffff;
  border: 1px solid #d9e3e1;
  border-radius: 18px;
  padding: 22px;
  box-shadow: 0 10px 28px rgba(31, 42, 42, 0.08);
  margin-bottom: 24px;
}

.tpw-intro h1,
.tpw-intro h2,
.tpw-intro h3,
.tpw-share h1,
.tpw-share h2,
.tpw-share h3 {
  color: #183131 !important;
  margin-top: 0;
}

.tpw-intro p,
.tpw-share p,
.tpw-share li {
  color: #334545 !important;
}

.tpw-note {
  background: #f7f4ea;
  border-left: 4px solid #c6ab57;
  padding: 14px 16px;
  border-radius: 12px;
  color: #4e4735 !important;
  margin-top: 16px;
}

.tpw-note,
.tpw-note p,
.tpw-note strong {
  color: #4e4735 !important;
}

.tpw-grid {
  margin-bottom: 28px;
}

.tpw-grid-header {
  margin-bottom: 22px;
}

.tpw-grid-header h1,
.tpw-grid-header h2,
.tpw-grid-header h3 {
  color: #ffffff !important;
}

.tpw-grid-header p {
  color: #dcebea !important;
}

.tpw-card {
  background: #ffffff;
  border: 1px solid #d9e3e1;
  border-radius: 18px;
  padding: 22px;
  box-shadow: 0 10px 28px rgba(31, 42, 42, 0.08);
  margin-bottom: 24px;
}

.tpw-card h1,
.tpw-card h2,
.tpw-card h3 {
  color: #102b2b !important;
  margin-top: 0;
}

.tpw-card p,
.tpw-card li {
  color: #334545 !important;
}

.tpw-pill {
  display: inline-block;
  font-size: 0.88rem;
  color: #245752 !important;
  background: #eaf3f1;
  border: 1px solid #d4e5e1;
  border-radius: 999px;
  padding: 5px 10px;
  margin-right: 8px;
  margin-bottom: 8px;
}

.tpw-goal {
  background: #f8fbfa;
  border: 1px solid #e2ece9;
  border-radius: 12px;
  padding: 12px 14px;
  color: #263838 !important;
  margin: 14px 0 16px;
}

.tpw-goal,
.tpw-goal p,
.tpw-goal strong {
  color: #263838 !important;
}

.tpw-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 14px 0;
}

.tpw-button,
.tpw-link-button {
  display: inline-block;
  text-decoration: none;
  border-radius: 999px;
  padding: 12px 16px;
  font-weight: 700;
  font-size: 0.98rem;
  text-align: center;
}

.tpw-button {
  background: #2f6f6a;
  color: #ffffff !important;
  border: 2px solid #2f6f6a;
}

.tpw-link-button {
  background: #ffffff;
  color: #245752 !important;
  border: 2px solid #bfd4d0;
}

.tpw-button:hover,
.tpw-link-button:hover {
  opacity: 0.9;
}

.tpw-form-embed {
  margin-top: 16px;
  border: 1px dashed #bdd0cc;
  border-radius: 12px;
  padding: 12px;
  background: #fbfcfc;
}

.tpw-form-embed iframe {
  width: 100%;
  max-width: 100%;
  border: 0;
}

.tpw-card-full {
  width: 100%;
}

.tpw-small {
  font-size: 0.95rem;
  color: #586767 !important;
}