/* TapHelp — 430px view
   Inherits the locked 375px mobile architecture.
   Uses the extra 430px width to eliminate forced narrow-screen breaks,
   short ragged lines, and one-word leftovers.
*/

/* =========================================================
   INTRO
   ========================================================= */

.intro__copy {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  transform: translateX(10px);
}

.intro__copy p:nth-child(2),
.intro__copy p:nth-child(3),
.intro__copy p:nth-child(4) {
  max-width: none;
  font-size: 18px;
  line-height: 1.55;
  text-wrap: pretty;
}

.intro__copy p:nth-child(2)::before,
.intro__copy p:nth-child(3)::before,
.intro__copy p:nth-child(4)::before {
  content: none;
  display: none;
}

/* 430-specific first-paragraph composition — follows the marked breaks. */
.intro__copy p:first-child {
  max-width: none;
  font-size: 0;
  line-height: 0;
}

.intro__copy p:first-child::before {
  content:
    "They keep us connected, hold our photos,\A"
    "play our music and help us get through the day.\A"
    "But when something changes or stops working,\A"
    "a device that makes life easier can suddenly\A"
    "become frustrating.";
  display: block;
  white-space: pre;
  font-size: 18px;
  line-height: 1.55;
}

/* Keep the intentional break after “Helping a parent or loved one?” */
.intro__copy p:nth-child(4) br {
  display: inline;
}


/* =========================================================
   STEPS
   ========================================================= */

.steps-grid {
  width: calc(100% - 32px);
  margin-left: auto;
  margin-right: auto;
}

.step-card {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}


/* =========================================================
   ABOUT
   ========================================================= */

.about-card__body {
  width: calc(100% - 20px);
  max-width: none;
  margin-left: auto;
  margin-right: auto;
  transform: translateX(10px);
  text-align: left;
}

.about-card__body p:nth-child(2),
.about-card__body p + p {
  font-size: 18px;
  line-height: 1.55;
  text-wrap: pretty;
}

/* 430-specific first About paragraph */
.about-card__body p:first-child {
  font-size: 0;
  line-height: 0;
}

.about-card__body p:first-child::before {
  content:
    "I provide patient, one-on-one help with\A"
"everyday iPhone and iPad problems.\A"
    
    "We work by phone or screen share, at\A"
"your pace, without jargon or judgment.";
    display: block;
  white-space: pre;
  font-size: 18px;
  line-height: 1.55;
}

.about-card__body p:nth-child(2)::before {
  content: none;
  display: none;
}

.about-card__body br {
  display: none;
}


/* =========================================================
   PRICING
   ========================================================= */

.price-card {
  width: calc(100% - 32px);
  margin-left: auto;
  margin-right: auto;
}

.price-card__price {
  text-align: center;
  white-space: nowrap;
}


/* =========================================================
   FAQ
   ========================================================= */

.faq__inner {
  margin-left: 4px;
  margin-right: 4px;
}

/* Use more of the available width for question text.
   Keep the minus control clear at the far right. */
.faq summary,
.faq details:first-of-type summary,
.faq details:last-of-type summary {
  padding-left: 10px;
  padding-right: 26px;
  white-space: normal;
  text-wrap: pretty;
}

.faq summary::after {
  right: 9px;
}

/* Restore real answer text and let each answer fill the available line. */
.faq__answer,
.faq details:nth-of-type(1) .faq__answer,
.faq details:nth-of-type(2) .faq__answer,
.faq details:nth-of-type(3) .faq__answer,
.faq details:nth-of-type(4) .faq__answer {
  padding-left: 12px;
  padding-right: 12px;
  font-size: 18px;
  line-height: 1.55;
  overflow-wrap: normal;
  word-break: normal;
  text-wrap: pretty;
}

.faq details:nth-of-type(1) .faq__answer::before,
.faq details:nth-of-type(2) .faq__answer::before,
.faq details:nth-of-type(3) .faq__answer::before,
.faq details:nth-of-type(4) .faq__answer::before {
  content: none;
  display: none;
}

/* Critical 430 fix:
   remove the desktop/source hard breaks so the text can flow into
   the unused space marked in red. */
.faq__answer br {
  display: none;
}