/* InfluenceLab identity and interaction language. Flat colour, rounded controls. */
:root { --control-radius:999px; --surface-radius:1.25rem; --interaction-ease:cubic-bezier(.2,.7,.2,1) }
.logo,.studio-home .header .logo,.studio-home .footer-top .logo {
  display:inline-flex; align-items:center; gap:.5rem; flex-shrink:0;
  font-family:var(--detail); font-weight:600; letter-spacing:-.065em;
  text-decoration:none; line-height:1; font-size:1.75rem;
}
.logo .brand-wordmark,.logo .brand-wordmark-tail { display:inline; font-size:inherit; font-family:inherit; line-height:inherit; letter-spacing:inherit }
.logo .brand-wordmark { font-weight:600 }
.logo .brand-wordmark-tail { font-weight:400 }
.logo svg.brand-mark { display:block; width:2.25rem; height:2.25rem; flex:0 0 auto; margin:0; overflow:visible; transform:none; stroke:none; fill:none }
.studio-home .header .logo svg.brand-mark { display:block; width:2.25rem; height:2.25rem; margin:0 }
.logo .brand-mark-field { fill:var(--lime) }
.logo .brand-mark-letters { fill:#111410; stroke:none }
.studio-home .footer-top .logo { font-size:clamp(2rem,1.5rem + 1.8vw,3.2rem) }
.studio-home .footer-top .brand-mark { width:1.15em; height:1.15em }

/* Every action has the same rounded silhouette; text links stay text links. */
.pill,.studio-home .pill,.studio-home .header-actions>.pill,
.studio-home #creadores .recruit-next>.pill,.studio-home #talento .catalog-bottom .pill,
.studio-home #marcas .submit-brief,.studio-page .pill,
.studio-home #talento .filter-tabs button,.filter-tabs button,
.format-tabs button,.directory-card [data-add-talent],.profile-selection-button,
.faq-search button,.campaign-selection button { border-radius:var(--control-radius) }
.pill { text-align:center; justify-content:center }
.menu-button,.dialog-close,.select-talent,.icon-button,
.studio-home .closing>a>span { border-radius:50% }
.studio-home .closing>a>span { flex-shrink:0 }
.pill:focus-visible,.faq-search button:focus-visible,.benefit-disclosure>summary:focus-visible { outline:3px solid #f8f9f6; outline-offset:2px; box-shadow:0 0 0 6px #111410 }
.pill:disabled { cursor:not-allowed; opacity:.6 }
.studio-home #talento .filter-tabs button[aria-pressed=true] { background:#111410; color:#f8f9f6 }
.studio-home #marcas .format-tabs { border:0; gap:.5rem }
.studio-home #marcas .format-tabs button { background:#2a3323; color:#f8f9f6; padding:.65rem 1rem }
.studio-home #marcas .format-tabs button[aria-selected=true] { background:var(--lime); color:#111410 }
.studio-home #marcas .format-tabs button::after { display:none }
#format-panel { outline-offset:.5rem }

/* Benefits are real disclosures, operable with a pointer, touch or keyboard. */
.studio-home #creadores .recruit-benefits,.studio-page .recruit-benefits { display:flex; flex-direction:column; gap:.5rem }
.studio-home #creadores .recruit-benefits article,.studio-page .recruit-benefits article {
  display:block; padding:0; min-height:0; border:0; border-radius:var(--surface-radius);
  background:#232b1e; color:#f8f9f6; overflow:visible;
}
.studio-home #creadores .recruit-benefits article:first-child,.studio-page .recruit-benefits article:first-child { background:#d2fc52; color:#111410 }
.benefit-disclosure>summary { display:flex; align-items:center; justify-content:space-between; gap:1.5rem; padding:1.25rem 1.5rem; cursor:pointer; list-style:none; min-height:4.75rem; border-radius:var(--surface-radius) }
.benefit-disclosure>summary::-webkit-details-marker { display:none }
.studio-home #creadores .recruit-benefits h3,.studio-page .recruit-benefits h3 { margin:0; color:inherit; font-family:var(--detail); font-size:clamp(1.125rem,1rem + .4vw,1.5rem); line-height:1.3; font-weight:500; max-width:30ch }
.benefit-toggle { flex:0 0 2rem; width:2rem; height:2rem; display:grid; place-items:center; border-radius:50%; background:#3b4930; color:#f8f9f6; font:400 1.5rem/1 var(--font) }
.recruit-benefits article:first-child .benefit-toggle { background:#111410; color:var(--lime) }
.benefit-disclosure[open] .benefit-toggle { transform:rotate(45deg) }
.benefit-description { padding:0 1.5rem 1.5rem; max-width:65ch }
.studio-home #creadores .recruit-benefits .benefit-description p,.studio-page .recruit-benefits .benefit-description p { margin:0; max-width:none; color:#e0e6d9; font:400 1rem/1.65 var(--font) }
.studio-home #creadores .recruit-benefits article:first-child p,.studio-page .recruit-benefits article:first-child p { color:#263619 }

/* Search is an optional shortcut. Questions remain native details without JS. */
.faq-search { margin:0 0 1.5rem; padding:0; max-width:42rem }
.faq-search>label { display:block; font:500 1rem/1.5 var(--detail); margin-bottom:.65rem; color:#111410 }
.faq-search-row { display:flex; gap:.5rem; align-items:center }
.faq-search input { min-width:0; flex:1; width:100%; min-height:3rem; border:1px solid #8a977e; border-radius:var(--control-radius); background:#fff; color:#111410; padding:.75rem 1rem; font:400 1rem/1.5 var(--font) }
.faq-search input::placeholder { color:#59634f }
.faq-search input:focus-visible { outline:3px solid #526a35; outline-offset:3px }
.faq-search button { flex-shrink:0; min-height:3rem; border:0; padding:.75rem 1rem; background:#e2e8d8; color:#111410; font:500 .875rem/1.5 var(--font); cursor:pointer }
.faq-search button[hidden] { display:none }
.faq-search .faq-search-status { font:400 .875rem/1.5 var(--font); color:#46543d; margin:.65rem 0 0 }
.faq-search-status:empty { display:none }
.faqs details[hidden],.search-faq details[hidden] { display:none }
.studio-home .faqs details,.search-faq details { border-radius:.75rem }
.studio-home .faqs details[open],.search-faq details[open] { background:#e8ecdf }
.search-faq details[open] { padding-inline:1rem }
#campaign-format-feedback { color:#294019; background:#e5f1d5; padding:.75rem 1rem; border-radius:.75rem; font:500 .9375rem/1.5 var(--font) }

@media(prefers-reduced-motion:no-preference) {
  .logo .brand-mark,.logo .brand-wordmark-tail { transition:transform 220ms var(--interaction-ease),color 180ms ease }
  .benefit-toggle { transition:transform 200ms var(--interaction-ease),background-color 180ms ease }
  .benefit-disclosure[open] .benefit-description { animation:il-benefit-in 220ms var(--interaction-ease) }
  .graffiti-accent::after { animation:il-marker-stroke 550ms 180ms var(--interaction-ease) both }
  @keyframes il-marker-stroke { from { clip-path:inset(0 100% 0 0) } }
  @keyframes il-benefit-in { from { opacity:.65; transform:translateY(-4px) } to { opacity:1; transform:none } }
  .faq-search button,.format-tabs button { transition:background-color 180ms ease,color 180ms ease,transform 140ms ease }
  .faq-search button:active,.format-tabs button:active { transform:scale(.97) }
  .pill>span[aria-hidden=true] { display:inline-block; transition:transform 200ms var(--interaction-ease) }
}
@media(hover:hover) and (pointer:fine) {
  .benefit-disclosure>summary:hover { background:#ffffff0b }
  .recruit-benefits article:first-child .benefit-disclosure>summary:hover { background:#11141009 }
  .faq-search button:hover { background:#d2fc52 }
  .logo:hover .brand-wordmark-tail { color:#719328 }
  .studio-home .logo:hover .brand-wordmark-tail,.search-footer .logo:hover .brand-wordmark-tail { color:var(--lime) }
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  .logo:hover .brand-mark { transform:rotate(-5deg) }
  .pill:hover>span[aria-hidden=true] { transform:translate(2px,-2px) }
}
@media(max-width:650px) {
  .studio-home .header .logo { font-size:1.25rem; gap:.375rem }
  .studio-home .header .logo svg.brand-mark { width:1.75rem; height:1.75rem }
  .studio-home .header-actions { gap:.5rem }
  .studio-home .header .menu-button { width:2.75rem; height:2.75rem }
  .benefit-disclosure>summary { padding:1rem 1.25rem; gap:1rem; min-height:4.5rem }
  .benefit-description { padding:0 1.25rem 1.25rem }
  .faq-search-row { gap:.375rem }
  .faq-search button { padding-inline:.75rem }
}
@media(max-width:360px) {
  .studio-home .header .logo { font-size:1.0625rem; gap:.3125rem }
  .studio-home .header .logo svg.brand-mark { width:1.5rem; height:1.5rem }
  .studio-home .header-actions>.pill { padding-inline:.7rem }
}
@media(prefers-reduced-motion:reduce) {
  .logo .brand-mark,.logo .brand-wordmark-tail,.benefit-toggle,.benefit-description,.graffiti-accent::after,.faq-search button,.format-tabs button,.pill>span[aria-hidden=true] { animation:none!important; transition:none!important }
}