/* Patient Journey — "You Are Not Doing This Alone" phone presentation (<768px).
   Source: AriseVida-Patient-Journey-Not-Doing-This-Alone-Mobile handoff, adapted
   to the site (Fraunces / Inter tokens, host padding, legacy visibility,
   reference-measured sizes). 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-not-alone or the
   marked host. */
.avc-not-alone { 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-not-alone-mount] > [data-not-alone-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-support-network[data-not-alone-active] {
    padding: 0 !important;
    background: #fefcf7;
  }
  .pj-support-network[data-not-alone-active]::before,
  .pj-support-network[data-not-alone-active]::after { display:none; }

  .avc-not-alone {
    --support-cream:#fbf8f1; --support-ink:var(--ink-900, #0a1f25); --support-copy:#475569;
    --support-teal:var(--teal-700, #0f766e); --support-green:#4f6f37; --support-gold:#8f5f12; --support-terra:#b04a2a;
    /* Site fonts: the references are set in the site's display serif (Fraunces)
       and text sans (Inter); the handoff's Times/Arial values were fallbacks. */
    --support-serif: var(--font-display, 'Fraunces', Georgia, serif);
    --support-sans: var(--font-sans, 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif);
    --support-icon:44px; --support-gap:24px; --support-inset:12px;
    --support-text-inset:calc(var(--support-inset) + var(--support-icon) + var(--support-gap));
    display:block; box-sizing:border-box; inline-size:100%; max-inline-size:46rem;
    margin-inline:auto; padding:36px clamp(18px,6.15vw,28px) 34px;
    color:var(--support-copy); background:var(--support-cream); isolation:isolate;
    font:400 1rem/1.35 var(--support-sans); text-align:start;
  }
  .avc-not-alone[hidden], .avc-not-alone [hidden] { display:none!important; }
  .avc-not-alone *, .avc-not-alone *::before, .avc-not-alone *::after { box-sizing:border-box; }
  .avc-not-alone p, .avc-not-alone h2, .avc-not-alone h3, .avc-not-alone ul { 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-not-alone .avc-not-alone__intro { margin-block-end:24px; }
  .avc-not-alone .avc-not-alone__period { color:var(--support-terra); }
  .avc-not-alone .avc-not-alone__list { inline-size:100%; }
  .avc-not-alone .avc-not-alone__item {
    --accent:var(--support-teal); --tint:#eaf6f4; --crop-width:145.139%; --crop-left:-22.569%; --crop-top:-20.197%;
    position:relative; isolation:isolate;
    /* The row is its own stacking context (for the inset panel below), so it paints the section's cream itself:
       the icon canvases keep multiplying into that ground exactly as they do against the section. */
    background:var(--support-cream);
  }
  /* Sep 2026: the open tint is a contained, rounded panel painted 6px inside the row's top and bottom edges,
     so the dividers (at the row edges) and the reassurance callout below the last row stay clear of its
     curved corners. It fades with the row's open state and follows the row's box through the height motion. */
  .avc-not-alone .avc-not-alone__item::after {
    content:""; position:absolute; inset:6px 0 5px; z-index:-1; border-radius:14px; background:var(--tint);
    opacity:0; transition:opacity 240ms ease; pointer-events:none;
  }
  /* Row dividers sit a little inside the block's gutters, as in the renderings. */
  .avc-not-alone .avc-not-alone__item + .avc-not-alone__item::before { content:""; position:absolute; inset-block-start:0; inset-inline:4.5px; block-size:1px; background:#e2e0d7; }
  .avc-not-alone [data-not-alone-item="peer"] { --accent:var(--support-green); --tint:#f5f7ec; --crop-width:143.524%; --crop-left:-21.819%; --crop-top:-22.621%; }
  .avc-not-alone [data-not-alone-item="case-management"] { --accent:var(--support-gold); --tint:#fcf6e9; --crop-width:155.437%; --crop-left:-27.656%; --crop-top:-27.656%; }
  .avc-not-alone [data-not-alone-item="family"] { --accent:var(--support-terra); --tint:#fcf1e9; --crop-width:133.461%; --crop-left:-16.305%; --crop-top:-16.571%; }
  .avc-not-alone .avc-not-alone__item[data-open="true"] { background:var(--support-cream); }
  .avc-not-alone .avc-not-alone__item[data-open="true"]::after { opacity:1; }
  .avc-not-alone .avc-not-alone__row-heading { font:inherit; }
  .avc-not-alone .avc-not-alone__trigger {
    appearance:none; display:grid; grid-template-columns:var(--support-icon) minmax(0,1fr) 14px;
    gap:var(--support-gap); align-items:center; inline-size:100%; min-inline-size:0; min-block-size:88px;
    margin:0; padding:14px 8px 14px var(--support-inset); border:0; border-radius:0; box-shadow:none;
    background:transparent; color:var(--support-ink); text-align:start; cursor:pointer; font:inherit;
    letter-spacing:normal; -webkit-tap-highlight-color:transparent;
  }
  .avc-not-alone .avc-not-alone__trigger:disabled { opacity:1; color:var(--support-ink); cursor:default; -webkit-text-fill-color:var(--support-ink); }
  .avc-not-alone .avc-not-alone__copy { display:block; min-inline-size:0; padding-inline-end:12px; }
  /* Reference wraps this summary after "and"; the measure is in em so the break survives text zoom. */
  .avc-not-alone [data-not-alone-item="care-team"] .avc-not-alone__summary { max-inline-size:14em; }
  .avc-not-alone .avc-not-alone__title { display:block; color:var(--support-ink); font:500 clamp(17px,4.7vw,19.5px)/1.16 var(--support-serif); letter-spacing:-.015em; text-wrap:balance; }
  .avc-not-alone .avc-not-alone__summary { display:block; margin-block-start:3px; color:var(--support-copy); font:400 clamp(12.5px,3.33vw,14px)/1.4 var(--support-sans); }
  /* Originals have white margins. CSS displays the centered artwork without
     altering the PNG. Multiply blends its white canvas into the warm surface. */
  .avc-not-alone .avc-not-alone__icon { position:relative; display:block; inline-size:var(--support-icon); block-size:var(--support-icon); overflow:hidden; mix-blend-mode:multiply; }
  .avc-not-alone .avc-not-alone__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-not-alone .avc-not-alone__chevron { display:block; inline-size:14px; block-size:22px; position:relative; color:var(--accent); transform-origin:50% 50%; transition:transform 240ms cubic-bezier(.2,.65,.3,1); }
  .avc-not-alone .avc-not-alone__chevron::before { content:""; display:block; position:absolute; inline-size:13px; block-size:13px; inset-block-start:4.5px; inset-inline-start:-3px; border-block-start:2px solid currentColor; border-inline-end:2px solid currentColor; transform:rotate(45deg); }
  .avc-not-alone [data-open="true"] .avc-not-alone__chevron { transform:rotate(90deg); }
  .avc-not-alone .avc-not-alone__trigger:disabled .avc-not-alone__chevron { visibility:hidden; }
  .avc-not-alone .avc-not-alone__panel { min-block-size:0; }
  .avc-not-alone .avc-not-alone__panel-inner { padding:0 12px 18px var(--support-text-inset); }
  .avc-not-alone .avc-not-alone__help-label { margin:0 0 6px; color:var(--accent); font:700 11.5px/1.3 var(--support-sans); letter-spacing:.13em; text-transform:uppercase; }
  .avc-not-alone .avc-not-alone__checks { display:grid; gap:6px; padding:0; list-style:none; color:var(--support-copy); font:400 clamp(13.5px,3.6vw,14.5px)/1.5 var(--support-sans); }
  .avc-not-alone .avc-not-alone__checks li { display:grid; grid-template-columns:15px minmax(0,1fr); gap:13px; align-items:center; margin:0; padding:0; }
  .avc-not-alone .avc-not-alone__check { display:block; inline-size:10px; block-size:6px; margin:0 0 2px 2.5px; border-inline-start:1.9px solid var(--accent); border-block-end:1.9px solid var(--accent); transform:rotate(-45deg); }
  .avc-not-alone .avc-not-alone__reassurance { display:flex; align-items:center; justify-content:center; gap:17px; min-block-size:64px; margin-block-start:0; padding:12px 20px; border-radius:16px; background:#edf5f1; }
  .avc-not-alone .avc-not-alone__heart { --crop-width:159.933%; --crop-left:-29.966%; --crop-top:-27.671%; inline-size:33px; block-size:33px; flex:none; }
  .avc-not-alone .avc-not-alone__reassurance p { color:var(--support-ink); font:600 clamp(14px,4.45vw,21px)/1.1 var(--support-serif); letter-spacing:.012em; }
  .avc-not-alone .avc-not-alone__note { margin:5px auto 0; max-inline-size:300px; text-align:center; font:400 clamp(12px,3.2vw,13px)/1.5 var(--support-sans); letter-spacing:0; }
  .avc-not-alone .avc-not-alone__trigger:focus-visible { outline:2px solid #155b6b; outline-offset:-3px; }
  @media (max-width:359px) {
    .avc-not-alone { --support-icon:36px; --support-gap:17px; padding-block-start:30px; }
    .avc-not-alone .avc-not-alone__reassurance { gap:11px; padding-inline:12px; }
  }
  @media (prefers-reduced-motion:reduce) { .avc-not-alone .avc-not-alone__item, .avc-not-alone .avc-not-alone__item::after, .avc-not-alone .avc-not-alone__chevron { transition:none; } }
  @media (forced-colors:active) { .avc-not-alone .avc-not-alone__item + .avc-not-alone__item::before { background:CanvasText; } .avc-not-alone .avc-not-alone__check { border-color:CanvasText; } .avc-not-alone .avc-not-alone__trigger:focus-visible { outline-color:Highlight; } }
}