/* Warm tone layer: white stays the base, a soft taupe carries selected sections and open states.
   Green (--jade) is kept for small accents only: status tags, labels, marks. */
:root{--taupe:#ECE6DE;--taupe-soft:#F5F1EB;--taupe-line:#D8CFC4}

/* Open rows rest on taupe instead of a green tint */
.field-disclosure[open]{background:var(--taupe)}
.fm-row[open] .fm-body{background:var(--taupe-soft);padding-left:28px;padding-right:28px}
.fm-row[open] .fm-meta-card{background:rgba(255,255,255,.55);border-color:var(--taupe-line)}

/* Section rhythm on the redesigned pages */
.htd-position,.wt-how,.wt-partners{background:var(--taupe)!important}
.wt-how .wt-spec,.wt-how .wt-spec:last-child,.wt-partners .partner-grid,.wt-partners .partner-field{border-color:var(--taupe-line)}

/* Humane Technology by Design hero: text on the right on larger screens, clear of the face */
@media(min-width:1024px){
  .field-hero.hero-right .field-heading,.field-hero.hero-right .field-stage{align-self:flex-end;width:min(44%,640px);max-width:none}
  .field-hero.hero-right .field-heading h1{max-width:18ch}
  .field-hero.hero-right .field-intro,.field-hero.hero-right .field-intro p{max-width:none}
  .field-hero.hero-right::after{background:linear-gradient(270deg,rgba(16,25,25,.78),rgba(16,25,25,.45) 45%,rgba(16,25,25,.08) 75%),linear-gradient(0deg,rgba(16,25,25,.6),transparent 40%)}
}

/* Currently: the logo's square pulses as a quiet live signal */
.field-header .logo-slot.logo-live{position:relative;display:block;filter:none}
.field-header .logo-slot.logo-live img{filter:brightness(0) invert(1)}
.logo-live::after{content:"";position:absolute;left:0;top:76.2%;width:14.5%;height:23.8%;background:var(--jade);animation:fo-live 2.4s ease-in-out infinite;pointer-events:none}
@keyframes fo-live{0%,100%{opacity:0}45%,60%{opacity:1}}
@media(prefers-reduced-motion:reduce){.logo-live::after{animation:none;opacity:1}}

/* Heroes on phones: the poster image stands in for the film */
.hero-static{object-fit:cover}
@media(max-width:1023px){.field-hero.hero-right .hero-static{object-position:32% center}}

/* Services hero: the bright forest film shows without the dark layer; text, menu and logo turn dark */
.field-hero.hero-light::after{display:none}
.field-hero.hero-light,.field-hero.hero-light .field-heading h1,.field-hero.hero-light .field-heading .eyebrow,.field-hero.hero-light .field-intro p,.field-hero.hero-light .field-foot p,.field-hero.hero-light .field-header a,.field-hero.hero-light .field-header .menu-dropdown a{color:#151313!important}
.field-hero.hero-light .field-header .logo-slot{filter:brightness(0)}
.field-hero.hero-light .field-header .menu-toggle span{background:#151313}
.field-hero.hero-light .field-header .menu-dropdown.open{background:#f5f1eb;border-color:#d8cfc4}
.field-hero.hero-light .field-header .menu-dropdown a[aria-current],.field-hero.hero-light .field-header .menu-dropdown a.active{border-color:#151313}
/* A light taupe veil on the text side keeps dark copy legible over the busy forest */
.field-hero.hero-light::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(245,241,235,.78),rgba(245,241,235,.45) 40%,rgba(245,241,235,0) 70%)}
@media(max-width:1023px){.field-hero.hero-light::before{background:rgba(245,241,235,.62)}}
