/* Types of Therapy as two consecutive editorial sections (no tabs).
   Scoped to the homepage therapy section only. Wording, links, imagery, fonts,
   palette and pill actions come from the native document and earlier layers.

   Grid: the shared 92vw frame split into 12 columns. Individual Therapy keeps
   the media on the left and a narrower copy column on the right; Couples
   Therapy mirrors it. A fine rule opens each part (no numbered labels: owner rule). */
.elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy{
  --th-col-gap:clamp(16px,1.8vw,32px);
  --th-rule:var(--sv-rule-on-light,rgba(24,11,48,.14));
  --th-radius:10px;
  --th-head-space:clamp(40px,4.4vw,72px);   /* section heading → first rule */
  --th-rule-space:clamp(24px,2.4vw,40px);   /* rule → label / media */
  --th-entry-space:clamp(64px,7vw,120px);   /* end of one part → next rule */
  --th-label-space:20px;                    /* label → service heading */
  --th-media-max:min(64svh,620px);
}

/* Broad frame; the oversized header/tab grid gives way to a simple stack. */
.elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy>.sv-wrap{display:block;width:var(--sv-frame,92vw);max-width:none;margin-inline:auto}
.elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-panels{display:block;margin-top:var(--th-head-space);padding-top:0;border-top:0}

/* Each service: normal flow, never sticky, no enclosing card surface. */
.elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-panel{
  position:relative;top:auto;z-index:auto;isolation:auto;overflow:visible;visibility:visible;pointer-events:auto;
  min-height:0;min-width:0;grid-area:auto;background:none;
  display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--th-col-gap);row-gap:0;align-items:start;
  padding-top:var(--th-rule-space);border-top:var(--sv-line,1px) solid var(--th-rule)}
.elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-panel+.sv-service-panel{margin-top:var(--th-entry-space)}
.elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-panel:focus-visible{outline:none}

/* Placement: media always 7 of 12 columns. Wide screens leave a whole column
   before a narrow 4-column text block; mid widths give the text 5 columns and
   an inner gutter so lines stay readable. */
.elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-panel-1 .sv-service-media{grid-column:1/8;grid-row:1}
.elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-panel-1 .sv-service-copy{grid-column:8/13;grid-row:1;padding-inline:clamp(16px,2.6vw,32px) 0}
.elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-panel-2 .sv-service-copy{grid-column:1/6;grid-row:1;padding-inline:0 clamp(16px,2.6vw,32px)}
.elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-panel-2 .sv-service-media{grid-column:6/13;grid-row:1}
@media(min-width:1280px){
  .elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-panel-1 .sv-service-copy{grid-column:9/13;padding-inline:0}
  .elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-panel-2 .sv-service-copy{grid-column:1/5;padding-inline:0}
}

/* Media: broad 3:2 crops with a subtle radius; width carries the scale and
   the height is capped so large screens do not grow tall panels. */
.elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-media{
  position:relative;order:0;width:100%;aspect-ratio:3/2;max-height:var(--th-media-max);
  border-radius:var(--th-radius);overflow:hidden;background:color-mix(in srgb,var(--sv-ink) 8%,var(--sv-light))}
.elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-image{
  position:static;inset:auto;display:block;width:100%;height:100%;aspect-ratio:auto;max-height:none;object-fit:cover;transform:none}
.elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-panel-1 .sv-service-image{object-position:50% 40%}
.elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-panel-2 .sv-service-image{object-position:50% 64%}
@media(min-width:861px) and (max-width:1279px){
  /* Mid widths: a slightly deeper 4:3 crop so the image holds its side of the row. */
  .elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-media{aspect-ratio:4/3}
}

/* Copy: one grouped column; label, heading, text and action read together. */
.elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-copy{max-width:none;padding-block:0;align-self:start}
.elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-copy::before{content:none}
.elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-copy h3{font-size:clamp(30px,2.7vw,44px)}
.elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-copy :is(p:not(.sv-service-index),ul){max-width:var(--sv-measure,34em)}
/* The aria-hidden "01 / Individual Therapy" index duplicated the h3; numbered labels are not used. */
.elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-index{display:none}

/* Light/dark transition: the warm zone still opens from a narrow inset as it
   arrives, but with the subtle media radius instead of a large rounded card. */
@media(prefers-reduced-motion:no-preference){
  .elementor-86 .sv-home[data-sv-home-motion=on] .sv-therapy.sv-therapy::before{
    clip-path:inset(0 var(--sv-tone-x,0px) 0 var(--sv-tone-x,0px) round min(var(--sv-tone-r,0px),var(--th-radius)) min(var(--sv-tone-r,0px),var(--th-radius)) 0 0)}
}

/* Stacked (phones, portrait tablets): image, then label, heading, copy, action. */
@media(max-width:860px){
  .elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy{--th-entry-space:64px;--th-rule-space:24px;--th-head-space:40px}
  .elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy>.sv-wrap{width:calc(100% - 2*var(--sv-pad))}
  .elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-panel{grid-template-columns:minmax(0,1fr);row-gap:28px}
  .elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-panel .sv-service-media{grid-column:1;grid-row:1;max-height:none}
  .elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-panel .sv-service-copy{grid-column:1;grid-row:2;max-width:36rem;padding-inline:0}
}
@media(max-width:560px){
  .elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy{--th-entry-space:56px;--th-label-space:16px}
  .elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-panel{row-gap:24px}
  .elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-media{aspect-ratio:4/3}
  .elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-copy h3{font-size:clamp(28px,8vw,34px)}
}
/* Short landscape phones: keep each image inside the screen. */
@media(max-height:500px) and (orientation:landscape) and (max-width:1100px){
  .elementor-86 .sv-home.sv-home .sv-therapy.sv-therapy .sv-service-panel .sv-service-media{aspect-ratio:16/9;max-height:calc(100svh - 108px)}
}
