/* odNOVA V2 hero title contract
   One rendered title scale for pages 2.1-2.7.
   HOME V3/V6 provides the visual authority; this is deliberately 2-8% quieter.
   Loaded last so page-local legacy overrides cannot fragment the family. */

/* Historic page sheets contain route-specific two-ID cascade locks. The
   repeated #top and never-matching :not() ID deliberately give this shared
   contract three-ID specificity, avoiding seven inline/page-local fixes. */
body.nt-hero-page[data-lang-page] #top#top h1.hs-h1:not(#v2-title-contract-sentinel){
  font-family:var(--font-serif,var(--serif,"Newsreader",Georgia,serif))!important;
  font-weight:300!important;
  line-height:.9!important;
  letter-spacing:-.045em!important;
}

body.nt-hero-page[data-lang-page] #top#top h1.hs-h1:not(#v2-title-contract-sentinel) .big{
  font-weight:300!important;
}

body.nt-hero-page[data-lang-page] #top#top h1.hs-h1:not(#v2-title-contract-sentinel) .txv2-title-break{
  display:none!important;
}

body.nt-hero-page[data-lang-page] #top#top h1.hs-h1:not(#v2-title-contract-sentinel) .sub{
  display:block!important;
  width:auto!important;
  max-width:calc(100% - clamp(16px,3vw,44px))!important;
  margin:clamp(2px,.035em,4px) 0 0 clamp(16px,3vw,44px)!important;
  font-size:.9em!important;
  font-style:italic!important;
  font-weight:300!important;
  line-height:.9!important;
  letter-spacing:inherit!important;
  white-space:normal!important;
}

/* The family entrance animation used inset(0) as its final mask. Newsreader's
   capitals rise a few pixels above a .9 line box, so that mask visibly shaved
   the top serifs from J, M, P and similar letters. Keep the same reveal, but
   give the title an optical bleed on every edge. */
@keyframes v2-title-copy-in-safe{
  0%{opacity:0;clip-path:inset(-.16em -.1em calc(100% + .16em) -.1em);transform:translate3d(0,24px,0)}
  100%{opacity:1;clip-path:inset(-.16em -.1em);transform:none}
}

@media (prefers-reduced-motion:no-preference){
  html.txv2-intro body.treatments-v2-page #top#top .txv2-hero-copy>h1.hs-h1:not(#v2-title-contract-sentinel),
  html.cv2-intro body.consultation-v2-page #top#top .cv2-hero-copy>h1.hs-h1:not(#v2-title-contract-sentinel),
  html.ntv2-intro body.nt-v2-page #top#top .ntv2-hero-copy>h1.hs-h1:not(#v2-title-contract-sentinel){
    animation-name:v2-title-copy-in-safe!important;
  }
}

/* The founder portrait is the one deliberate mobile geometry exception.
   Move the complete copy stack (eyebrow, title, lede and action) below the
   face; the six non-photographic V2 heroes retain the shared position. */
@media (max-width:600px){
  body.nt-hero-page[data-lang-page="meet-piotr"] #top#top .ntv2-hero-copy{
    padding-top:236px!important;
    padding-bottom:24px!important;
  }
}

/* Meet Piotr, Contact and Appointments keep the hero action with the
   introduction on desktop, as they already do on tablet and phone. This keeps
   the reading order intact instead of splitting one sentence across columns. */
@media (min-width:861px){
  body.nt-hero-page:is(
    [data-lang-page="meet-piotr"],
    [data-lang-page="contact"],
    [data-lang-page="booking"]
  ) #top#top .ntv2-hero-copy{
    grid-template-rows:auto auto auto auto!important;
  }
  body.nt-hero-page:is(
    [data-lang-page="meet-piotr"],
    [data-lang-page="contact"],
    [data-lang-page="booking"]
  ) #top#top .ntv2-hero-action{
    grid-column:1!important;
    grid-row:4!important;
    justify-self:start!important;
    width:min(400px,100%)!important;
    margin:24px 0 0!important;
  }
}

@media (min-width:601px) and (max-width:860px){
  body.nt-hero-page[data-lang-page="meet-piotr"] #top#top .ntv2-hero-copy{
    padding-top:clamp(420px,39svh,470px)!important;
  }
}

@media (max-width:600px){
  body.nt-hero-page[data-lang-page] #top#top h1.hs-h1:not(#v2-title-contract-sentinel){
    font-size:clamp(53px,14.1vw,56px)!important;
  }
}

@media (min-width:601px) and (max-width:1120px){
  body.nt-hero-page[data-lang-page] #top#top h1.hs-h1:not(#v2-title-contract-sentinel){
    font-size:clamp(58px,7.34vw,62px)!important;
  }
}

@media (min-width:1121px){
  body.nt-hero-page[data-lang-page] #top#top h1.hs-h1:not(#v2-title-contract-sentinel){
    font-size:clamp(76px,6.82vw,100px)!important;
  }
}