/* Rejuran page extras (30 Oct 2026): the hero's single DNA picture and the Rejuran range. Loaded after rejuran.css.
   The guide itself (.edu-guide__*) is styles.css, "wrinkle education guide". */

/* Hero: one portrait picture (the glass DNA, 1122 x 1402) in the hero's left column, in an arch with a thin gold ring
   (the site's arch shape). */
.rjx-dna{grid-area:gallery;align-self:center;justify-self:center;container-type:inline-size;width:min(100%,520px);margin:0}
.rjx-dna__ring{padding:12px;border:1px solid var(--gold-light);border-radius:50cqw 50cqw 14px 14px}
.rjx-dna__ring img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;object-position:var(--pos,50% 50%);border-radius:calc(50cqw - 12px) calc(50cqw - 12px) 6px 6px;background:rgba(245,240,232,.08)}
@media (max-width:900px){
  .rjx-dna{width:min(100%,460px);margin:24px auto 0}
  .rjx-dna__ring{padding:10px}
  .rjx-dna__ring img{border-radius:calc(50cqw - 10px) calc(50cqw - 10px) 6px 6px}
}
/* Phones: the DNA picture runs the full content width (Nik, 30 Oct 2026) */
@media (max-width:600px){.rjx-dna{width:100%}}
/* The Rejuran range (30 Oct 2026): ZO's range layout from rejuran.css, on navy (Nik, 30 Oct 2026). The photos are
   Rejuran's own dark studio shots, so they fill the arch instead of sitting on white like ZO's packshots.
   One navy run from the range through The Gallery to What to expect: the range paints the navy and the pattern once and
   reaches down behind The Gallery (only sideways is clipped), which drops its own, so the pattern never restarts at a
   join. The pattern is the template's (rejuran.css, .rj-result::before) with its .9 opacity baked in as a 10% navy veil.
   Anything past The Gallery sits under What to expect's opaque cream. */
.rjx-range{position:relative;isolation:isolate;overflow:visible;overflow-x:clip;background:none;color:var(--cream);padding-top:240px;padding-bottom:40px}
.rjx-range::before{content:"";position:absolute;inset:0 0 -2600px;z-index:-2;pointer-events:none;background:linear-gradient(rgba(21,35,89,.1),rgba(21,35,89,.1)),url(../treatments-bg-1600.webp?v=c0ee742e) 50% 0/740px 740px repeat,var(--navy)}
.rjx-range::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,var(--ground-fade)) top/100% 180px no-repeat,rgba(21,35,89,.35)}
.rjx-range + .rj-result{background:none}
.rjx-range + .rj-result::before{display:none}
.rjx-range + .rj-result::after{background:linear-gradient(0deg,var(--ground-fade)) bottom/100% 180px no-repeat,rgba(21,35,89,.35)}
.rjx-range + .rj-result .rj-result__inner{padding-top:40px;padding-bottom:240px}
.rjx-range h2{color:var(--cream)}
.rjx-range h2 em{color:var(--rj-gold-italic)}
.rjx-range .rj-range__head{align-items:center;border-bottom-color:var(--rj-hair)}
.rjx-range .rj-range__group{display:block;border-bottom:0;padding-bottom:0}
.rjx-range .rj-range__list{grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}
.rjx-range .rj-product__photo{aspect-ratio:4/5}
.rjx-range .rj-product__photo img{object-fit:cover;padding:0;background:var(--navy-deep)}
.rjx-range__area{margin:16px 0 0;font-family:var(--caps);font-size:11px;letter-spacing:.2em;line-height:14px;text-transform:uppercase;color:var(--rj-gold-italic)}
.rjx-range .rj-product__name{margin-top:6px;color:var(--cream)}
.rjx-range .rj-product__text{color:rgba(245,240,232,.76)}
@media (max-width:900px){
  .rjx-range{padding-top:180px;padding-bottom:24px}
  .rjx-range::before{bottom:-3400px;background-size:auto,520px 520px,auto}
  .rjx-range::after{background-size:100% 120px,auto}
  .rjx-range + .rj-result::after{background-size:100% 120px,auto}
  .rjx-range + .rj-result .rj-result__inner{padding-top:24px;padding-bottom:180px}
  .rjx-range .rj-range__head{align-items:flex-start}
  .rjx-range .rj-range__list{grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 16px}
}
/* Phones: three in two columns left one alone, so each formula is a row, photo beside its words */
@media (max-width:600px){
  .rjx-range .rj-range__list{grid-template-columns:minmax(0,1fr);gap:20px}
  .rjx-range .rj-product{display:grid;grid-template-columns:118px minmax(0,1fr);grid-template-rows:auto auto 1fr;column-gap:18px;align-items:start}
  .rjx-range .rj-product__photo{grid-row:1/4;width:118px}
  .rjx-range__area{margin-top:4px}
}