/* TapHelp — 414px view FINAL PASS
   Applies only from 412px through 429px.
   Layered on top of the locked 430px view.
   Only Intro, About body, and FAQ are adjusted here.
*/

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

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

.intro__copy p:first-child,
.intro__copy p:nth-child(2),
.intro__copy p:nth-child(3),
.intro__copy p:nth-child(4) {
  max-width: none;
}

/* Paragraph 1 — reflowed so “the day.” drops to the next line cleanly. */
.intro__copy p:first-child {
  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\A"
    "the day. But when something changes or stops\A"
    "working, a device that makes life easier can\A"
    "suddenly become frustrating.";
  display: block;
  white-space: pre;
  font-size: 18px;
  line-height: 1.55;
}

/* Paragraph 2 — one clean line. */
.intro__copy p:nth-child(2) {
  font-size: 0;
  line-height: 0;
}

.intro__copy p:nth-child(2)::before {
  content: "Sometimes a little personal help is all it takes.";
  display: block;
  white-space: pre;
  font-size: 18px;
  line-height: 1.55;
}

/* Paragraph 3 — use the real copy and 414 width. */
.intro__copy p:nth-child(3) {
  font-size: 18px;
  line-height: 1.55;
  text-wrap: pretty;
}

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

/* Paragraph 4 — remove the “for them.” orphan. */
.intro__copy p:nth-child(4) {
  font-size: 0;
  line-height: 0;
}

.intro__copy p:nth-child(4)::before {
  content:
    "Helping a parent or loved one?\A"
    "You can arrange a TapHelp appointment\A"
    "for them.";
  display: block;
  white-space: pre;
  font-size: 18px;
  line-height: 1.55;
}


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

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

.about-card__body p:first-child,
.about-card__body p:nth-child(2) {
  margin: 0;
  font-size: 0;
  line-height: 0;
}

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

/* Paragraph 2 — no awkward “experience. For more” split. */
.about-card__body p:nth-child(2) {
  margin-top: 24px;
}

.about-card__body p:nth-child(2)::before {
  content:
    "I have 15 years of professional IT help desk\A"
    "and technical support experience.\A"
    "For more than 25 years, I’ve also been\A"
    "the person family and friends turn to when\A"
    "they need help with everyday technology.";
  display: block;
  white-space: pre;
  font-size: 18px;
  line-height: 1.55;
}


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

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

/* Give questions maximum safe width while keeping the +/- clear. */
.faq summary,
.faq details:first-of-type summary,
.faq details:last-of-type summary {
  padding-left: 10px;
  padding-right: 24px;
  white-space: normal;
  text-wrap: pretty;
}

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

/* Consistent answer geometry. */
.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: 0;
  line-height: 0;
}

/* FAQ 1 */
.faq details:nth-of-type(1) .faq__answer::before {
  content:
    "You share your screen so I can see what\A"
    "you’re seeing and guide you step by step.\A"
    "You remain in control of your iPhone or iPad\A"
    "the entire time.";
  display: block;
  white-space: pre;
  font-size: 18px;
  line-height: 1.55;
}

/* FAQ 2 */
.faq details:nth-of-type(2) .faq__answer::before {
  content:
    "You enter your own passwords and verification\A"
    " codes.You should never give anyone your\A"
    "passwords or security codes.";
  display: block;
  white-space: pre;
  font-size: 18px;
  line-height: 1.55;
}

/* FAQ 3 */
.faq details:nth-of-type(3) .faq__answer::before {
  content:
    "I can help with everyday iPhone and iPad\A"
    "issues such as Wi-Fi, texts, photos, email,\A"
    "settings, suspicious messages or scams,\A"
    "and other common questions.";
  display: block;
  white-space: pre;
  font-size: 18px;
  line-height: 1.55;
}

/* FAQ 4 */
.faq details:nth-of-type(4) .faq__answer::before {
  content:
    "If the problem requires something beyond\A"
    "what I can safely handle remotely,\A"
    "I’ll explain what the next step should be\A"
    "and help point you in the right direction.";
  display: block;
  white-space: pre;
  font-size: 18px;
  line-height: 1.55;
}