/* LifeMeilor — Secció Centre i Equip (front-end styles) */
.lmce-wrap{
  --lmce-accent:#0aa39f;
  --lmce-bg:#f3eadf;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:0;
  align-items:stretch;
  width:100%;
  /* max-width: min(1380px, 100%); */
  margin:0 auto;
  min-height:100vh;
  overflow:hidden;
  border-radius: 18px;
  font-family: "Greycliff CF", Sans-serif;
}

/* Left column */
.lmce-col--left{
  background: var(--lmce-bg);
  padding: clamp(48px, 4.5vw, 72px) clamp(40px, 4vw, 64px) clamp(56px, 5vw, 88px);
  display:flex;
  flex-direction: column;
  justify-content: flex-start;
  min-height:100%;
}

.lmce-title{
  font-size: clamp(32px, 4.2vw, 48px);
  line-height: 1.05;
  margin: 0 0 24px 0;
  letter-spacing: -0.02em;
}

/* Tabs generic container */
.lmce-tabs{
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:center; /* centered */
  margin: 8px 0 22px 0;
}

/* Pills for >2 */
.lmce-tab{
  display:inline-flex;
  align-items:center;
  gap:10px;
  font-weight:600;
  padding: 10px 18px;
  border-radius: 999px;
  border: 2px solid #111;
  position: relative;
  background:#fff;
  cursor:pointer;
}
.lmce-tab.is-active{
  background: #111;
  color: #fff;
  border-color:#111;
  box-shadow: inset 0 0 0 2px #111;
}

.lmce-desc{
  font-size: 17px;
  line-height: 1.6;
  margin: 10px 0 20px;
  max-width: 52ch;
}

/* Bullets */
.lmce-bullets{
  list-style:none;
  padding:0;
  margin: 8px 0 0 0;
  display:grid;
  gap:14px;
}
.lmce-bullets li{
  display:flex;
  gap:12px;
  align-items:flex-start;
  font-size: 17px;
}
.lmce-check{
  width:20px; height:20px; min-width:20px;
  display:inline-block;
  background: var(--lmce-accent);
  border-radius: 999px;
  position: relative;
  margin-top: 3px;
}
.lmce-check::after{
  content:"";
  position:absolute;
  width:6px; height:10px;
  border-right:2px solid #fff;
  border-bottom:2px solid #fff;
  transform: rotate(45deg);
  left:6px; top:3px;
}

/* Right column / image */
.lmce-col--right{
  position:relative;
  background:#000;
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  min-height:100%;
  display:flex;
  align-items:stretch;
}
.lmce-figure{
  position:relative;
  width:100%;
  height:100%;
  flex:1 1 auto;
  min-height:100%;
  overflow:hidden;
}
.lmce-photo{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transition: opacity .45s ease;
  display:block;
  opacity:1;
}
.lmce-photo.is-changing{
  opacity:0;
}

/* Segmented control for exactly 2 tabs */
.lmce-tabs--segmented{ margin: 8px 0 22px; display:flex; justify-content:left; }
.lmce-seg{
  position:relative;
  display:inline-grid;
  grid-template-columns: 1fr 1fr;
  align-items:center;
  min-height: 40px;
  padding: 4px;
  border-radius: 999px;
  border: 2px solid #111; /* never #c36 */
  background: transparent;
  overflow: hidden;
  isolation: isolate;
}
.lmce-seg__label{
  position:relative;
  z-index:2;
  padding: 8px 20px;
  text-transform: uppercase;
  letter-spacing: .06em;
  font-weight: 700;
  font-size: 13px;
  text-align:center;
  color:#111;
  user-select:none;
  white-space: nowrap;
  cursor:pointer;
}
.lmce-seg__label.is-active{ color:#fff; }
.lmce-seg__knob{
  content:"";
  position:absolute;
  z-index:1;
  top:4px; bottom:4px; left:4px;
  width: calc(50% - 0px);
  border-radius: 999px;
  background:#111;
  transition: transform .35s ease;
}
.lmce-seg.is-right .lmce-seg__knob{ transform: translateX(100%); }
.lmce-seg.is-left  .lmce-seg__knob{ transform: translateX(0%); }

/* Typography inheritance */
.lmce-wrap, .lmce-title, .lmce-tab, .lmce-desc, .lmce-bullets, .lmce-bullets li, .lmce-seg__label{
  font-family: "Greycliff CF", Sans-serif; 
}

/* Tab panes + stagger animations */
.lmce-panes{ position:relative; }
.lmce-pane{ display:none; }
.lmce-pane.is-active{ display:block; }
.lmce-anim{
  opacity: 0;
  transform: translateY(10px);
  will-change: opacity, transform;
}
.lmce-pane.is-active .lmce-anim{
  opacity:1;
  transform:none;
  transition: opacity .35s ease, transform .35s ease;
  transition-delay: var(--d, 0s);
}
.lmce-anim.is-entering{
  animation: lmceTextIn .55s cubic-bezier(.23,1,.32,1) forwards;
  animation-delay: var(--d, 0s);
}
.lmce-intro{
  opacity:0;
  transform: translateY(12px);
  animation: lmceIntro .55s ease forwards;
  animation-delay: var(--intro-delay, 0s);
}
@keyframes lmceIntro{
  to{ opacity:1; transform:none; }
}
@keyframes lmceTextIn{
  from{
    opacity:0;
    transform: translateY(20px);
  }
  to{
    opacity:1;
    transform:none;
  }
}

@media (prefers-reduced-motion: reduce){
  .lmce-anim,
  .lmce-intro{
    animation: none !important;
    transition: none !important;
    opacity:1 !important;
    transform:none !important;
  }
}

/* Remove any accidental #c36 borders inside the widget */
.lmce-wrap * { border-color: currentColor; }

/* Responsive */
@media (max-width: 1024px){
  .lmce-wrap{ grid-template-columns: 1fr; gap: 24px; }
  .lmce-col--left{ padding: 36px 26px 46px; order:1; }
  .lmce-col--right{ order:2; min-height: 520px; border-radius: 18px; overflow:hidden; }
  .lmce-title{ font-size: clamp(28px, 7vw, 42px); }
}

@media (max-width: 640px){
  .lmce-wrap{
    padding:10px;
    border-radius:22px;
    gap:16px;
  }
  .lmce-col--left{
    padding: 28px 18px 36px;
  }
  .lmce-col--right{
    min-height: 0;
    height:auto;
  }
  .lmce-figure{
    height:auto;
    min-height:0;
    aspect-ratio: 4 / 5;
  }
  .lmce-photo{
    position:absolute;
  }
}

@media (max-width: 640px){
  @supports not (aspect-ratio: 1 / 1){
    .lmce-figure{
      position:relative;
      padding-bottom: 125%;
    }
    .lmce-photo{
      position:absolute;
      inset:0;
      width:100%;
      height:100%;
      object-fit:cover;
    }
  }
}
