/*
  Junk2Go character and brand placement layer — R4
  Visual-only integration. No JavaScript, PHP, booking, pricing, upload,
  payment, coupon, contact, API, or server-side logic is changed.
*/

body.j2g-cartoon-enhanced .brand{
  flex:0 0 auto;
  min-width:170px;
}
body.j2g-cartoon-enhanced .brand img.j2g-header-logo{
  display:block;
  height:48px!important;
  width:auto!important;
  max-width:205px;
  object-fit:contain;
  filter:drop-shadow(0 8px 16px rgba(0,0,0,.24))!important;
}

/* The full brand mark, including the small green cart/bin symbol, is repeated
   in the footer so the logo is never reduced to plain text. */
.j2g-footer-logo{
  display:block;
  width:auto;
  height:44px;
  max-width:210px;
  margin:0 0 12px;
  object-fit:contain;
  filter:drop-shadow(0 8px 16px rgba(0,0,0,.18));
}
.footer .j2g-footer-logo + h4{display:none}

/* Friendly homepage hero image crop. */
.j2g-featured-hero-card .j2g-featured-hero-image{
  object-position:center center!important;
}

/* Re-enable only the intentionally placed character assets. The previous R2
   stylesheet hid repeated mascots; R4 uses named, context-specific placements. */
body.j2g-cartoon-enhanced .j2g-photo-mascot,
body.j2g-cartoon-enhanced .j2g-section-head-mascot{
  display:block!important;
}
body.j2g-cartoon-enhanced .j2g-photo-layout--with-character{
  grid-template-columns:minmax(0,1fr) minmax(230px,330px)!important;
}
body.j2g-cartoon-enhanced .j2g-photo-layout--with-character .j2g-photo-mascot{
  width:min(315px,100%);
  max-height:385px;
  object-fit:contain;
  object-position:center bottom;
  justify-self:center;
  align-self:end;
  margin:0 0 -24px;
  filter:drop-shadow(0 20px 28px rgba(2,38,23,.20));
}
body.j2g-cartoon-enhanced #contact .section-head{
  position:relative;
  min-height:135px;
  align-items:center;
  overflow:visible;
}
body.j2g-cartoon-enhanced #contact .j2g-section-head-mascot{
  width:150px;
  height:170px;
  max-height:none;
  object-fit:contain;
  object-position:center bottom;
  margin:-28px 16px -25px auto;
  filter:drop-shadow(0 16px 24px rgba(2,38,23,.16));
}

/* Internal SEO-page character panels. */
.seo-hero-panel.j2g-character-panel{
  position:relative;
  isolation:isolate;
  min-height:340px;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(150px,43%);
  align-items:end;
  gap:10px;
  padding:26px 12px 0 26px!important;
  overflow:hidden;
  background:
    radial-gradient(circle at 78% 18%,rgba(134,196,64,.28),transparent 34%),
    linear-gradient(145deg,#ffffff 0%,#f3faf2 62%,#e6f3e4 100%)!important;
  border-color:rgba(15,143,59,.20)!important;
}
.seo-hero-panel.j2g-character-panel::before{
  content:"";
  position:absolute;
  z-index:-1;
  width:230px;
  height:230px;
  border-radius:50%;
  right:-74px;
  bottom:-84px;
  background:rgba(15,143,59,.08);
}
.j2g-character-panel__copy{
  align-self:center;
  padding:0 0 28px;
  position:relative;
  z-index:2;
}
.j2g-character-panel__copy h2{
  margin:0 0 10px;
  color:#123f26;
  font-size:clamp(22px,2.3vw,29px);
  line-height:1.12;
}
.j2g-character-panel__copy p{
  margin:0 0 10px;
  color:#4b6254;
  line-height:1.55;
}
.j2g-character-panel__copy .seo-text-link{display:inline-flex;margin-top:4px}
.j2g-character-panel__image{
  display:block;
  width:100%;
  height:auto;
  max-height:330px;
  object-fit:contain;
  object-position:center bottom;
  align-self:end;
  justify-self:center;
  filter:drop-shadow(0 20px 26px rgba(2,38,23,.20));
}
.seo-hero-panel.j2g-character-panel--team{
  grid-template-columns:minmax(0,.88fr) minmax(175px,1.12fr);
}
.seo-hero-panel.j2g-character-panel--team .j2g-character-panel__image{
  max-height:315px;
}
.seo-hero-panel.j2g-character-panel--wide{
  grid-template-columns:1fr;
  padding:24px 20px 0!important;
}
.seo-hero-panel.j2g-character-panel--wide .j2g-character-panel__copy{
  padding:0 6px 8px;
}
.seo-hero-panel.j2g-character-panel--wide .j2g-character-panel__image{
  width:100%;
  max-height:245px;
  object-fit:contain;
}

/* Homepage services band now uses the transparent male/female team instead of
   another full website mockup. */
.j2g-feature-band__media.j2g-feature-band__media--character{
  display:grid;
  place-items:end center;
  min-height:390px;
  padding:18px 12px 0;
  background:
    radial-gradient(circle at 52% 20%,rgba(134,196,64,.22),transparent 38%),
    linear-gradient(145deg,#f8fcf7,#e7f3e5)!important;
}
.j2g-feature-band__media.j2g-feature-band__media--character img{
  position:relative!important;
  width:100%!important;
  height:auto!important;
  max-height:380px;
  object-fit:contain!important;
  object-position:center bottom!important;
  filter:drop-shadow(0 22px 28px rgba(2,38,23,.19));
}

/* Home confidence section: a softer male/female local team. */
.j2g-confidence-visual.j2g-confidence-visual--character{
  min-height:410px;
  display:grid;
  place-items:end center;
  padding:60px 14px 0;
  background:
    radial-gradient(circle at 50% 20%,rgba(134,196,64,.23),transparent 40%),
    linear-gradient(145deg,#0a4328,#052d1c)!important;
}
.j2g-confidence-visual.j2g-confidence-visual--character::after{content:none!important}
.j2g-confidence-visual.j2g-confidence-visual--character img{
  position:relative!important;
  inset:auto!important;
  width:auto!important;
  height:auto!important;
  max-width:100%;
  max-height:360px!important;
  object-fit:contain!important;
  object-position:center bottom!important;
  filter:drop-shadow(0 26px 32px rgba(0,0,0,.30))!important;
}
.j2g-confidence-visual.j2g-confidence-visual--character .j2g-confidence-visual__label{
  top:16px!important;
  bottom:auto!important;
  max-width:320px!important;
}

/* About page uses the friendly team and a separate carrying-box asset. */
.j2g-about-visual.j2g-about-visual--character{
  min-height:470px;
  display:grid;
  place-items:end center;
  overflow:hidden;
  padding:18px 14px 0;
  background:
    radial-gradient(circle at 52% 18%,rgba(134,196,64,.26),transparent 38%),
    linear-gradient(145deg,#f8fcf7,#e4f1e2);
}
.j2g-about-visual.j2g-about-visual--character .j2g-about-character{
  position:relative!important;
  inset:auto!important;
  display:block;
  width:auto!important;
  height:auto!important;
  max-width:100%!important;
  max-height:445px;
  object-fit:contain!important;
  object-position:center bottom!important;
  transform:none!important;
  filter:drop-shadow(0 24px 30px rgba(2,38,23,.20))!important;
}
.j2g-about-band.j2g-about-band--with-character{
  grid-template-columns:minmax(0,1fr) minmax(220px,330px)!important;
  align-items:end;
  overflow:hidden;
  padding-right:16px;
}
.j2g-about-band__character{
  display:block;
  width:100%;
  height:auto;
  max-height:340px;
  object-fit:contain;
  object-position:center bottom;
  align-self:end;
  margin-bottom:-24px;
  filter:drop-shadow(0 20px 28px rgba(2,38,23,.18));
}

/* Services-page team band. */
.j2g-inline-character-band{
  display:grid;
  grid-template-columns:minmax(0,.92fr) minmax(340px,1.08fr);
  align-items:stretch;
  overflow:hidden;
  border:1px solid rgba(15,23,42,.10);
  border-radius:24px;
  background:
    radial-gradient(circle at 78% 18%,rgba(134,196,64,.18),transparent 34%),
    linear-gradient(135deg,#fff 0%,#f0f8ef 100%);
  box-shadow:0 18px 38px rgba(2,38,23,.09);
}
.j2g-inline-character-band__copy{
  align-self:center;
  padding:32px;
}
.j2g-character-kicker{
  display:block;
  color:#0b6b2a;
  font-size:12px;
  font-weight:900;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.j2g-inline-character-band__copy h2{
  margin:8px 0 10px;
  font-size:clamp(27px,3vw,40px);
  line-height:1.08;
}
.j2g-inline-character-band__copy p{color:var(--muted);max-width:60ch}
.j2g-inline-character-band__media{
  min-height:385px;
  display:grid;
  place-items:end center;
  padding:20px 12px 0;
  background:linear-gradient(145deg,#eef8ec,#dfeedd);
}
.j2g-inline-character-band__image{
  display:block;
  width:100%;
  height:auto;
  max-height:370px;
  object-fit:contain;
  object-position:center bottom;
  filter:drop-shadow(0 22px 30px rgba(2,38,23,.19));
}

@media(max-width:980px){
  body.j2g-cartoon-enhanced .brand{min-width:auto}
  body.j2g-cartoon-enhanced .brand img.j2g-header-logo{height:43px!important;max-width:180px}
  body.j2g-cartoon-enhanced .j2g-photo-layout--with-character{grid-template-columns:1fr minmax(210px,280px)!important}
  .seo-hero-panel.j2g-character-panel{grid-template-columns:minmax(0,1fr) minmax(150px,38%)}
  .j2g-inline-character-band{grid-template-columns:1fr}
  .j2g-inline-character-band__media{min-height:330px}
  .j2g-about-band.j2g-about-band--with-character{grid-template-columns:1fr minmax(190px,270px)!important}
}

@media(max-width:760px){
  body.j2g-cartoon-enhanced .brand img.j2g-header-logo{height:38px!important;max-width:155px}
  body.j2g-cartoon-enhanced .j2g-photo-layout--with-character{grid-template-columns:1fr!important}
  body.j2g-cartoon-enhanced .j2g-photo-layout--with-character .j2g-photo-mascot{
    width:min(260px,86%);
    max-height:300px;
    margin:4px auto -24px;
  }
  body.j2g-cartoon-enhanced #contact .section-head{min-height:0}
  body.j2g-cartoon-enhanced #contact .j2g-section-head-mascot{
    width:120px;height:135px;margin:-18px 4px -20px auto;
  }
  .seo-hero-panel.j2g-character-panel,
  .seo-hero-panel.j2g-character-panel--team,
  .seo-hero-panel.j2g-character-panel--wide{
    grid-template-columns:1fr;
    min-height:0;
    padding:24px 18px 0!important;
  }
  .j2g-character-panel__copy{padding:0 2px 4px}
  .j2g-character-panel__image,
  .seo-hero-panel.j2g-character-panel--team .j2g-character-panel__image,
  .seo-hero-panel.j2g-character-panel--wide .j2g-character-panel__image{
    width:min(100%,360px);
    max-height:285px;
  }
  .j2g-about-visual.j2g-about-visual--character{min-height:380px}
  .j2g-about-visual.j2g-about-visual--character .j2g-about-character{max-height:365px}
  .j2g-about-band.j2g-about-band--with-character{grid-template-columns:1fr!important;padding-right:22px}
  .j2g-about-band__character{width:min(285px,82%);justify-self:center;margin:0 auto -22px}
  .j2g-inline-character-band__copy{padding:24px}
  .j2g-inline-character-band__media{min-height:270px}
  .j2g-inline-character-band__image{max-height:275px}
  .j2g-feature-band__media.j2g-feature-band__media--character{min-height:300px}
  .j2g-feature-band__media.j2g-feature-band__media--character img{max-height:300px}
  .j2g-confidence-visual.j2g-confidence-visual--character{min-height:340px}
  .j2g-confidence-visual.j2g-confidence-visual--character img{max-height:300px!important}
}