/* Patient Journey — "Find Your Place" phone presentation (<768px).
   Source: AriseVida-Patient-Journey-Find-Your-Place-Mobile handoff,
   adapted to the site (Fraunces / Inter tokens, host padding, resource
   disclosure). The existing section supplies the 768px+ presentation;
   the legacy inner wrapper is hidden only once the controller has
   enhanced this block. Every selector is scoped to .avc-fyp or the
   marked host, so nothing here can reach another section or width. */
.avc-fyp { display: none; }
@media (max-width: 767.98px) {
  /* Legacy inner block: defeat any display declaration that would
     override the browser's [hidden] rule once the phone block is live. */
  [data-fyp-mount] > [data-fyp-legacy][hidden] { display: none !important; }
  /* Host section while the phone block is active: the component owns its
     own gutters and surface, so the outer padding would otherwise double. */
  .pj-find[data-fyp-active] {
    padding: 0 !important;
    background: #fefdf9;
  }
  .pj-find[data-fyp-active]::before,
  .pj-find[data-fyp-active]::after { display: none; }

  .avc-fyp {
    --fyp-cream: #fcf8f3;
    --fyp-ink: var(--ink-900, #0a1f25);
    --fyp-copy: #475569;
    --fyp-teal: var(--teal-700, #0f766e);
    --fyp-green: #4f6f37;
    --fyp-terra: #b04a2a;
    /* Site fonts: the references were rendered in the site's display serif
       (Fraunces) and text sans (Inter); the handoff's Times/Arial values
       were explicit fallbacks only. */
    --fyp-serif: var(--font-display, 'Fraunces', Georgia, serif);
    --fyp-sans: var(--font-sans, 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
    display: block;
    box-sizing: border-box;
    inline-size: 100%;
    max-inline-size: 44rem;
    margin-inline: auto;
    padding: 36px clamp(18px, 6.15vw, 28px) 34px;
    background: var(--fyp-cream);
    color: var(--fyp-copy);
    font-family: var(--fyp-sans);
    font-size: clamp(13.5px, 3.6vw, 14.5px);
    line-height: 1.4;
    text-align: start;
    isolation: isolate;
  }
  .avc-fyp[hidden], .avc-fyp [hidden] { display: none !important; }
  .avc-fyp *, .avc-fyp *::before, .avc-fyp *::after { box-sizing: border-box; }
  .avc-fyp p, .avc-fyp h2, .avc-fyp h3 { margin: 0; }
  /* Section header typography/decoration comes from the site's shared mobile heading system ([data-av-mobile-section-heading] in styles.css), the same rules the Methadone page uses; only the wrapper spacing lives here. */
  .avc-fyp .avc-fyp__intro { margin-block-end: 24px; }
  .avc-fyp .avc-fyp__lede { text-wrap: balance; }
  .avc-fyp .avc-fyp__tabs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin-block: 0 14px; }
  .avc-fyp .avc-fyp__tab {
    position: relative; appearance: none; margin: 0; min-inline-size: 0; min-block-size: 58px;
    padding: 10px 6px 12px; border: 1px solid var(--tab-border); border-radius: 0;
    background: var(--tab-pale); color: var(--tab-ink); cursor: pointer;
    font: 500 clamp(13px, 3.46vw, 14.5px)/1.25 var(--fyp-sans);
    text-align: center; overflow-wrap: anywhere; -webkit-tap-highlight-color: transparent;
    transition: background-color 180ms ease, color 180ms ease;
  }
  .avc-fyp [data-fyp-tab="considering"] { --tab-border: #2f8f86; --tab-pale: #eaf6f4; --tab-ink: #0f766e; --tab-active: #0f766e; }
  .avc-fyp [data-fyp-tab="preparing"] { --tab-border: #829775; --tab-pale: #f0f5e9; --tab-ink: #4f6f37; --tab-active: #4f6f37; border-inline-start-width: 0; }
  .avc-fyp [data-fyp-tab="in-care"] { --tab-border: #da6d4a; --tab-pale: #fff0e9; --tab-ink: #b04a2a; --tab-active: #b04a2a; border-inline-start-width: 0; }
  .avc-fyp .avc-fyp__tab:first-child { border-start-start-radius: 13px; border-end-start-radius: 13px; }
  .avc-fyp .avc-fyp__tab:last-child { border-start-end-radius: 13px; border-end-end-radius: 13px; }
  .avc-fyp .avc-fyp__tab[aria-selected="true"] { color: #fff; background: var(--tab-active); }
  .avc-fyp .avc-fyp__tab[aria-selected="true"]::after { content: ""; position: absolute; inset-inline: 13%; inset-block-end: 4px; block-size: 1px; border-radius: 2px; background: #fff; }
  .avc-fyp .avc-fyp__panels { display: grid; gap: 14px; }
  .avc-fyp .avc-fyp__panel {
    --accent: var(--fyp-teal); --panel-bg: #eaf6f4; --panel-border: #a9d9d2; --divider: #b9dfd9;
    display: flex; flex-direction: column; min-inline-size: 0; min-block-size: 305px;
    padding: 18px 19px 13px; border: 1px solid var(--panel-border); border-radius: 16px;
    background: linear-gradient(115deg, #ffffff24, #ffffff00 50%, #ffffff1a), var(--panel-bg);
    color: var(--fyp-copy); scroll-margin-block-start: 90px;
  }
  .avc-fyp [data-fyp-panel="preparing"] { --accent: var(--fyp-green); --panel-bg: #f3f7ed; --panel-border: #c5d8bd; --divider: #b1c6a7; }
  .avc-fyp [data-fyp-panel="in-care"] { --accent: var(--fyp-terra); --panel-bg: #fff2eb; --panel-border: #ffbda9; --divider: #f4b8a6; }
  .avc-fyp .avc-fyp__panel-head { display: grid; grid-template-columns: 44px minmax(0, 1fr); align-items: center; gap: 14px; margin-block-end: 13px; }
  .avc-fyp .avc-fyp__panel-head > * { min-inline-size: 0; }
  .avc-fyp .avc-fyp__icon {
    position: relative; inline-size: 44px; aspect-ratio: 1; overflow: hidden; border-radius: 12px;
    /* Original PNGs remain unchanged. Crop only their outer white padding. */
    --crop-width: 147.5294%; --crop-left: -23.7647%; --crop-top: -23.6471%;
  }
  .avc-fyp .avc-fyp__icon--people { --crop-width: 141.2162%; --crop-left: -20.7207%; --crop-top: -20.7207%; }
  .avc-fyp .avc-fyp__icon img { position: absolute; display: block; inline-size: var(--crop-width); max-inline-size: none; block-size: auto; inset-inline-start: var(--crop-left); inset-block-start: var(--crop-top); }
  .avc-fyp .avc-fyp__kicker { margin-block-end: 4px; color: var(--accent); font: 700 11.5px/1.3 var(--fyp-sans); letter-spacing: .13em; text-transform: uppercase; }
  .avc-fyp .avc-fyp__title { color: #090b08; font: 600 clamp(22px, 6.67vw, 28px)/1.1 var(--fyp-serif); letter-spacing: -0.01em; overflow-wrap: anywhere; text-wrap: balance; }
  .avc-fyp .avc-fyp__description, .avc-fyp .avc-fyp__guidance { font-size: inherit; line-height: 1.5; }
  .avc-fyp .avc-fyp__guidance { padding-block-start: 14px; margin-block-start: 14px; margin-block-end: 13px; border-block-start: 1px solid var(--divider); }
  .avc-fyp .avc-fyp__cta {
    display: flex; align-items: center; justify-content: center; gap: 13px; margin-block-start: auto;
    inline-size: 100%; appearance: none; border: 0; cursor: pointer;
    min-block-size: 44px; padding: 10px 12px; border-radius: 999px; background: var(--accent); color: #fff;
    font: 600 clamp(14.5px, 3.9vw, 18px)/1.3 var(--fyp-sans); text-decoration: none;
    text-align: center; -webkit-tap-highlight-color: transparent;
  }
  .avc-fyp .avc-fyp__cta img { display: block; inline-size: 19px; block-size: 19px; flex: none; transition: transform 180ms ease; }
  .avc-fyp .avc-fyp__cta[aria-expanded="true"] img { transform: rotate(90deg); }
  /* Existing "Explore this path" action: the path's real resource links,
     revealed inside the panel (the desktop section opens the same links
     in its shared tray). Collapsed by default, so the resting state
     matches the reference renderings. */
  .avc-fyp .avc-fyp__resources { overflow: hidden; }
  .avc-fyp .avc-fyp__resources-inner { padding-block-start: 14px; }
  .avc-fyp .avc-fyp__resources-copy { margin-block-end: 10px; font-size: clamp(13.5px, 3.6vw, 14.5px); line-height: 1.5; color: var(--fyp-copy); }
  .avc-fyp .avc-fyp__resources nav { display: grid; gap: 8px; }
  .avc-fyp .avc-fyp__resources a {
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
    min-block-size: 46px; padding: 10px 14px; border: 1px solid var(--panel-border); border-radius: 12px;
    background: #ffffffb8; color: var(--accent); font: 600 clamp(14px, 3.8vw, 16px)/1.3 var(--fyp-sans);
    text-decoration: none; -webkit-tap-highlight-color: transparent;
  }
  .avc-fyp .avc-fyp__resources a svg { inline-size: 18px; block-size: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 2.2; stroke-linecap: round; stroke-linejoin: round; }
  .avc-fyp .avc-fyp__reassurance { display: grid; grid-template-columns: 37px minmax(0, 1fr); gap: 11px; align-items: center; margin: 11px 3px 0; }
  .avc-fyp .avc-fyp__reassurance img { inline-size: 37px; block-size: 37px; display: block; }
  .avc-fyp .avc-fyp__reassurance p { font: 400 clamp(12.5px, 3.46vw, 14.5px)/1.4 var(--fyp-sans); }
  .avc-fyp .avc-fyp__tab:focus-visible, .avc-fyp .avc-fyp__cta:focus-visible, .avc-fyp .avc-fyp__resources a:focus-visible { outline: 2px solid #11394e; outline-offset: 3px; z-index: 1; }
  .avc-fyp .avc-fyp__panel:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; }
  @media (prefers-reduced-motion: reduce) { .avc-fyp .avc-fyp__tab, .avc-fyp .avc-fyp__cta img { transition: none; } }
  @media (forced-colors: active) {
    .avc-fyp .avc-fyp__tab[aria-selected="true"] { border: 2px solid Highlight; }
    .avc-fyp .avc-fyp__tab[aria-selected="true"]::after { background: Highlight; }
    .avc-fyp .avc-fyp__cta, .avc-fyp .avc-fyp__resources a { border: 1px solid ButtonText; }
  }
}