/* Small, maintained corrections on top of the recovered brand stylesheet. */
[hidden], dialog:not([open]) { display: none !important; }

/* Center the whole badge; auto width only used the space right of left: 50%. */
.scene-human { width: max-content; }

/* The original 56px heading overflows a 320px screen. */
@media (max-width: 600px) {
  .news-heading h1 { font-size: clamp(2.625rem, 12vw, 3.5rem); }
}

dialog.menu-sheet {
  position: fixed;
  inset: 0 0 0 auto;
  margin: 0;
  width: min(384px, 88vw);
  max-width: none;
  height: 100%;
  height: 100dvh;
  max-height: none;
  overflow-y: auto;
  overscroll-behavior: contain;
}
dialog.menu-sheet[open] { display: flex; flex-direction: column; gap: 16px; }
dialog .menu-close { position: absolute; top: 18px; right: 18px; padding: 10px; }
dialog::backdrop { background: #172b1899; backdrop-filter: blur(5px); }
dialog.press-reader[data-slot="dialog-content"] {
  position: fixed;
  inset: 0;
  margin: auto;
  translate: none;
  max-height: calc(100% - 20px);
}
.reader-close { min-height: 44px; }

/* Current screenshots stay fully visible; the linked service is the live demo. */
.case-views .phone-stage { height: 470px; align-items: center; padding-block: 20px; }
.case-views .phone-shell { width: min(265px, calc(100% - 42px)); }
.case-views .phone-screen { height: auto; }
.case-live-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 44px;
  padding: 10px 14px;
  border: 1px solid var(--dark-green);
  border-radius: 100px;
  font-family: var(--heading);
  font-size: .875rem;
  color: var(--dark-green);
  align-self: start;
}
.case-live-link:hover { background: #39742c0a; }
.case-live-link:focus-visible { outline: 3px solid var(--dark-green); outline-offset: 3px; }
.case-live-link svg { flex-shrink: 0; }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; }
}
.weekly-article { padding-block: clamp(3rem, 7vw, 7rem); }
.weekly-article article { max-width: 46rem; margin-inline: auto; }
.weekly-article h1 { font-size: clamp(2.2rem, 5vw, 4rem); line-height: 1.08; margin-block: 1.2rem 1.8rem; overflow-wrap: anywhere; }
.weekly-article article > p:not(.article-meta):not(.weekly-back) { font-family: Yrsa, Georgia, serif; font-size: clamp(1.4rem, 2.2vw, 1.65rem); line-height: 1.5; margin-block: 1.3rem; overflow-wrap: anywhere; }
.weekly-article .weekly-lead { color: #3c7130; }
.weekly-back { margin-top: 2.8rem; }
.weekly-news { padding-block: 4rem; border-top: 1px solid #dbe2d8; }
.weekly-news h2 { font-size: clamp(2rem, 4vw, 3rem); margin-bottom: 2rem; }
.weekly-news-list { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 19rem), 1fr)); gap: 2.5rem; }
.weekly-news-list article { min-width: 0; padding-block: 1rem; }
.weekly-news-list :is(h2, h3) { font-size: 1.6rem; line-height: 1.2; margin-block: .8rem; overflow-wrap: anywhere; }
.weekly-news-list article > p:not(.article-meta) { font-family: Yrsa, Georgia, serif; font-size: 1.4rem; line-height: 1.45; margin-block: 1rem; }
.weekly-preview-banner { background: #e8efdf; padding: 1.3rem; border-bottom: 1px solid #b9c6ab; font: 1rem/1.5 Gabarito, sans-serif; }
.weekly-preview-banner p { max-width: 46rem; margin: .3rem auto; }
.weekly-preview-sources { max-width: 46rem; margin: 0 auto 3rem; padding-inline: 1rem; font: 1rem/1.6 Gabarito, sans-serif; }
.news-topics { margin-block: 0 2.5rem; }
.news-topics nav, .article-tags { display: flex; flex-wrap: wrap; gap: .5rem; }
.news-topics nav a, .article-tags a, .article-tags span { display: inline-flex; align-items: center; min-height: 44px; padding: .55rem 1rem; border: 1px solid #b8cbb2; border-radius: 100px; color: #39742c; font: 1rem/1.2 Gabarito, sans-serif; text-decoration: none; }
.news-topics nav a[aria-current="page"] { background: #39742c; border-color: #39742c; color: #fff; }
.news-topics nav a:hover, .article-tags a:hover { background: #e8efdf; color: #28531e; }
.news-topics nav a[aria-current="page"]:hover { background: #28531e; color: #fff; }
.news-topics a:focus-visible, .article-tags a:focus-visible { outline: 3px solid #39742c; outline-offset: 3px; }
.news-result-count { color: #585858; font: 1rem/1.4 Gabarito, sans-serif; margin-top: 1rem; }
.article-tags { list-style: none; padding: 0; margin-block: 1rem; }
.article-tags a, .article-tags span { font-size: .9rem; padding-inline: .8rem; background: #f5f8f1; }

.weekly-news-filtered { padding-block: 0 3rem; border-top: 0; }

/* Shared motion: a soft arrival, one travelling selection, a clear response.
   Patterns adapted to this site's existing design from https://transitions.dev/. */
:root{--motion-settle:cubic-bezier(.22,1,.36,1);--motion-travel:360ms}
[data-motion-tabs="ready"]{position:relative;isolation:isolate}
[data-motion-tabs="ready"]::before{content:"";position:absolute;top:0;left:0;width:var(--pill-width);height:var(--pill-height);transform:translate(var(--pill-x),var(--pill-y));border-radius:inherit;background:var(--dark-green,#39742c);pointer-events:none;transition:transform var(--motion-travel) var(--motion-settle),width var(--motion-travel) var(--motion-settle),height var(--motion-travel) var(--motion-settle)}
[data-motion-tabs="ready"] [role="tab"]{position:relative;z-index:1;background:transparent!important;box-shadow:none!important;transition:color 180ms ease}
[data-motion-tabs="ready"] [role="tab"][aria-selected="true"]{color:#fff}
.button svg,.text-link svg,.case-live-link svg,.update-action svg{transition:transform 220ms var(--motion-settle)}
.offer-card{transition:box-shadow 280ms var(--motion-settle)}
@media(hover:hover){
  .button:hover svg,.text-link:hover svg,.case-live-link:hover svg,.news-update a:hover svg{transform:translateX(4px)}
  .offer-card:hover{box-shadow:0 10px 30px #19350f12}
}
/* Progressive native dialog close: browsers without discrete transitions close
   instantly, retaining focus restoration and anchor navigation. */
@supports(transition-behavior:allow-discrete){
  dialog.menu-sheet{transition:opacity 200ms ease,display 200ms allow-discrete,overlay 200ms allow-discrete;opacity:0}
  dialog.menu-sheet[open]{opacity:1}
  dialog.menu-sheet::backdrop{transition:opacity 200ms ease,display 200ms allow-discrete,overlay 200ms allow-discrete;opacity:0}
  dialog.menu-sheet[open]::backdrop{opacity:1}
  @starting-style{dialog.menu-sheet[open],dialog.menu-sheet[open]::backdrop{opacity:0}}
}
@media(prefers-reduced-motion:reduce){
  [data-motion-tabs]::before,.button svg,.text-link svg,.case-live-link svg,.update-action svg,dialog.menu-sheet,dialog.menu-sheet::backdrop{transition:none!important}
}

/* Preserve the complete sprout; the narrow hero must not crop its tip or stem. */
.hero-art .hero-leaf{object-fit:contain}

/* Keep the offscreen skip link clipped until keyboard focus, including while scrolling. */
.skip-link:not(:focus){clip-path:inset(50%)}

/* Shared material palette: fixed light, depth and readable green ink. */
:root{
  --forest-surface:radial-gradient(ellipse at 18% 22%,#8fba5618 0%,transparent 58%),linear-gradient(135deg,#3f7434 0%,#32632e 54%,#244c2c 100%);
  --lime-surface:radial-gradient(ellipse at 20% 12%,#f5ffd173 0%,transparent 62%),linear-gradient(135deg,#bedf55 0%,#abcf37 55%,#97ba30 100%);
  --meadow-surface:radial-gradient(ellipse at 12% 0%,#ffffffb3 0%,transparent 70%),linear-gradient(135deg,#f1f6e9 0%,#e6eedc 100%);
  --pollen-surface:radial-gradient(ellipse at 18% 12%,#fff7cf80 0%,transparent 62%),linear-gradient(135deg,#ffe087 0%,#f9c620 55%,#e3ad12 100%);
  --pollen-hover-surface:radial-gradient(ellipse at 18% 12%,#fff7cf99 0%,transparent 62%),linear-gradient(135deg,#ffe69e 0%,#fbd04b 55%,#edbb29 100%);
  --pollen-soft-surface:radial-gradient(ellipse at 16% 8%,#ffffffb3 0%,transparent 65%),linear-gradient(135deg,#fff9e6 0%,#f5ebc9 100%);
  --title-ink:#18321d;
  --title-light:#39633a;
}
.offer-card.offer-agents,.collaboration-section,.contact-section{background:var(--forest-surface)}
.offer-card.offer-agents{box-shadow:inset 0 1px 0 #ffffff24}
.offer-card.offer-product{background:radial-gradient(ellipse at 20% 8%,#ffffff94,transparent 65%),linear-gradient(135deg,#edf5d7,#dce8be)}
.offer-card.offer-connect,.journal-section,.article-wrap .service-aside,.article-wrap .article-summary,.press-feature-full,.person-portrait,.visual-agents{background:var(--meadow-surface)}
.workbench .workbench-tabs{background:var(--meadow-surface)!important}
.phone-stage,.visual-product{background:var(--lime-surface)}
/* Small controls borrow the same light without adding motion or more shadows. */
.header-cta,.button-lime,.scene-agents-row>span:nth-child(2) i{background:var(--lime-surface)}
.button-dark,.news-topics nav a[aria-current=page],[data-motion-tabs=ready]::before{background:var(--forest-surface)}
.workbench .workbench-tabs button[data-state=active]{background:var(--lime-surface)!important}

/* Warm pollen belongs to the same material family as forest and lime.
   Keep white reading surfaces and tiny status/diagram marks simple. */
.button-yellow,.scene-hub,.connect-center{background:var(--pollen-surface);color:#18321d}
.button-yellow,.scene-hub{box-shadow:inset 0 1px 0 #fff7cf80}
.scene-hub{box-shadow:inset 0 1px 0 #fff7cf80,0 10px 19px #a58e1b20}
.button-yellow:hover{background:var(--pollen-hover-surface)}
.visual-connect{background:var(--pollen-soft-surface)}
.offer-agents .offer-action>span{background:var(--lime-surface)}
.offer-card:hover .offer-action>span,.offer-card:focus-visible .offer-action>span{background:var(--pollen-surface);color:#18321d}
.menu-sheet .menu-close,.workbench-top>span:last-child,.article-tags a,.article-tags span{background:var(--meadow-surface)}
.news-topics nav a:hover,.article-tags a:hover{background:var(--meadow-surface)}
.news-topics nav a[aria-current=page]:hover{background:var(--forest-surface)}

/* One quiet tonal shift in headings, with a solid fallback and high-contrast mode. */
main :is(h1,h2,h3){color:var(--title-ink)}
.hero h1 span{color:#315b2c}
.collaboration-copy h2,.offer-agents h3,.cl-identity h3,.contact-section h2{
  --title-ink:#fff;--title-light:#e3eed3;color:var(--title-ink);
}
@supports(background-clip:text){
  main :is(h1,h2,h3){background-image:linear-gradient(115deg,var(--title-ink) 18%,var(--title-light) 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
  .hero h1 span{background-image:linear-gradient(115deg,#244c2c 15%,#527638 100%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent}
}
main :is(h1,h2,h3)::selection,main :is(h1,h2,h3) ::selection{background:#abcf37;color:#18321d;-webkit-text-fill-color:#18321d}
@media(forced-colors:active){
  main :is(h1,h2,h3),.hero h1 span{background:none!important;color:CanvasText!important;-webkit-text-fill-color:CanvasText!important}
}
@media print{
  main :is(h1,h2,h3),.hero h1 span{background:none!important;color:#18321d!important;-webkit-text-fill-color:#18321d!important}
}
