/* Cementare V69 — color detail pages, site-aligned without changing content.
   Scope: only body.ct-color-detail. Existing images, gallery items and text stay intact. */
body.ct-color-detail{
  background:#f3f0e9;
  color:#302b25;
  font-family:Arial,Helvetica,sans-serif;
}

/* Keep the original color hero image, but bring its scale into the current secondary-page rhythm. */
body.ct-color-detail section.header5.mbr-fullscreen{
  position:relative!important;
  min-height:clamp(430px,57vh,610px)!important;
  height:auto!important;
  padding:0!important;
  margin:0!important;
  background-size:cover!important;
  background-position:center center!important;
  overflow:hidden!important;
}
body.ct-color-detail section.header5.mbr-fullscreen::after{
  content:"";
  position:absolute;
  z-index:1;
  left:0;right:0;bottom:0;
  height:22%;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(243,240,233,0),rgba(243,240,233,.58));
}
body.ct-color-detail section.header5.mbr-fullscreen>.container{
  position:relative;
  z-index:2;
}

/* The semantic color H1 already exists on every page; reveal it as the editorial page title. */
body.ct-color-detail .mbr-gallery{
  background:#f3f0e9!important;
  padding:56px 0 94px!important;
}
body.ct-color-detail .mbr-gallery>h1.cementare-color-title{
  position:relative!important;
  width:min(1380px,calc(100% - 96px))!important;
  height:auto!important;
  margin:0 auto 34px!important;
  padding:0!important;
  overflow:visible!important;
  clip:auto!important;
  clip-path:none!important;
  white-space:normal!important;
  border:0!important;
  display:block!important;
  text-align:left!important;
  font-family:Georgia,"Times New Roman",serif!important;
  font-size:clamp(46px,4.2vw,66px)!important;
  font-weight:400!important;
  line-height:1!important;
  letter-spacing:-.038em!important;
  color:#2e2923!important;
  text-transform:none!important;
}
body.ct-color-detail .mbr-gallery>h1.cementare-color-title::before{
  content:"RENK";
  display:block;
  margin:0 0 15px;
  font-family:Arial,Helvetica,sans-serif;
  font-size:10px;
  font-weight:600;
  line-height:1.2;
  letter-spacing:.22em;
  color:#8b806c;
}
body.ct-color-detail .mbr-gallery>h1.cementare-color-title::after{
  content:"";
  display:block;
  width:44px;
  height:1px;
  margin-top:19px;
  background:rgba(177,163,116,.78);
}

/* Preserve the existing gallery; only refine scale, whitespace and hover tactility. */
body.ct-color-detail .mbr-gallery-row{
  width:min(1380px,calc(100% - 96px))!important;
  margin:0 auto!important;
}
body.ct-color-detail .mbr-gallery-layout-default{
  width:100%!important;
}
body.ct-color-detail .mbr-gallery-item{
  padding:7px!important;
}
body.ct-color-detail .mbr-gallery-item>div{
  overflow:hidden!important;
  background:#e9e3d9!important;
  aspect-ratio:4 / 3!important;
}
body.ct-color-detail .mbr-gallery-item img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center center!important;
  transition:transform .48s cubic-bezier(.22,.61,.36,1),opacity .28s ease!important;
}
@media (hover:hover){
  body.ct-color-detail .mbr-gallery-item>div:hover img{transform:scale(1.012)!important;}
}
body.ct-color-detail .mbr-gallery .icon-focus{
  opacity:.72!important;
}

/* Current footer should flow directly from the gallery without legacy Mobirise gaps. */
body.ct-color-detail .c8-footer{margin-top:0!important;}

@media(max-width:1100px){
  body.ct-color-detail section.header5.mbr-fullscreen{min-height:clamp(390px,50vh,520px)!important;}
  body.ct-color-detail .mbr-gallery>h1.cementare-color-title,
  body.ct-color-detail .mbr-gallery-row{width:min(100% - 48px,1380px)!important;}
}
@media(max-width:700px){
  body.ct-color-detail section.header5.mbr-fullscreen{min-height:360px!important;}
  body.ct-color-detail .mbr-gallery{padding:40px 0 70px!important;}
  body.ct-color-detail .mbr-gallery>h1.cementare-color-title,
  body.ct-color-detail .mbr-gallery-row{width:min(100% - 30px,1380px)!important;}
  body.ct-color-detail .mbr-gallery>h1.cementare-color-title{font-size:clamp(38px,11vw,50px)!important;margin-bottom:24px!important;}
  body.ct-color-detail .mbr-gallery-item{padding:4px!important;}
}


/* Cementare V70 — premium editorial refresh for color detail pages.
   Scope: only body.ct-color-detail. Keeps existing content + lightbox, upgrades hero-alt gallery rhythm. */
body.ct-color-detail .mbr-gallery{
  padding:64px 0 112px!important;
  background:#f3f0e9!important;
}
body.ct-color-detail .mbr-gallery>h1.cementare-color-title{
  width:min(1320px,calc(100% - 96px))!important;
  margin:0 auto 28px!important;
  font-size:clamp(48px,4.2vw,68px)!important;
}
body.ct-color-detail .mbr-gallery>h1.cementare-color-title::before{
  content:"RENK";
  margin:0 0 14px;
  letter-spacing:.21em;
}
html[lang="en"] body.ct-color-detail .mbr-gallery>h1.cementare-color-title::before{
  content:"COLOUR";
}
body.ct-color-detail .mbr-gallery>h1.cementare-color-title::after{
  width:34px;
  margin-top:17px;
  background:rgba(177,163,116,.76);
}
body.ct-color-detail .mbr-gallery-row{
  width:min(1320px,calc(100% - 84px))!important;
  margin:0 auto!important;
}
body.ct-color-detail .mbr-gallery-layout-default,
body.ct-color-detail .mbr-gallery-layout-default>div,
body.ct-color-detail .mbr-gallery-layout-default>div>div{
  width:100%!important;
  overflow:visible!important;
}
body.ct-color-detail .mbr-gallery-layout-default>div>div{
  margin-left:-10px!important;
  margin-right:-10px!important;
  font-size:0!important;
}
body.ct-color-detail .mbr-gallery-item{
  width:33.333333%!important;
  padding:10px!important;
  vertical-align:top!important;
}
body.ct-color-detail .mbr-gallery-item>div{
  position:relative!important;
  overflow:hidden!important;
  border-radius:clamp(18px,1.45vw,24px)!important;
  background:#e8e1d6!important;
  box-shadow:0 1px 0 rgba(76,58,34,.05), 0 20px 42px rgba(58,45,30,.08)!important;
  aspect-ratio:4 / 3!important;
}
body.ct-color-detail .mbr-gallery-item:nth-child(6n+2)>div,
body.ct-color-detail .mbr-gallery-item:nth-child(6n+5)>div{
  aspect-ratio:4 / 5!important;
}
body.ct-color-detail .mbr-gallery-item:nth-child(6n+3)>div{
  aspect-ratio:1 / 1!important;
}
body.ct-color-detail .mbr-gallery-item:nth-child(6n)>div{
  aspect-ratio:5 / 4!important;
}
body.ct-color-detail .mbr-gallery-item>div::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,0) 38%, rgba(27,18,10,.07) 100%);
  opacity:0;
  transition:opacity .35s ease;
}
body.ct-color-detail .mbr-gallery-item img{
  display:block!important;
  width:100%!important;
  height:100%!important;
  object-fit:cover!important;
  object-position:center center!important;
  transition:transform .6s cubic-bezier(.22,.61,.36,1), filter .3s ease!important;
}
@media (hover:hover){
  body.ct-color-detail .mbr-gallery-item>div:hover img{
    transform:scale(1.018)!important;
    filter:saturate(1.01)!important;
  }
  body.ct-color-detail .mbr-gallery-item>div:hover::after{opacity:.95!important;}
}
body.ct-color-detail .mbr-gallery .icon-focus{
  left:50%!important;
  top:50%!important;
  transform:translate(-50%,-50%)!important;
  margin:0!important;
  font-size:2.4rem!important;
  opacity:0!important;
  transition:opacity .26s ease!important;
}
body.ct-color-detail .mbr-gallery-item>div:hover .icon-focus{opacity:.82!important;}
body.ct-color-detail .mbr-gallery-item .icon-focus::before{text-shadow:0 10px 26px rgba(0,0,0,.20);}
body.ct-color-detail .c8-footer{margin-top:0!important;}

@media (max-width:1100px){
  body.ct-color-detail .mbr-gallery{padding:54px 0 92px!important;}
  body.ct-color-detail .mbr-gallery>h1.cementare-color-title,
  body.ct-color-detail .mbr-gallery-row{width:min(100% - 48px,1320px)!important;}
  body.ct-color-detail .mbr-gallery-item{width:50%!important;padding:8px!important;}
  body.ct-color-detail .mbr-gallery-layout-default>div>div{margin-left:-8px!important;margin-right:-8px!important;}
}
@media (max-width:700px){
  body.ct-color-detail .mbr-gallery{padding:40px 0 70px!important;}
  body.ct-color-detail .mbr-gallery>h1.cementare-color-title,
  body.ct-color-detail .mbr-gallery-row{width:min(100% - 30px,1320px)!important;}
  body.ct-color-detail .mbr-gallery>h1.cementare-color-title{font-size:clamp(38px,11vw,50px)!important;margin-bottom:22px!important;}
  body.ct-color-detail .mbr-gallery-layout-default>div>div{margin-left:-6px!important;margin-right:-6px!important;}
  body.ct-color-detail .mbr-gallery-item{width:100%!important;padding:6px!important;}
  body.ct-color-detail .mbr-gallery-item>div,
  body.ct-color-detail .mbr-gallery-item:nth-child(6n+2)>div,
  body.ct-color-detail .mbr-gallery-item:nth-child(6n+5)>div,
  body.ct-color-detail .mbr-gallery-item:nth-child(6n+3)>div,
  body.ct-color-detail .mbr-gallery-item:nth-child(6n)>div{aspect-ratio:4 / 3!important;}
}