/* October 24 content refresh — editorial image placement, no hard-cropping */
:root{--osj-ink:#563744;--osj-blush:#fae3e1;--osj-light:#fffaf8}

/* Shared image treatment */
.blog-list-photo img, .blog-hero-photo img, .skin-guide-hero-photo img,
.guide-side-art.with-image img, .product-art-photo img,
.service-card .service-thumb img, .treatment-shot img {
  display:block;width:100%;height:100%;object-fit:contain;object-position:center;
}

/* Home: new blog thumbnails preserve the complete composition, not zoomed crops */
.premium-journal .blog-mini .blog-mini-img {
  border-radius:22px!important; height:auto!important;aspect-ratio:1.38;
  background:linear-gradient(140deg,#fff,#fbe5e1)!important;overflow:hidden;
  box-shadow:0 18px 38px rgba(112,65,80,.09)
}
.premium-journal .blog-mini .blog-mini-img img {
  object-fit:contain!important;object-position:center!important;transform:none!important;
}
.premium-journal .blog-mini:hover .blog-mini-img{transform:translateY(-3px)}

/* Blogs index: image-led rows with generous white breathing space */
.blog-list{max-width:1150px!important}
.blog-list .blog-row{
  display:grid;grid-template-columns:40px minmax(220px,300px) 1fr 30px;
  align-items:center;gap:24px;padding:26px;margin:0 0 20px;
  border:1px solid #f0e1e1;border-radius:24px;
  background:#fff;box-shadow:0 15px 40px rgba(130,80,90,.065);
  transition:box-shadow .3s,transform .3s
}
.blog-list .blog-row:hover{transform:translateY(-3px);box-shadow:0 22px 46px rgba(130,80,90,.12)}
.blog-list-photo{display:block;width:100%;aspect-ratio:1.45;border-radius:16px;background:#f9e8e8;overflow:hidden}
.blog-list-photo img{transition:transform .4s}
.blog-list .blog-row:hover .blog-list-photo img{transform:scale(1.018)}
.blog-row h3{font-size:clamp(1.45rem,2.2vw,2.15rem);line-height:1.25;margin:9px 0!important}
.blog-row p{line-height:1.7}
.blog-row .blog-go{justify-self:end}

/* Article hero: bright editorial split, whole image in frame */
.sub-hero .blog-hero-wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.78fr);column-gap:54px;row-gap:12px;align-items:center}
.blog-hero-wrap>.crumbs-small{grid-column:1;align-self:end}
.blog-hero-wrap>h1{grid-column:1;grid-row:2;margin:0!important;font-size:clamp(2.7rem,4.3vw,4.7rem)!important;line-height:1.09}
.blog-hero-wrap>.lead{grid-column:1;grid-row:3;align-self:start}
.blog-hero-photo{grid-column:2;grid-row:1 / span 3;margin:0;width:100%;min-height:270px;aspect-ratio:1.45;
  display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:26px;background:#fffcfa;
  border:5px solid #fff;box-shadow:0 25px 50px rgba(113,71,83,.11)}
.blog-hero-photo img{max-height:100%;max-width:100%}
.journal-article{max-width:none!important}
.journal-article>section{border-bottom:1px solid #f2e2e1;padding-bottom:25px;margin-bottom:31px}
.journal-article>section h2{font-size:clamp(1.6rem,2.6vw,2.1rem)!important;color:var(--osj-ink);line-height:1.2}
.journal-article>section p{font-size:1.075rem!important;line-height:1.95!important;color:#65565c!important;margin:0 0 15px}
.journal-article>section p:last-child{margin-bottom:0}
.article-layout{grid-template-columns:minmax(0,2.05fr) minmax(270px,.8fr)!important;gap:42px!important}
.journal-article .notice-panel{background:#fff4f3!important;border-left:3px solid #b9788b}

/* Skin guide: original guide image above the fold and in sidebar */
.sub-hero .skin-guide-hero-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.88fr);gap:45px;align-items:center}
.skin-guide-hero-copy h1{font-size:clamp(2.9rem,4.4vw,5rem)!important;line-height:1.1}
.skin-guide-hero-photo{width:100%;aspect-ratio:1.48;margin:0;border:5px solid white;border-radius:26px;
  box-shadow:0 24px 45px rgba(110,73,83,.1);background:#fffafa;overflow:hidden}
.guide-side-art.with-image{overflow:hidden;height:auto!important;aspect-ratio:1.3;border-radius:24px!important;background:#fffafa}
.guide-side-art.with-image img{max-height:100%}
.quiz-home .quiz-visual{background:#fbe5e5}
.quiz-home .quiz-visual img.skin-guide-contain{object-fit:contain!important;object-position:center!important}

/* Supplied products: preserve the complete branded pack-art and the text printed inside it */
.products-grid .product-card{background:#fff!important;border-radius:24px!important;box-shadow:0 16px 38px rgba(118,73,85,.07)}
.product-art-photo{height:360px!important;padding:12px;background:linear-gradient(155deg,#fff8f6,#fae1df)!important;overflow:hidden}
.product-art-photo img{max-height:100%;max-width:100%;transition:transform .3s ease}
.product-card:hover .product-art-photo img{transform:scale(1.014)}
.product-art-pending{height:360px!important;background:repeating-linear-gradient(135deg,#fff8f7,#fff8f7 16px,#faeded 16px,#faeded 32px)!important;
  text-align:center;display:flex;align-items:center;justify-content:center;padding:25px}
.product-image-pending{font-size:.95rem;line-height:1.6;color:#996c79;max-width:230px}
.product-content{gap:8px}
.product-content h3{font-size:1.3rem!important;color:#563744}

/* Full-frame service photographs to minimise loss at the edges */
.service-card .service-thumb{background:linear-gradient(125deg,#fff8f6,#faebeb);height:175px!important}
.service-card .service-thumb img{object-fit:contain!important;object-position:center!important;transform:none!important}
.service-card:hover .service-thumb img{transform:scale(1.018)!important}
.treatment-visual.has-photo{overflow:hidden}
.treatment-shot img{object-fit:contain!important;aspect-ratio:4 / 3!important;background:#fff8f7}
.treatment-shot figcaption{font-size:.79rem;line-height:1.55}
.service-feature-card img{object-position:center!important}

@media(max-width:1000px){
  .blog-list .blog-row{grid-template-columns:38px minmax(155px,230px) 1fr 24px;gap:17px;padding:20px}
  .sub-hero .blog-hero-wrap,.sub-hero .skin-guide-hero-grid{gap:28px}
}
@media(max-width:760px){
  .blog-list .blog-row{grid-template-columns:30px minmax(0,1fr) 25px;gap:12px 14px;padding:16px}
  .blog-list-photo{grid-column:1 / -1;grid-row:1;aspect-ratio:1.6;max-height:255px}
  .blog-list .blog-index{grid-column:1;grid-row:2}
  .blog-list .blog-row>div{grid-column:2;grid-row:2}
  .blog-list .blog-go{grid-column:3;grid-row:2}
  .blog-row h3{font-size:1.4rem}
  .sub-hero .blog-hero-wrap,.sub-hero .skin-guide-hero-grid{display:flex;flex-direction:column;align-items:stretch;gap:16px}
  .blog-hero-wrap>h1{font-size:2.65rem!important}
  .blog-hero-photo,.skin-guide-hero-photo{aspect-ratio:1.5;min-height:0;width:100%;margin-top:12px}
  .article-layout{display:grid!important;grid-template-columns:1fr!important;gap:26px!important}
  .journal-article>section p{font-size:1rem!important;line-height:1.85!important}
  .product-art-photo,.product-art-pending{height:390px!important}
  .service-card .service-thumb{height:190px!important}
}
@media(min-width:761px) and (max-width:950px){.products-grid{grid-template-columns:repeat(2,1fr)}}
@media(prefers-reduced-motion:reduce){.blog-list .blog-row,.product-art-photo img,.blog-list-photo img{transition:none!important}}
