/* Four working articles: size each composition to its content, preserving the approved mobile edition. */
@media screen and (min-width:1024px) {
 html[data-style] #main.working-desktop {--desktop-gap:clamp(32px,3.2vw,48px);}
 html[data-style] #main.working-desktop .chapter {padding:34px 0;}
 html[data-style] #main.working-desktop .desktop-row {align-items:start;}
 html[data-style] #main.working-desktop .desktop-copy>.chapter-heading {margin-bottom:22px;}
 html[data-style] #main.working-desktop .desktop-copy>p {margin-bottom:18px;}
 html[data-style] #main.working-desktop .desktop-copy>p:last-child {margin-bottom:0;}
 html[data-style] #main.working-desktop .desktop-copy>.subheading {margin:22px 0 12px;font-size:22px;line-height:29px;}
 html[data-style] #main.working-desktop .desktop-copy>.chapter-heading+.subheading {margin-top:0;}
 html[data-style] #main.working-desktop .hormone .source-list {columns:2;column-gap:28px;margin:10px 0 20px;}
 html[data-style] #main.working-desktop .hormone .source-list li {break-inside:avoid;margin-bottom:6px;font-size:18px;line-height:27px;}
 html[data-style] #main.working-desktop .desktop-row>.a2c-motto {min-height:0;align-self:stretch;padding:32px;}
 html[data-style] #main.working-desktop .desktop-row>.a2c-motto p {font-size:27px;line-height:36px;}
 html[data-style] #main.working-desktop .working-notes {display:grid;grid-template-columns:1fr 1fr;gap:var(--desktop-gap);margin-top:22px;}
 html[data-style] #main.working-desktop .working-notes .subheading:first-child {margin-top:0;}
 html[data-style] #main.working-desktop .working-estriol .desktop-row {align-items:stretch;}
 html[data-style] #main.working-desktop .working-estriol .desktop-row>.desktop-copy:first-child {grid-column:2;grid-row:1;}
 html[data-style] #main.working-desktop .working-visual-note {grid-column:1;grid-row:1;display:flex;flex-direction:column;gap:20px;}
 html[data-style] #main.working-desktop .working-visual-note>.photo {position:relative;flex:1;width:100%;min-height:340px;margin:0;}
 html[data-style] #main.working-desktop .working-visual-note>.photo img {position:absolute;inset:0;width:100%;height:100%;max-height:none;aspect-ratio:auto;object-fit:cover;object-position:65% top;}
 html[data-style] #main.working-desktop .working-visual-note>p {margin:0;}
 html[data-style] #main.working-desktop .estriol-message {left:5%;width:41%;}
 html[data-style] #main.working-desktop .estriol-message p {font-size:25px;line-height:33px;}
 html[data-style] #main.working-desktop :is(#progesteron,#testosteron) .desktop-row {align-items:stretch;}
 html[data-style] #main.working-desktop :is(#progesteron,#testosteron) .desktop-row>.photo {min-height:440px;}
 html[data-style] #main.working-desktop :is(#progesteron,#testosteron) .desktop-row>.photo img {position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;object-fit:cover;object-position:50% 65%;}
 html[data-style] #main.working-desktop #testosteron .desktop-row>.photo img {object-position:45% center;}

 /* A complete product photograph reaches the edge of its half, without the old centered width cap. */
 html[data-style] #main.working-desktop :is(#drmo-baseline,#drmo-magline) .desktop-row {align-items:stretch;}
 html[data-style] #main.working-desktop .desktop-row>.product-photo {width:100%;max-width:none;justify-self:stretch;min-height:440px;}
 html[data-style] #main.working-desktop .desktop-row>.product-photo img {position:absolute;inset:0;width:100%;height:100%;aspect-ratio:auto;max-height:none;object-fit:cover;object-position:center;}

 /* Two brief, adjacent BHRT topics share one photograph and retain both original section anchors. */
 html[data-style] #main.working-desktop .working-context {display:grid;grid-template-columns:1.15fr 1fr;gap:var(--desktop-gap);padding:34px 0;border-bottom:3px solid #ededed;}
 html[data-style] #main.working-desktop .working-context-visual {position:relative;min-width:0;min-height:360px;}
 html[data-style] #main.working-desktop .working-context-visual>.photo {position:absolute;inset:0;width:100%;height:100%;margin:0;}
 html[data-style] #main.working-desktop .working-context-visual>.photo img {width:100%;height:100%;max-height:none;aspect-ratio:auto;object-fit:cover;object-position:30% 30%;}
 html[data-style] #main.working-desktop .working-context-copy>.chapter {padding:0;border:0;margin:0;}
 html[data-style] #main.working-desktop .working-context-copy>.chapter+.chapter {margin-top:24px;padding-top:24px;border-top:1px solid #dedede;}
 html[data-style] #main.working-desktop .working-context .chapter-layout {display:block;}
 html[data-style] #main.working-desktop .working-context .chapter-heading {margin:0 0 20px;}
 html[data-style] #main.working-desktop .working-context .chapter-heading h2 {font-size:30px;line-height:38px;}
 html[data-style] #main.working-desktop .working-context .chapter-copy p {margin:0;}
 html[data-style] #main.working-desktop .working-close>.photo {position:relative;width:100%;max-width:none;margin:24px 0 0;}
 html[data-style] #main.working-desktop .working-close>.photo img {width:100%;height:auto;max-height:none;aspect-ratio:3;object-fit:contain;}
 html[data-style] #main.working-desktop #zpusob-podani .desktop-row {grid-template-columns:1fr 1fr;align-items:stretch;}
 html[data-style] #main.working-desktop #zpusob-podani .desktop-row>.a2c-motto {padding:28px 32px;}

 /* Care keeps the heading beside its motto and alternates the following clinical photograph. */
 html[data-style] #main.working-desktop .desktop-lab-lead {grid-template-columns:1fr 1fr;margin-bottom:28px;}
 html[data-style] #main.working-desktop .desktop-lab-lead>.desktop-copy {grid-column:2;grid-row:1;}
 html[data-style] #main.working-desktop .desktop-lab-lead>.a2c-motto {grid-column:1;grid-row:1;}
 html[data-style] #main.working-desktop .working-lab-body {align-items:stretch;}
 html[data-style] #main.working-desktop .working-lab-body>.desktop-copy {grid-column:1;grid-row:1;}
 html[data-style] #main.working-desktop .working-lab-body>.photo {grid-column:2;grid-row:1;min-height:330px;}
 html[data-style] #main.working-desktop .working-lab-body>.photo img {position:absolute;inset:0;width:100%;height:100%;max-height:none;aspect-ratio:auto;object-fit:cover;object-position:73% 40%;}
 /* A short definition pairs with an uncropped photograph of the matching shapes. */
 html[data-style] #main.working-desktop #bioidenticke-hormony .desktop-row {grid-template-columns:.8fr 1.2fr;align-items:center;}
 html[data-style] #main.working-desktop #bioidenticke-hormony .bioidentity-photo img {aspect-ratio:4/3;object-fit:contain;}
 html[data-style] #main.working-desktop .working-cream {position:relative;min-height:330px;display:grid;align-items:center;}
 html[data-style] #main.working-desktop .working-cream>.photo {position:absolute;inset:0;width:100%;height:100%;max-width:none;margin:0;}
 html[data-style] #main.working-desktop .working-cream>.photo img {width:100%;height:100%;max-height:none;object-fit:cover;object-position:right center;aspect-ratio:auto;}
 html[data-style] #main.working-desktop .working-cream>.desktop-copy {position:relative;z-index:1;width:44%;margin:28px 0 28px 2%;}
 html[data-style] #main.working-desktop .working-cream .chapter-heading h2 {font-size:30px;line-height:38px;}
}
@media screen and (min-width:1024px) and (max-width:1199px) {
 html[data-style] #main.working-desktop .hormone .source-list {column-gap:20px;}
 html[data-style] #main.working-desktop .desktop-copy>.subheading {font-size:21px;line-height:28px;}
 html[data-style] #main.working-desktop .estriol-message p {font-size:22px;line-height:29px;}
 html[data-style] #main.working-desktop .working-context {grid-template-columns:1.15fr .85fr;}
 html[data-style] #main.working-desktop .working-context .chapter-heading h2,
 html[data-style] #main.working-desktop .working-cream .chapter-heading h2 {font-size:28px;line-height:35px;}
 html[data-style] #main.working-desktop .working-cream>.desktop-copy {width:45%;}
 html[data-style] #main.working-desktop .desktop-row>.a2c-motto {padding:26px;}
 html[data-style] #main.working-desktop .desktop-row>.a2c-motto p {font-size:25px;line-height:34px;}
}

/* The existing contents fill the short opening, while narrower screens keep it below the opening. */
@media screen and (min-width:1200px) {
 html[data-style] #main.working-desktop:not([data-desktop-article=mineraly]) .article-hero {gap:18px var(--desktop-gap);align-items:start;}
 html[data-style] #main.working-desktop:not([data-desktop-article=mineraly]) .desktop-hero-copy {display:contents;}
 html[data-style] #main.working-desktop:not([data-desktop-article=mineraly]) .desktop-hero-copy h1 {grid-column:2;grid-row:1;margin:0;}
 html[data-style] #main.working-desktop:not([data-desktop-article=mineraly]) .article-byline {grid-column:2;grid-row:2;margin:0;}
 html[data-style] #main.working-desktop:not([data-desktop-article=mineraly]) .hero-intro {grid-column:2;grid-row:3;}
 html[data-style] #main.working-desktop:not([data-desktop-article=mineraly]) .hero-intro p {margin:0;}
 html[data-style] #main.working-desktop:not([data-desktop-article=mineraly]) .article-hero>.photo {grid-column:1;grid-row:1/5;align-self:center;}
 html[data-style] #main.working-desktop:not([data-desktop-article=mineraly]) .contents {grid-column:2;grid-row:4;padding:15px 0 0;margin:0;}
 html[data-style] #main.working-desktop:not([data-desktop-article=mineraly]) .contents .contents-links {grid-template-columns:repeat(2,minmax(0,1fr));gap:0 22px;}
 html[data-style] #main.working-desktop:not([data-desktop-article=mineraly]) .contents .contents-links a {font-size:17px;line-height:24px;min-height:42px;padding:10px 0;}
}
