/* Client review: history, supplied imagery, and ingredient editorial layout. Test only. */
/* October 1 superseding rules are grouped at the end of this sheet. */
/* September 26: faithful source portrait, compact catalogue, supplied Japan logo. */
.product-image.media-block { min-height:0; background-image:none; overflow:hidden; }
.catalogue-set-photo { position:relative; width:100%; aspect-ratio:16 / 7; background:#fff; overflow:hidden; }
.catalogue-set-photo img { position:absolute; display:block; max-width:none; height:auto; mix-blend-mode:normal; }
.catalogue-set-photo .catalogue-set-original { z-index:2; width:100%; top:-75%; left:0; clip-path:polygon(0 0,79.1875% 0,79.1875% 51.1%,80.15% 51.9%,80.4% 74.4%,80.1% 75.1%,0 75.1%); }
.catalogue-set-photo .catalogue-set-current-spf { z-index:1; width:36.5%; top:17.857%; left:68.125%; filter:brightness(1.035) saturate(1.25); }
.marini-site .product-image .set-montage { height:clamp(12rem,23vw,22rem); padding:0; align-items:stretch; gap:0; background:#eaf4ed; isolation:isolate; }
.marini-site .product-image .set-montage img { transform:scale(1.25); object-fit:cover; object-position:center 56%; mix-blend-mode:multiply; }
.marini-site .product-image .set-montage img:first-child { transform:scale(.98); }
.history-now.history-now-editorial { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:2rem; max-width:50rem; border:0; box-shadow:none; background:transparent; padding:2.5rem 0; }
.history-now-editorial::after { display:none; }
.history-now-editorial > .history-year { font-size:clamp(4.5rem,8vw,8rem); }
.history-now-copy { border-left:1px solid #b7cec7; padding-left:2rem; text-align:left; }
.history-now-copy p { font-size:1rem; }
.history-japan-logo { width:16rem; max-width:100%; aspect-ratio:966 / 145; margin:1.5rem 0 0; background:url("./assets/images/marini-japan-logo-brochure-20260927.png") center / contain no-repeat; }
.message-section .message-photo { background-image:url("./assets/images/marini-representative-client-20260928.png"); background-size:cover; background-position:center top; aspect-ratio:2 / 3; -webkit-mask-image:none; mask-image:none; filter:none; opacity:1; }
@media(max-width:800px) {
 .history-now.history-now-editorial { grid-template-columns:1fr; gap:1rem; }
 .history-now-copy { border-left:0; border-top:1px solid #b7cec7; padding:1rem 0 0; text-align:center; }
 .history-now-en { margin-inline:auto; }
 .history-japan-logo { margin-inline:auto; }
 .marini-site .product-image .set-montage { height:clamp(11rem,44vw,19rem); }
 .message-section .message-photo { aspect-ratio:2 / 3; background-position:center top; }
}
.marini-social-link { white-space: nowrap; }
@media (min-width:701px) and (max-width:1100px) {
 .marini-header .marini-nav { flex-wrap:wrap; gap:12px 20px; }
 .marini-primary-links,.marini-utility-links { flex-wrap:wrap; }
}
.history-reach { max-width: 44rem; margin-inline: auto; background: #0b4644; color: #fff; border: 0; padding: clamp(2rem,4vw,4rem); }
.history-reach strong, .history-now > .history-year { font-family: Georgia, 'Times New Roman', serif; font-weight: 400; }
.history-reach-en, .history-now-en { display: block; font: 500 .75rem/1.7 var(--m-sans); letter-spacing: .18em; margin-top: .8rem; }
.history-now { border: 0; background: transparent; }
.history-now-en { max-width: 22rem; }
.hyla-lifestyle-crop { object-fit: cover; object-position: 45% center; }
@media(min-width:801px) { .hyla-lifestyle-crop { width:100%; height:100%; min-height:24rem; } }
.technology-section .technology-image {
  background-image: url("./assets/images/marini-technology.webp");
  background-color: #fff;
  background-position: center;
  background-size: contain;
}
.marini-hero-media { display: flex; align-items: center; justify-content: flex-end; background: #f3f8f4; }
.marini-hero-media .hero-montage { width: 75%; height: 76%; aspect-ratio: auto; background: #eaf4ed; }
.marini-hero-media .hero-montage img { mix-blend-mode: multiply; }
.systems-image,.product-image { background: #fff; }
.systems-image .set-montage,.product-image .set-montage { height: 100%; aspect-ratio: auto; }
.marini-hero-copy .marini-hero-agent {
  max-width: 38rem;
  margin: -.6rem 0 1.8rem;
  color: #eef6ed;
  font-size: clamp(.75rem, 1vw, .9rem);
  letter-spacing: .045em;
}

.marini-history {
  margin-top: clamp(4rem, 7vw, 8rem);
  padding: clamp(2.2rem, 5vw, 6rem);
  color: #0b4644;
  background: #f7f7f1;
  scroll-margin-top: 2rem;
}
.history-intro { max-width: 52rem; margin: 0 auto clamp(2.5rem, 5vw, 5rem); text-align: center; }
.history-intro .section-tag { display: block; margin-bottom: .75rem; font: 700 .72rem/1.5 var(--m-sans); letter-spacing: .2em; }
.history-intro h2 { margin-bottom: 1.2rem; font-size: clamp(1.7rem, 2.7vw, 2.7rem); line-height: 1.5; }
.history-intro > p:last-child { margin: 0; font-size: .95rem; line-height: 2; }
.history-timeline { position: relative; max-width: 76rem; margin: 0 auto; padding: 0; list-style: none; }
.history-timeline::before { position: absolute; top: 1.8rem; bottom: -2rem; left: 50%; width: 2px; content: ""; background: #0b4644; transform: translateX(-50%); }
.history-event { position: relative; width: 50%; padding: 0 clamp(1.7rem, 4vw, 4rem) clamp(2.6rem, 5vw, 5rem); }
.history-event:nth-child(even) { margin-left: 50%; }
.history-event:nth-child(odd) { text-align: right; }
.history-event::before { position: absolute; top: 1.5rem; right: -.53rem; width: 1.05rem; height: 1.05rem; content: ""; border: 3px solid #0b4644; border-radius: 50%; background: #c5e7d8; z-index: 1; }
.history-event:nth-child(even)::before { right: auto; left: -.53rem; }
.history-year { display: block; font: 500 clamp(2.2rem, 4vw, 4.2rem)/1.15 var(--m-sans); letter-spacing: -.04em; }
.history-year small { font: 500 clamp(1rem, 1.5vw, 1.4rem)/1.5 var(--m-jp); letter-spacing: 0; }
.history-event p { max-width: 28rem; margin: .5rem 0 0; font-size: clamp(.88rem, 1vw, 1rem); line-height: 1.85; }
.history-event:nth-child(odd) p { margin-left: auto; }
.history-reach { position: relative; max-width: 39rem; margin: 0 auto clamp(2rem, 4vw, 4rem); padding: clamp(1.5rem, 3vw, 2.7rem); color: #f8fbf8; background: #0b4644; text-align: center; }
.history-reach > span { display: block; font-size: .82rem; letter-spacing: .15em; }
.history-reach strong { display: block; font: 400 clamp(3.5rem, 7vw, 6rem)/1.2 Georgia, 'Times New Roman', serif; }
.history-reach strong small { font: 500 clamp(1rem, 2vw, 1.5rem)/1.5 var(--m-jp); }
.history-reach p { margin: .25rem 0 .75rem; }
.history-reach > small { display: block; font-size: .7rem; line-height: 1.7; }
.history-now { max-width: 46rem; margin: 0 auto; padding: clamp(1.5rem, 3vw, 3rem); border: 1px solid #90b8a6; background: #e2f0e8; text-align: center; }
.history-now .history-year { font-size: clamp(2.7rem, 5vw, 5rem); }
.history-now p { margin: .65rem auto 0; font-size: clamp(1rem, 1.4vw, 1.25rem); line-height: 1.8; }

.values-section .value-image { border: 3px solid #fff; }
.values-section .value-card { background: #e9f2e9; }
.values-section .value-copy h3 { color: #0b4644; }
.values-section .value-copy p { color: #385c52; }
.values-section .value-explore { background-image: url("./assets/images/marini-values-exploration-20260923.jpg"); }
.values-section .value-integrity { background-image: url("./assets/images/marini-values-integrity-20260923.jpg"); background-position: center 29%; }
.values-section .value-coexistence { background-image: url("./assets/images/marini-values-coexistence-20260923.jpg"); background-position: center 58%; }
.values-section .value-integrity { background-position: center 38%; }
.values-section .value-coexistence { background-position: 50% 50%; }

.technology-editorial { gap: clamp(1.3rem, 2.5vw, 2.5rem); }
.technology-editorial .science-story,
.technology-editorial .science-story:nth-child(1),
.technology-editorial .science-story:nth-child(2),
.technology-editorial .science-story:nth-child(3) {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, .9fr);
  grid-template-rows: auto 1fr;
  gap: clamp(1rem, 2vw, 2rem) clamp(2rem, 4vw, 5rem);
  padding: clamp(1.5rem, 4vw, 4.5rem);
  color: #0b4644;
  background: #f8f7f2;
  --science-accent: #0b4644;
  --science-soft: #e9f0e8;
  --science-border: #b9cfc1;
}
.technology-editorial .science-story:nth-child(2) { background: #f6f6f0; }
.technology-editorial .science-story:nth-child(3) { background: #f8f7f2; }
.science-story-heading { grid-column: 1; grid-row: 1; padding: 0; border: 0; }
.science-story-number { margin-bottom: clamp(.8rem, 1.5vw, 1.5rem); color: #53766b; }
.science-story-content { grid-column: 1; grid-row: 2; min-width: 0; }
.science-texture { grid-column: 2; grid-row: 1 / 3; align-self: center; overflow: hidden; }
.science-texture img { display: block; width: 100%; height:auto; object-fit:contain; -webkit-mask-size:100% 100%; mask-size:100% 100%; -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat; mask-mode:alpha; filter:none; }
.science-texture img[src*="texture-c-esta"] { -webkit-mask-image:url("./assets/images/marini-texture-c-esta-mask-20260927.svg"); mask-image:url("./assets/images/marini-texture-c-esta-mask-20260927.svg"); }
.science-texture img[src*="texture-retinol"] { -webkit-mask-image:url("./assets/images/marini-texture-retinol-mask-20260927.svg"); mask-image:url("./assets/images/marini-texture-retinol-mask-20260927.svg"); }
.science-texture img[src*="texture-hyla3d"] { -webkit-mask-image:url("./assets/images/marini-texture-hyla3d-mask-20260927.svg"); mask-image:url("./assets/images/marini-texture-hyla3d-mask-20260927.svg"); }
.science-story-heading p + p { margin-top: .85rem; }
.science-story-heading a { color: inherit; text-decoration: underline; text-underline-offset: .24em; }
.pointcare-selection .science-story-heading,
.pointcare-selection .science-story-content { grid-column: 2; }
.pointcare-selection .science-texture { grid-column: 1; }
.science-hyla .science-story-heading { grid-column: 1; }
.science-hyla .science-texture { grid-column: 2; grid-row: 1 / 3; }
.science-hyla .science-story-content { grid-column: 1; }
.science-ingredient-grid { gap: 0; border-block: 1px solid #9fbeae; background: rgba(226,240,232,.27); }
.science-ingredient-card { padding: 1.15rem clamp(.8rem,1.4vw,1.4rem); border: 0; background: transparent; }
.science-ingredient-card + .science-ingredient-card { border-left: 1px solid #9fbeae; }
.science-ingredient-en { color: #527c6d; }
.pointcare-links { gap: 0; border-top: 1px solid #b8d0c5; }
.pointcare-links a { min-height: 4.5rem; border: 0; border-bottom: 1px solid #b8d0c5; }
.retinol-diagram,.hyla-diagram { padding: 1.3rem 0; border: 0; border-block: 1px solid #9fbeae; background: transparent; }
.retinol-diagram ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(.8rem, 2vw, 2rem); padding: 0; margin: 0; list-style: none; }
.retinol-diagram li { display: block; min-height: 0; padding: .25rem 0 .25rem 1rem; border-left: 1px solid #9fbeae; background: transparent; text-align: left; }
.retinol-diagram li:not(:last-child)::after { content: none; }
.retinol-diagram li span { display: block; font: 700 .67rem/1.6 var(--m-sans); letter-spacing: .12em; color: #527c6d; }
.retinol-diagram li strong { display: block; margin: .3rem 0; font-size: .95rem; font-weight: 500; }
.technology-editorial .retinol-diagram li p { margin: 0; font-size: .78rem; line-height: 1.7; }
.retinol-diagram .diagram-review { font-size: .73rem; color: #527c6d; }
.hyla-diagram figcaption { display: flex; align-items: baseline; gap: .6rem; }
.hyla-big-four { font: 400 clamp(3.5rem, 7vw, 6rem)/1 var(--m-sans); }
.hyla-types { gap: 0; border-top: 1px solid #a6c2b2; }
.hyla-types li { display: block; padding: 1rem .4rem 1rem 0; border: 0; border-bottom: 1px solid #a6c2b2; background: transparent; text-align: left; }
.hyla-types li span { display: block; color: #527c6d; font: 500 .7rem/1.6 var(--m-sans); }
.hyla-types strong { display: block; margin-top: .3rem; font-size: .85rem; }
.technology-editorial .hyla-diagram .hyla-peptide { display: block; margin: 1rem 0 0; padding: 0; background: transparent; font-size: .8rem; }
.hyla-peptide-card { margin: 1rem 0; border-block: 1px solid #9fbeae; background: #e9f0e8; }
.technology-section .technology-image { background-size: cover; }
@media(max-width:600px) {
  .values-section .value-integrity { min-height: 0; aspect-ratio: 1545 / 2000; background-size: cover; background-position: center; }
}

/* Alternate restrained tones clarify the three-column catalogue without changing its palette. */
.product-list a { background: #34786c; color: #eff4ee; border-color: rgba(239,244,238,.3); }
.product-list a:last-child { grid-column: auto; }
.product-list a:hover,.product-list a:focus-visible { background: #245d53; color: #ffffff; }
.product-list a:focus-visible { outline: 2px solid #eff4ee; outline-offset: -3px; }

.history-event:first-child > div::after { content:none; }
.history-california { width:min(100%,20rem); margin:1.2rem 0 0 auto; }
.history-california img { display:block; width:100%; aspect-ratio:3/2; object-fit:cover; border:1px solid #a2bea9; }
.history-california figcaption { margin-top:.35rem; color:#527c6d; font:500 .65rem/1.5 var(--m-sans); letter-spacing:.12em; }
.history-brand-transition { display: flex; align-items: center; justify-content: flex-end; gap: .7rem; margin-top: 1.1rem; }
.history-brand-transition img { width: min(37%, 8.5rem); height: 4rem; object-fit: contain; }
.history-brand-transition .history-old-logo { background: transparent; }
.history-brand-transition .history-new-logo { padding: .4rem; background: transparent; }
.history-brand-transition span { font-size: 1.3rem; }
.history-now { border-width: 2px; box-shadow: 0 0 0 8px rgba(144,184,166,.13); }
.history-now::after { display: block; width: 4rem; height: 1px; margin: 1.15rem auto 0; content: ""; background: #0b4644; }
.history-now .history-new-logo { display: block; width: min(15rem,70%); max-height: 5rem; object-fit: contain; margin: 1rem auto 0; }
.history-now-tag { display: block; margin-top: .8rem; font: 600 .8rem/1.7 var(--m-jp); letter-spacing: .15em; }

.marini-clinic-contact { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding-bottom: clamp(2rem, 4vw, 4rem); border-top: 1px solid var(--m-line); }
.marini-clinic-contact h2 { margin: 0 0 .8rem; font-size: clamp(1.7rem, 2.5vw, 2.5rem); }
.marini-clinic-contact p:last-child { max-width: 43rem; margin: 0; color: #c3d4ca; font-size: .92rem; line-height: 1.9; }
.marini-clinic-contact .section-tag { display: block; margin-bottom: .8rem; font: 700 .7rem/1.5 var(--m-sans); letter-spacing: .2em; }
.marini-contact { margin-top: 0; }
.marini-social-link { display:inline-flex; align-items:center; justify-content:center; min-width:2.4rem; min-height:2.4rem; }
.marini-social-link svg { display:block; width:1.25rem; height:1.25rem; }
.marini-social-link:focus-visible { outline:2px solid currentColor; outline-offset:3px; }
.marini-footer .marini-social-link { align-self:center; }
.history-now.history-now-editorial > .history-year { font-size:clamp(5.5rem,10vw,10rem); line-height:.95; }
.history-now.history-now-editorial { max-width:62rem; gap:clamp(2rem,5vw,5rem); }
.history-now-copy { padding-left:clamp(2rem,4vw,4rem); }
.values-section .value-coexistence { background-position:65% 50%; }
.technology-editorial .pointcare-selection,.technology-editorial .science-hyla { border-inline-start:6px solid #0b4644; }
.science-story.ingredient-story .science-texture { overflow:visible; }
.science-story.ingredient-story .science-texture img { width:88%; margin-inline:auto; transform:rotate(-5deg); }
.science-hyla .science-texture { background:#edf2ed; }
.science-hyla .science-texture img { width:100%; aspect-ratio:4/5; object-fit:cover; object-position:center; -webkit-mask-image:none; mask-image:none; }
.chart-options article { padding:1rem; background:#f9fbf8; border:1px solid #d3e3db; border-top:3px solid #34756a; }
.chart-options article.chart-tier-featured { border:1px solid #70a897; border-left:6px solid #0b4644; background:#e0efe8; box-shadow:0 8px 24px rgba(7,59,55,.08); }
.chart-tier-featured .chart-tier::after { display:inline-block; content:'MARINI RECOMMENDED'; margin-left:.7rem; padding:.25rem .55rem; border-radius:1rem; color:#fff; background:#0b4644; font:700 .55rem/1.5 var(--m-sans); vertical-align:middle; letter-spacing:.08em; }
.finder-card > img { width:100%; aspect-ratio:1; object-fit:contain; background:#fff; }

@media (max-width: 800px) {
  .marini-hero-media .hero-montage { width: 100%; height: 100%; }
  .technology-editorial .science-story,
  .technology-editorial .science-story:nth-child(1),
  .technology-editorial .science-story:nth-child(2),
  .technology-editorial .science-story:nth-child(3) { grid-template-columns: minmax(0, 1fr); grid-template-rows: auto; }
  .technology-editorial .science-story .science-story-heading,
  .technology-editorial .science-story .science-texture,
  .technology-editorial .science-story .science-story-content { grid-column: 1; grid-row: auto; }
  .science-texture img { height:auto; }
  .marini-clinic-contact { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 600px) {
  .marini-hero-copy .marini-hero-agent { max-width: 18rem; }
  .marini-history { width: calc(100% - 2.5rem); margin-top: 4rem; padding: 2rem 1.2rem; }
  .history-intro { margin-bottom: 2rem; text-align: left; }
  .history-timeline { padding-left: 1.4rem; }
  .history-timeline::before { left: .38rem; }
  .history-event,.history-event:nth-child(even) { width: 100%; margin-left: 0; padding: 0 0 2.2rem 1rem; text-align: left; }
  .history-event::before,.history-event:nth-child(even)::before { top: .7rem; right: auto; left: -1.52rem; }
  .history-event:nth-child(odd) p { margin-left: 0; }
  .history-year { font-size: 2.4rem; }
  .history-reach { margin-top: .5rem; }
  .retinol-diagram ul { grid-template-columns: minmax(0, 1fr); }
  .hyla-types { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .science-ingredient-grid { grid-template-columns: minmax(0,1fr); }
  .science-ingredient-card + .science-ingredient-card { border-left: 0; border-top: 1px solid #9fbeae; }
  .history-california { margin-left:0; }
  .history-brand-transition { justify-content: flex-start; }
  .marini-clinic-contact .marini-button { width: 100%; min-width: 0; }
  .marini-utility-links .marini-social-link { min-width:2.75rem; min-height:2.75rem; }
  .values-section .value-integrity { aspect-ratio:4/3; background-position:center 27%; }
  .values-section .value-coexistence { background-position:68% 50%; }
  .chart-tier-featured .chart-tier::after { display:block; width:max-content; margin:.4rem 0 0; }
}

/* Latest client review: keep each Japanese set together in the finder and chart. */
.finder-card > .finder-set-photo {
  flex: none;
  display: block;
  width: 100%;
  aspect-ratio: 16 / 7;
  padding: 0;
  background: #fff;
}
.finder-card .finder-set-photo img,
.chart-product .finder-set-photo img {
  position: absolute;
  display: block;
  max-width: none;
  height: auto;
  aspect-ratio: auto;
  object-fit: unset;
  background: transparent;
}
.finder-card .finder-set-photo .catalogue-set-original,
.chart-product .finder-set-photo .catalogue-set-original { width: 100%; top: -75%; left: 0; }
.finder-card .finder-set-photo .catalogue-set-current-spf,
.chart-product .finder-set-photo .catalogue-set-current-spf {
  width: 36.5%;
  top: 17.857%;
  left: 68.125%;
}
.chart-product-set .finder-set-photo { flex: 0 0 9rem; width: 9rem; height: auto; aspect-ratio: 16 / 7; }
.chart-product-set { align-items: center; }
@media (max-width: 600px) {
  .chart-product-set .finder-set-photo { flex-basis: 7rem; width: 7rem; }
}

/* Product textures are supplied cutouts; keep their natural edge. */
.science-story.ingredient-story .science-texture img[src*="texture-c-esta"] {
  width: 92%;
  transform: rotate(-3deg) scale(.96);
  -webkit-mask-image: linear-gradient(to right,#000 0%,#000 79%,transparent 100%);
  mask-image: linear-gradient(to right,#000 0%,#000 79%,transparent 100%);
}
.science-hyla .science-texture { background: transparent; }
.science-hyla .science-texture img {
  width: 100%;
  aspect-ratio: auto;
  object-fit: contain;
  -webkit-mask-image: none;
  mask-image: none;
}
.science-hyla .science-texture img[src*="texture-hyla3d"] { max-height: 38rem; }
.technology-editorial .pointcare-selection .retinol-diagram,
.technology-editorial .science-hyla .hyla-diagram {
  border: 1px solid #9fbeae;
  border-left: 5px solid #0b4644;
  background: #e9f0e8;
  padding: clamp(.8rem,1.8vw,1.5rem);
}
.technology-editorial .science-hyla .hyla-types { border-top-color: #9fbeae; }
.chart-options[data-tier-count="2"] { grid-template-columns: repeat(2,minmax(0,1fr)); }
@media (max-width: 650px) {
  .chart-options[data-tier-count="2"] { grid-template-columns: minmax(0,1fr); }
}
@media (max-width: 600px) {
  .values-section .value-integrity {
    aspect-ratio: 12 / 5;
    background-size: 100% auto;
    background-position: center top;
  }
  .values-section .value-coexistence { background-position: 82% 50%; }
}

/* October 1: lead the history from cumulative reach to the 2026 endpoint. */
.history-reach { max-width:32rem; margin-bottom:4rem; }
.history-reach::after { content:""; position:absolute; left:50%; top:100%; height:4rem; width:1px; background:#0b4644; }
.history-now.history-now-editorial { max-width:66rem; grid-template-columns:1.15fr 1fr; padding:3rem 1rem 1rem; border-top:2px solid #0b4644; }
.history-now.history-now-editorial > .history-year { font-size:clamp(6rem,13vw,12rem); }
.history-now .history-now-tag { margin-top:0; }
.history-now .history-japan-logo { display:block; width:15rem; height:auto; max-width:100%; aspect-ratio:1; background:none; margin:1rem 0 0; }
.history-brand-transition { display:grid; grid-template-columns:minmax(0,.7fr) auto minmax(0,1.3fr); gap:1rem; width:100%; max-width:24rem; margin-left:auto; }
.history-brand-transition .history-new-logo { width:100%; max-width:13rem; height:auto; aspect-ratio:1; padding:0; }
.history-brand-transition .history-old-logo { width:100%; max-width:7rem; height:5rem; }
.history-now-copy { text-align:center; }
.history-now .history-japan-logo { margin:1rem auto 0; }

/* All three ingredient panels share the same outline and left accent. */
.technology-editorial .ingredient-story .science-ingredient-grid {
  border:1px solid #9fbeae; border-left:5px solid #0b4644;
  background:#e9f0e8; padding:clamp(.8rem,1.8vw,1.5rem);
}
.technology-editorial .ingredient-story .science-ingredient-card { padding:.25rem .75rem; }
.hyla-peptide-inline { margin-top:.75rem; padding-top:.8rem; border-top:1px solid #9fbeae; }
.hyla-peptide-inline .science-ingredient-en { display:inline-block; margin-right:.6rem; }
.hyla-peptide-inline strong { display:inline-block; font-size:.85rem; }
.hyla-peptide-inline p { margin:.4rem 0 0; font-size:.78rem; }
.science-hyla .science-texture img { display:block; width:100%; max-height:none; aspect-ratio:1; object-fit:contain; }
.science-hyla .science-texture img[src*="texture-hyla3d"] {
  max-height:none;
  -webkit-mask-image:linear-gradient(to right,transparent,#000 12%,#000 88%,transparent),linear-gradient(to bottom,transparent,#000 12%,#000 88%,transparent);
  mask-image:linear-gradient(to right,transparent,#000 12%,#000 88%,transparent),linear-gradient(to bottom,transparent,#000 12%,#000 88%,transparent);
  -webkit-mask-composite:source-in;
  mask-composite:intersect;
}
.product-feature .hyla-lifestyle-crop { width:100%; height:auto; min-height:0; aspect-ratio:1; object-fit:contain; background:#eee; }

/* Give the five current Japanese products space without changing the colorway. */
.system-card > .set-montage,
.product-hero-set .product-packshot > .set-montage {
  padding:clamp(1rem,3vw,2.5rem) 8%; gap:.25rem; background:#fff;
}
/* The original Light to Medium photo includes the entire crimped tube seal.
   Its product is slightly off-centre: reserve width for both upper corners,
   instead of horizontally clipping it in five equally narrow cover columns. */
.set-montage { grid-template-columns:repeat(4,minmax(0,1fr)) minmax(0,1.3fr); }
.set-montage img[src*="marini-spf45-light-to-medium"],
.marini-site .product-image .set-montage img[src*="marini-spf45-light-to-medium"] {
  object-position:46% 54%; transform:none; mix-blend-mode:normal;
}

/* Match the square single-product image area; inset the original set composition. */
.finder-card > .finder-set-photo { display:flex; align-items:center; justify-content:center; aspect-ratio:1; }
.finder-set-composition { position:relative; flex:none; width:84%; aspect-ratio:16/7; overflow:hidden; background:#fff; }
.chart-product-set .finder-set-photo { display:flex; align-items:center; justify-content:center; aspect-ratio:1; background:#fff; }
.chart-product-set .finder-set-composition { width:88%; }
.finder-filters button[data-filter^="concern-"] img { display:none; }

/* Additional unnumbered reference: use the supplied photo, not the five-bottle montage. */
.systems-image.systems-editorial-photo { background-image:none; overflow:hidden; }
.systems-editorial-photo > img { display:block; width:100%; height:100%; object-fit:cover; object-position:center 52%; }
@media(max-width:800px) {
  .history-now.history-now-editorial { grid-template-columns:1fr; gap:1.5rem; padding:2rem 0 0; }
  .history-now.history-now-editorial .history-now-copy { padding:1rem 0 0; }
  .history-now .history-japan-logo { width:12rem; margin-inline:auto; }
  .systems-editorial-photo > img { min-height:0; aspect-ratio:4/5; height:auto; object-fit:cover; }
}
@media(max-width:600px) {
  .history-brand-transition { gap:.65rem; }
  .history-brand-transition .history-new-logo { width:100%; max-width:9rem; height:auto; }
  .history-brand-transition .history-old-logo { width:100%; max-width:5rem; }
  .history-reach { margin-bottom:3rem; }
  .history-reach::after { height:3rem; }
  .history-now.history-now-editorial > .history-year { font-size:clamp(5rem,23vw,7.5rem); }
  .technology-editorial .ingredient-story .science-ingredient-card + .science-ingredient-card { margin-top:.6rem; padding-top:.8rem; }
}