/* Prof1 + Prof2 + Prof3 (2026-10-20, Owner corrections): the TOP profile on mobile = the approved PC block (front-page.php, .hal-theme-profile-pc).
   The adopted mobile profile (white cards, grey photo frames, inc/adopted/profile-mobile.php) is no longer printed.
   PC (768px and wider) is unchanged: the Araki block is not displayed there and nothing else in this file applies.
   Mobile (767.98px and below) takes the PC values for trimming (whole image, original ratio), the edge fade, the band, the type and the
   spacing formulas; only the sizes and line breaks follow the screen width. The block's earlier mobile rules in hal-authority-hub.css
   (top crop 50% 100%, fade 8/76/78, label 13px, title 16px, catch second-line indent) were never shown with the adopted mobile profile and are
   overridden here, inside [data-hal-profile-unified] only. */
.hal-lp [data-hal-profile-unified] .promise-profile-block--araki { display: none; }

@media (max-width: 767.98px) {
  /* integration.css hides .hal-theme-profile-pc at 767px and below; this block is now the mobile profile too. */
  .hal-lp .hal-theme-profile-pc[data-hal-profile-unified] { display: block; }

  /* band: the PC formula (52px at these widths). Prof2 (2026-10-20, Owner): the text moves up — photo → text 20px (Prof1: the PC gap 40px) and
     the heading H3, which is the band colour and not visible on PC either, takes no space on mobile (kept for screen readers). */
  .hal-lp [data-hal-profile-unified] .hal-promise-profile-wrap { padding: clamp(52px, 5vw, 72px) var(--hal-pad); }
  .hal-lp [data-hal-profile-unified] .promise-profile-block {
    grid-template-columns: minmax(0, 1fr);   /* photo above the text */
    gap: 16px;   /* Prof3: 20 → 16px (the photo now ends just below the hand / the hair ends) */
    margin: 0 auto;
    padding: 0;
  }
  .hal-lp [data-hal-profile-unified] .promise-profile-block--araki { display: grid; margin-top: clamp(52px, 5vw, 72px); }

  /* Prof2 photo frames (Owner, 2026-10-20): the tall PC image is not carried over as it is. The people keep the size they had in Prof1
     (Morita: frame width / 720 of the source; Araki: frame width / 240 of the source, as in Prof1) — only the frames and the trimming change.
     --hal-pf-w is Morita's frame width (the width the photo had on mobile before: min(72vw, 270px)). The two frames are not the same height. */
  .hal-lp [data-hal-profile-unified] { --hal-pf-w: min(72vw, 270px); }
  .hal-lp [data-hal-profile-unified] .profile-image-wrapper {
    position: relative;
    width: var(--hal-pf-w);
    max-width: var(--hal-pf-w);
    height: auto;
    margin-inline: auto;
    padding: 0;
    overflow: hidden;
  }
  .hal-lp [data-hal-profile-unified] .profile-image-wrapper img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
    max-width: none;
    object-fit: fill;
    object-position: 50% 50%;
    transform: none;
  }
  /* Morita (Prof3): source rows 205–1450 of 1559. The dark background above the hair (the hair starts at about row 225) and, below the hand
     (the wrist ends at about row 1430), the cuff and the sweater are not shown; the face, the hair and the hand stay inside. Same person size. */
  .hal-lp [data-hal-profile-unified] .profile-image-wrapper:not(.profile-image-wrapper--araki) { aspect-ratio: 720 / 1245; }
  .hal-lp [data-hal-profile-unified] .profile-image-wrapper:not(.profile-image-wrapper--araki) img { transform: translateY(-13.1495%); }   /* 205 / 1559 */
  /* Araki (Prof3): from the top of the head (row 0: the head reaches the top of the source) to just below the ends of the hair — the lowest
     ends are at about rows 390–395 and the frame itself ends at row 400 (Prof2: 440), so no height is kept for the clothes, body or arms below
     the hair. Source columns 172.7–439.3: the hair on the left is inside and the face (columns 225–370) stays clear of the right fade (74%).
     Frame 300 / 270 of Morita's width, 2 : 3 (300 × 450 at 375–430px); the face is the Prof1/Prof2 size. */
  .hal-lp [data-hal-profile-unified] .profile-image-wrapper--araki {
    width: calc(var(--hal-pf-w) * 300 / 270);
    max-width: calc(var(--hal-pf-w) * 300 / 270);
    aspect-ratio: 2 / 3;
  }
  .hal-lp [data-hal-profile-unified] .profile-image-wrapper--araki img { left: -64.75%; width: 240%; }   /* 172.67 / 266.67 and 640 / 266.67 */
  /* edge fade: left 0–10% and right 74–100% (PC, kept). Prof3: the top and bottom fades are short because the frames now end at the hair / hand —
     Morita top 0–3% and bottom 94–100% (from about row 1375 of the wrist to the cuff), Araki top 0–4% and bottom 92–100% (rows 368–400:
     the hair ends fade into the band right where the frame ends). */
  .hal-lp [data-hal-profile-unified] .profile-image-wrapper::after {
    background:
      linear-gradient(90deg, var(--hal-ink) 0%, transparent 10%, transparent 74%, var(--hal-ink) 100%),
      linear-gradient(180deg, var(--hal-ink) 0%, transparent 3%, transparent 94%, var(--hal-ink) 100%);
  }
  .hal-lp [data-hal-profile-unified] .profile-image-wrapper--araki::after {
    background:
      linear-gradient(90deg, var(--hal-ink) 0%, transparent 10%, transparent 74%, var(--hal-ink) 100%),
      linear-gradient(180deg, var(--hal-ink) 0%, transparent 4%, transparent 92%, var(--hal-ink) 100%);
  }

  /* type: the PC values. The catch is 18px (its own clamp) where the PC two-line setting fits; on narrower screens it scales down just enough to keep
     Morita's first line 「妥協のない調査眼と戦略的分析力」で、 (19 characters + the inherited letter spacing, 0.51px at these widths) on one line: 390px and wider 18px, 375px 17.2px.
     Araki's catch uses the same size (her lines are shorter). Araki's label breaks only between its two parts. */
  .hal-lp [data-hal-profile-unified] .profile-catch { font-size: min(18px, calc((100vw - 48px) / 19)); }
  .hal-lp [data-hal-profile-unified] .profile-label__seg { display: inline-block; }
  .hal-lp [data-hal-profile-unified] .profile-h3 { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
  .hal-lp [data-hal-profile-unified] .profile-label { font-size: 14px; }
  .hal-lp [data-hal-profile-unified] .history-title { font-size: 18px; }
  .hal-lp [data-hal-profile-unified] .profile-catch .profile-catch__l2 { display: inline; padding-left: 0; }

  /* Araki's two facts (経歴 / ご相談, approved text) where Morita has his English heading: the name in the gold label type (.profile-label), the value in
     the profile paragraph type (.history-desc); a 14px gap below like the heading's 8px + the paragraphs' rhythm. */
  .hal-lp [data-hal-profile-unified] .profile-facts { display: grid; gap: 10px; margin: 0 0 14px; padding: 0; }
  .hal-lp [data-hal-profile-unified] .profile-facts > div { margin: 0; padding: 0; }
  .hal-lp [data-hal-profile-unified] .profile-facts dt { margin: 0 0 2px; color: #c5a059; font-family: var(--hal-sans); font-size: 14px; font-weight: 600; line-height: 1.6; letter-spacing: .2em; }
  .hal-lp [data-hal-profile-unified] .profile-facts dd { margin: 0; color: rgba(255, 255, 255, .75); font-family: var(--hal-sans); font-size: 13px; line-height: 1.85; }   /* letter spacing inherited, as the paragraphs */
}

/* Fix13 (2026-10-21, Owner-approved): the Araki profile on mobile — the affiliation / name and the catch below it are one text block (.profile-intro)
   placed in the middle of the screen, its lines left-aligned (each line starts at the same left edge; no line is centred on its own): the block is
   310px wide on a 390px screen (40px on each side), never wider than the screen less 80px (375px: 295px), centred at every width. The text below
   (introduction, history), the photo and its crop are unchanged; Morita is unchanged (the rule is inside the Araki block only). */
@media (max-width: 767.98px) {
  .hal-lp [data-hal-profile-unified] .promise-profile-block--araki .profile-intro { width: min(310px, calc(100vw - 80px)); margin-left: auto; margin-right: auto; text-align: left; }
}