/* AMANELA Living — PATCH 2.8.1
   Visual Balance & Mascot Refinement
   Rule: Photography leads. Illustration accompanies. */

:root{
  --al-accent-mascot-max:110px;
  --al-accent-mascot-mobile:78px;
}

/* 1) Keep Philosophy as the ONE strong character moment.
      Only refine scale/overlap so photography stays visible. */
.intro-scene-ami{width:186px!important;left:4px!important;top:142px!important}
.intro-scene-mela{width:205px!important;right:54px!important;top:6px!important}
.intro-scene-sunny{width:148px!important;right:20px!important;bottom:4px!important}
.intro-photo-main,.intro-stack .intro-photo{position:relative!important;z-index:2!important}
.intro-scene-ami,.intro-scene-mela,.intro-scene-sunny{z-index:4!important}
.intro-speech-bubble{z-index:5!important}

/* 2) Logo: slightly more present, not oversized. */
.brand-v28>img{width:304px!important}
.footer-brand-logo{width:286px!important;max-width:100%!important;height:auto!important}

/* 3) WHY AMANELA: figures remain narrators, never the card content. */
.mascot-story-card{grid-template-columns:92px 1fr!important;gap:16px!important;padding:20px!important}
.mascot-story-card img{width:88px!important;height:88px!important;object-fit:contain!important}
.why-mini-trio-art{height:94px!important}
.why-mini-trio-art img{height:90px!important;max-width:96px!important;object-fit:contain!important}
.why-mini-trio-art .ami{left:0!important}
.why-mini-trio-art .mela{left:68px!important}
.why-mini-trio-art .sunny{right:4px!important;height:78px!important}
.why-mini-trio{padding-bottom:104px!important;min-height:168px!important}

/* 4) SERVICES: compact narrator strip. Never allow natural PNG dimensions. */
.services-mascot-strip{
  display:grid!important;
  grid-template-columns:96px minmax(0,1fr) 96px!important;
  gap:18px!important;
  align-items:center!important;
  margin:4px auto 28px!important;
  padding:14px 22px!important;
  min-height:0!important;
  background:linear-gradient(135deg,rgba(255,253,248,.92),rgba(242,249,245,.92))!important;
  border:1px solid rgba(111,150,138,.17)!important;
  border-radius:24px!important;
  box-shadow:0 10px 24px rgba(35,55,55,.05)!important;
  overflow:hidden!important;
}
.services-mascot-strip>img,
.services-mascot-left,
.services-mascot-right{
  display:block!important;
  width:92px!important;
  max-width:92px!important;
  height:92px!important;
  max-height:92px!important;
  object-fit:contain!important;
  margin:0 auto!important;
  filter:drop-shadow(0 7px 12px rgba(49,65,62,.12))!important;
}
.services-mascot-copy{min-width:0!important;text-align:left!important}
.services-mascot-copy strong{display:block!important;margin:0 0 4px!important;font-size:1rem!important;line-height:1.35!important;color:#17383a!important}
.services-mascot-copy p{margin:0!important;font-size:.92rem!important;line-height:1.5!important;color:#536566!important}

/* Protect service photography as the leading visual. */
.service-module-card{overflow:hidden!important;box-shadow:0 14px 28px rgba(38,55,55,.11)!important}
.service-card-image{filter:none!important;transform:none!important}
.service-module-card:hover .service-card-image{transform:scale(1.025)!important;transition:transform .28s ease!important}

/* 5) CSR: real community imagery leads; character story becomes a compact aside. */
.csr-char-story{
  display:grid!important;
  grid-template-columns:180px minmax(0,1fr)!important;
  gap:24px!important;
  align-items:center!important;
  margin-top:20px!important;
  margin-bottom:30px!important;
  padding:18px 22px!important;
  min-height:0!important;
  background:rgba(255,255,255,.72)!important;
  border:1px solid rgba(111,150,138,.16)!important;
  border-radius:26px!important;
  overflow:hidden!important;
}
.csr-char-art{position:relative!important;width:180px!important;height:118px!important;min-height:0!important}
.csr-char-art img{position:absolute!important;display:block!important;width:auto!important;height:104px!important;max-width:90px!important;object-fit:contain!important;filter:drop-shadow(0 8px 14px rgba(49,65,62,.12))!important}
.csr-char-art .mela{left:44px!important;bottom:0!important}
.csr-char-art .ami{left:0!important;bottom:0!important}
.csr-char-art .sunny{right:0!important;bottom:4px!important;height:82px!important}
.csr-char-copy h3{margin:.15rem 0 .4rem!important;font-size:clamp(1.45rem,2vw,2rem)!important}
.csr-char-copy p{margin:0!important;max-width:58em!important}
.csr7x-feature-photo{box-shadow:0 16px 32px rgba(38,55,55,.12)!important}
.csr7x-feature-photo img{filter:none!important}

/* 6) EXPERIENCE: Ami is a small guide; the real hospitality photo leads. */
.char-solo{
  display:grid!important;
  grid-template-columns:88px minmax(0,1fr)!important;
  gap:14px!important;
  align-items:center!important;
  margin:18px 0!important;
  padding:13px 15px!important;
  min-height:0!important;
  border-radius:20px!important;
  background:#f7faf8!important;
  border:1px solid rgba(111,150,138,.15)!important;
}
.char-solo>img{
  width:82px!important;
  max-width:82px!important;
  height:82px!important;
  max-height:82px!important;
  object-fit:contain!important;
  margin:0!important;
  filter:drop-shadow(0 7px 12px rgba(49,65,62,.11))!important;
}
.char-solo strong{display:block!important;margin-bottom:4px!important}
.char-solo p{margin:0!important;line-height:1.5!important}
.exp25-visual{box-shadow:0 18px 38px rgba(38,55,55,.14)!important}
.exp25-visual>img{filter:none!important}

/* 7) Contact/Footer: friendly sign-off, not a second hero. */
.contact-char-thanks{
  display:grid!important;
  grid-template-columns:190px minmax(0,1fr)!important;
  gap:18px!important;
  align-items:center!important;
  min-height:0!important;
  padding:16px 18px!important;
  overflow:hidden!important;
}
.contact-char-art{position:relative!important;width:190px!important;height:104px!important;min-height:0!important}
.contact-char-art img{position:absolute!important;width:auto!important;height:92px!important;max-width:76px!important;object-fit:contain!important}
.contact-char-art .ami{left:0!important;bottom:0!important}
.contact-char-art .mela{left:58px!important;bottom:0!important}
.contact-char-art .sunny{right:0!important;bottom:4px!important;height:72px!important}
.footer-char-trio{display:flex!important;gap:4px!important;align-items:flex-end!important;margin-top:8px!important;height:50px!important;overflow:hidden!important}
.footer-char-trio img{width:auto!important;height:46px!important;max-width:42px!important;object-fit:contain!important}

/* 8) Real-image depth: subtle only, no fake filters. */
.exp25-visual,.csr7x-feature-photo,.service-module-card,.audience-card,.pilot-photo-card{
  isolation:isolate!important;
}

/* Tablet */
@media(max-width:1180px){
  .brand-v28>img{width:266px!important}
  .intro-scene-ami{width:158px!important}
  .intro-scene-mela{width:174px!important}
  .intro-scene-sunny{width:128px!important}
  .services-mascot-strip{grid-template-columns:82px minmax(0,1fr) 82px!important}
  .services-mascot-strip>img,.services-mascot-left,.services-mascot-right{width:78px!important;max-width:78px!important;height:78px!important;max-height:78px!important}
}

/* Mobile / small tablet */
@media(max-width:860px){
  .brand-v28>img{width:218px!important}
  .intro-scene-ami{width:116px!important}
  .intro-scene-mela{width:132px!important}
  .intro-scene-sunny{width:96px!important}
  .services-mascot-strip{grid-template-columns:72px minmax(0,1fr)!important;padding:12px 14px!important;gap:12px!important}
  .services-mascot-strip>img,.services-mascot-left,.services-mascot-right{width:68px!important;max-width:68px!important;height:68px!important;max-height:68px!important}
  .services-mascot-right{display:none!important}
  .csr-char-story{grid-template-columns:132px minmax(0,1fr)!important;padding:14px!important;gap:14px!important}
  .csr-char-art{width:132px!important;height:92px!important}
  .csr-char-art img{height:80px!important;max-width:66px!important}
  .csr-char-art .mela{left:32px!important}.csr-char-art .sunny{height:62px!important}
  .contact-char-thanks{grid-template-columns:130px minmax(0,1fr)!important}
  .contact-char-art{width:130px!important;height:82px!important}
  .contact-char-art img{height:70px!important;max-width:58px!important}.contact-char-art .mela{left:40px!important}.contact-char-art .sunny{height:54px!important}
}

@media(max-width:620px){
  .brand-v28>img{width:198px!important}
  .intro-scene-ami{width:96px!important}
  .intro-scene-mela{width:108px!important}
  .intro-scene-sunny{width:78px!important}
  .mascot-story-card{grid-template-columns:68px 1fr!important;padding:16px!important}
  .mascot-story-card img{width:64px!important;height:64px!important}
  .csr-char-story,.contact-char-thanks{grid-template-columns:1fr!important}
  .csr-char-art,.contact-char-art{width:150px!important;margin:0 auto!important}
  .csr-char-copy,.contact-char-copy{text-align:left!important}
  .footer-brand-logo{width:228px!important}
}