/* Each drawing plays once on entry and settles in under three seconds. */
.motion-enabled .art.motion-visible .motion-stroke {
  stroke-dasharray: var(--stroke-length);
  animation: cm-draw 1400ms cubic-bezier(.22,.6,.35,1) var(--motion-delay,0ms) both;
}
.motion-enabled .art.motion-visible .motion-node {
  transform-box: fill-box;
  transform-origin: center;
  animation: cm-node 900ms cubic-bezier(.22,.6,.35,1) var(--motion-delay,650ms) both;
}
.motion-enabled .brand img.motion-visible,
.motion-enabled .founder-initial.motion-visible {
  animation: cm-arrive 650ms ease-out both;
}
body.site .button > span[aria-hidden],
body.site .header-cta > span[aria-hidden],
body.site .text-link > span[aria-hidden],
body.site .challenge-choice > span[aria-hidden],
body.site .perspective > span[aria-hidden],
body.site .scroll-cue > span:last-child {
  display: inline-block;
  transition: translate 220ms ease, opacity 220ms ease;
}
@media (hover:hover) {
  .motion-enabled body.site :is(.button,.header-cta,.text-link,.challenge-choice,.perspective):hover > span[aria-hidden] { translate: 2px -2px; }
  .motion-enabled body.site .scroll-cue:hover > span:last-child { translate: 0 3px; }
}
.motion-enabled body.site :is(.button,.header-cta,.text-link,.challenge-choice,.perspective):focus-visible > span[aria-hidden] { translate: 2px -2px; }
.motion-enabled body.site .method-list details[open] .method-dot { animation: cm-dot 800ms ease-out; }
.motion-enabled body.site .perspective[aria-pressed=true] > span[aria-hidden] { animation: cm-icon 350ms ease-out; }
.motion-paused .motion-visible,
.motion-paused .motion-visible *,
.motion-paused body.site .method-dot { animation-play-state: paused !important; }
@keyframes cm-draw { from { stroke-dashoffset: var(--stroke-length); } to { stroke-dashoffset: 0; } }
@keyframes cm-node { 0% { opacity:.55; scale:.94; } 65% { opacity:1; scale:1.035; } 100% { opacity:1; scale:1; } }
@keyframes cm-arrive { from { opacity:.75; translate:0 3px; } to { opacity:1; translate:0 0; } }
@keyframes cm-dot { 0% { scale:.85; } 50% { scale:1.18; } 100% { scale:1; } }
@keyframes cm-icon { from { opacity:.55; translate:-2px 2px; } to { opacity:1; translate:0 0; } }
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto !important; }
  .motion-visible,.motion-visible *,body.site :is(.method-dot,.button,.header-cta,.text-link,.challenge-choice,.perspective) { animation:none !important; transition:none !important; }
}

/* Production frame; the approved layout and palette remain unchanged. */
body.site .contact-person { margin-top:30px; padding-top:22px; border-top:1px solid #375261; }
body.site .contact-person > span { display:block; color:#c5d4df; font-size:12px; margin-bottom:10px; }
body.site .contact-person a { display:block; width:fit-content; font-size:16px; margin-top:9px; text-decoration:underline; text-underline-offset:5px; }
body.site .contact-person a:hover { color:#9eb8d3; }
body.site .contact-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:20px; }
body.site .contact-actions .button { margin:0; }
body.site .contact-actions .secondary { background:transparent; color:#102332; }
body.site .site-footer .footer-contact { display:grid; gap:4px; }
body.site .footer-contact a { font-family:var(--sans); font-size:12px; letter-spacing:normal; }
body.site .footer-contact a:hover { text-decoration:underline; }
body.site #brief-result > p { margin:0; }
body.site #brief-result .primary { background:#102332; color:#f4ede3; }
@media(max-width:600px) {
  body.site .contact-actions { flex-direction:column; align-items:stretch; }
  body.site .contact-actions .button { align-self:stretch; justify-content:center; }
  body.site .footer-contact { grid-column:1/-1; margin:5px 0; }
}

body.clareza.site .founder-profiles {
  grid-column:1/-1;
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(16px,3vw,32px);
  width:100%;
  margin-top:clamp(20px,4vw,48px);
}
body.clareza.site .founder-profile {
  padding:clamp(20px,3vw,34px);
  border:1px solid #d8cec0;
  border-radius:16px;
  background:#faf7f2;
}
body.clareza.site .founder-profile-heading {
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:14px;
  margin-bottom:20px;
}
body.clareza.site .founder-portrait {
  position:relative;
  display:block;
  width:clamp(66px,10vw,88px);
  aspect-ratio:88/108;
  overflow:hidden;
  border-radius:12px;
}
body.clareza.site .founder-portrait img {
  position:absolute;
  max-width:none;
  height:auto;
  width:var(--portrait-scale);
  left:var(--portrait-x);
  top:var(--portrait-y);
}
body.clareza.site .founder-portrait--janice {
  --portrait-scale:190%;
  --portrait-x:-59%;
  --portrait-y:-50%;
}
body.clareza.site .founder-portrait--daniel {
  --portrait-scale:212%;
  --portrait-x:-58%;
  --portrait-y:-16%;
}
body.clareza.site .founder-profile h3 { margin:0 0 6px; font:normal clamp(25px,3vw,34px)/1.1 Georgia,serif; }
body.clareza.site .founder-profile p { margin:0; line-height:1.55; }
body.clareza.site .founder-profile-heading p { color:#35515f; font-size:14px; font-weight:600; }
body.clareza.site .founder-profile > p + p { margin-top:12px; }
@media(max-width:720px) {
  body.clareza.site .founder-profiles { grid-template-columns:minmax(0,1fr); }
}

/* Frentes: distinct bands use the approved palette and keep their existing content. */
body.clareza.site :is(.stages-section,.work-stages,.work-deliverables,.work-method) { padding-block:clamp(48px,6vw,86px); }
body.clareza.site .stages-section .perspectives { margin-bottom:0; }
body.clareza.site .stages-section .perspective-grid {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(12px,2vw,24px);
}
body.clareza.site .perspective-card {
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:start;
  gap:16px;
  padding:clamp(18px,3vw,32px);
  border-radius:16px;
  background:#faf7f2;
  color:#102332;
}
body.clareza.site .perspective-card:nth-child(2) { background:#dce7ef; }
body.clareza.site .perspective-card:nth-child(3) { background:#f4ede3; }
body.clareza.site .perspective-card:nth-child(4) { background:#f2ded5; }
body.clareza.site .perspective-card h4 {
  margin:0 0 8px;
  font:normal clamp(21px,2.5vw,29px)/1.15 Georgia,serif;
}
body.clareza.site .perspective-card p { margin:0; color:#35515f; line-height:1.55; }
@media(max-width:600px) {
  body.clareza.site .stages-section .perspective-grid { grid-template-columns:minmax(0,1fr); }
}
body.site .work-icon { display:block; width:32px; height:32px; color:#35515f; }
body.clareza.site .work-icon .quad-line { stroke:currentColor; stroke-width:1.6; }
body.clareza.site .work-stages { background:#faf7f2; color:#102332; }
body.clareza.site .work-stages .stages-layout { margin-top:0; }
body.clareza.site .work-stages .stage-tabs button { color:#102332; border-color:#9eb8d3; padding-right:65px; }
body.clareza.site .work-stages .stage-tabs .work-icon { position:absolute; right:20px; bottom:18px; }
body.clareza.site .work-stages .stage-panel { min-height:0; }
body.clareza.site .work-stages .stage-panel p,
body.clareza.site .work-stages .stage-panel ul { color:#102332; }
body.clareza.site .work-stages .stage-panel .stage-outcome { color:#35515f!important; }
body.clareza.site .work-stages .connection-line { margin-bottom:0; color:#35515f; }
body.clareza.site .work-deliverables { background:#f4ede3; color:#102332; }
body.clareza.site .work-deliverables .deliverables { margin:0; }
body.clareza.site .work-deliverables .data-foundation p { color:#35515f; }
body.clareza.site .work-deliverables .deliverables-grid article { background:#faf7f2; }
body.clareza.site .work-deliverables .deliverables-grid article:nth-child(2) { background:#dce7ef; }
body.clareza.site .work-deliverables .deliverables-grid article>span { display:block; margin-top:16px; color:#35515f; }
body.clareza.site .work-method { background:#9eb8d3; color:#102332; }
body.clareza.site .work-method .method { margin:0; padding:0; }
body.clareza.site .work-method .work-icon { margin-bottom:16px; }
@media(max-width:600px) { body.clareza.site .perspective { gap:8px; } body.clareza.site .work-stages .stage-tabs button { min-height:125px; } }

body.site .contact-links, noscript .contact-links { display:flex; flex-wrap:wrap; gap:12px; }
body.site .contact-links a, noscript .contact-links a { display:inline-grid; place-items:center; width:44px; height:44px; margin:0; border:1px solid currentColor; border-radius:50%; }
.contact-links svg { width:22px; height:22px; }
body.site .contact-links a:focus-visible { outline:2px solid currentColor; outline-offset:3px; }
body.site .contact-links a:hover { color:#9eb8d3; }

body.site #brief-form {
  box-sizing:border-box;
  padding:clamp(20px,3vw,36px);
  background:#193345;
  border:1px solid #567488;
  border-radius:18px;
}
body.site #brief-form :is(input,textarea) {
  background:#102332;
  border:1px solid #7894a9;
  border-radius:8px;
  padding:12px 14px;
}
body.site #brief-form :is(input,textarea):focus-visible {
  outline:2px solid #9eb8d3;
  outline-offset:2px;
}

/* Seu desafio */
body.clareza.site #desafio { background:#dce7ef; color:#102332; border-top:1px solid #a8bbc8; }
body.clareza.site #desafio .chapter { color:#35515f; }
body.clareza.site #desafio .section-opening { margin-bottom:clamp(28px,4vw,48px); }
body.clareza.site #desafio .challenge-workspace { gap:clamp(24px,5vw,64px); align-items:start; }
body.clareza.site #desafio .challenge-choice {
  display:grid;
  grid-template-columns:24px minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
  background:#faf7f2;
  color:#102332;
  border-color:#a8bbc8;
  border-radius:10px;
}
body.clareza.site #desafio .challenge-choice .work-icon { width:24px; height:24px; }
body.clareza.site #desafio .challenge-choice:is(.active,:hover) { background:#c7daea; border-color:#35515f; }
body.clareza.site #desafio .challenge-choice.active { box-shadow:inset 3px 0 #35515f; }
body.clareza.site .sector-picker {
  border:0;
  padding:0;
  min-inline-size:0;
  margin:0 0 clamp(18px,3vw,32px);
}
body.clareza.site .sector-picker legend {
  padding:0;
  margin-bottom:8px;
  color:#102332;
  font-weight:700;
}
body.clareza.site .sector-options {
  display:flex; flex-wrap:wrap;
  gap:6px;
}
body.clareza.site .sector-option {
  position:relative;
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  align-items:center;
  gap:8px;
  box-sizing:border-box; min-height:44px;
  padding:5px 9px;
  border:1px solid #8da6b3;
  border-radius:12px;
  background:#faf7f2;
  color:#102332;
  cursor:pointer;
  font-size:13px;
  font-weight:600;
}
body.clareza.site .sector-option .work-icon { width:22px; height:22px; color:var(--sector-icon,#286783); }
body.clareza.site .sector-option:has([value="hospital"]) { --sector-icon:#a74734; }
body.clareza.site .sector-option:has([value="network"]) { --sector-icon:#286c63; }
body.clareza.site .sector-option:has([value="industry"]) { --sector-icon:#875b25; }
body.clareza.site .sector-option:has([value="clinic"]) { --sector-icon:#695884; }
body.clareza.site .sector-option input {
  position:absolute;
  width:1px;
  height:1px;
  margin:0;
  clip-path:inset(50%);
}
body.clareza.site .sector-option svg { grid-column:1; grid-row:1; }
body.clareza.site .sector-option span { grid-column:2; grid-row:1; }
body.clareza.site .sector-option:hover { border-color:#27455a; }
body.clareza.site .sector-option:has(:checked) {
  background:#27455a;
  color:#faf7f2;
  border-color:#27455a;
}
body.clareza.site .sector-option:has(:checked) .work-icon { color:#dce7ef; }
body.clareza.site .sector-option:has(:focus-visible) { outline:2px solid #27455a; outline-offset:3px; }
body.clareza.site #desafio select { background:#faf7f2; color:#102332; border-color:#7894a9; border-radius:8px; }
body.clareza.site #desafio .recommendation {
  background:#faf7f2;
  color:#102332;
  border:1px solid #a8bbc8;
  border-radius:16px;
  padding:clamp(22px,3vw,36px);
}
body.clareza.site #desafio :is(.recommendation-label,.recommendation-context,.you-receive h4) { color:#35515f; }
body.clareza.site #desafio .you-receive { margin:22px 0; padding:16px; background:#dce7ef; border-radius:8px; }
body.clareza.site #desafio .challenge-details { border-top:1px solid #a8bbc8; }
body.clareza.site #desafio .challenge-details summary { cursor:pointer; padding:14px 0; min-height:44px; }
body.clareza.site #desafio :is(button,select,summary,a):focus-visible { outline:2px solid #35515f; outline-offset:3px; }

/* Layout da página institucional */
body.clareza.site { --pad:clamp(16px, 5vw, 72px); }
body.clareza.site .section { padding-block:clamp(42px, 6vw, 94px); }
body.clareza.site :is(.hero, .challenge-workspace, .stages-layout, .deliverables-grid, .method, .about-section, .contact-section) > * { min-width:0; }
body.clareza.site .hero {
  grid-template-columns:minmax(0, 1.15fr) minmax(0, 1fr);
  gap:clamp(24px, 5vw, 76px);
  min-height:0;
  padding-block:clamp(38px, 6vw, 92px);
}
body.clareza.site .hero h1 { font-size:clamp(34px, 5vw, 76px); text-wrap:balance; }
body.clareza.site .section h2 { font-size:clamp(30px, 4.4vw, 64px); text-wrap:balance; }
body.clareza.site .section-opening {
  grid-template-columns:minmax(0, 1.1fr) minmax(0, 1fr);
  gap:12px clamp(20px, 5vw, 68px);
}
body.clareza.site .section-opening .chapter { grid-column:1/-1; }
body.clareza.site .section-opening > p:last-child { align-self:end; max-width:50ch; }
body.clareza.site :is(.challenge-workspace, .stages-layout, .method, .contact-section) {
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:clamp(24px, 5vw, 72px);
}
body.clareza.site :is(.hero-intro, .about-copy > p, .contact-section > div > p) { max-width:58ch; }
body.clareza.site :is(.recommendation, #brief-form) { min-width:0; }
body.clareza.site :is(#sector, #brief-form input, #brief-form textarea) { box-sizing:border-box; width:100%; max-width:100%; }
body.clareza.site #brief-result pre { white-space:pre-wrap; overflow-wrap:anywhere; }
body.clareza.site .stage-tabs button { overflow-wrap:anywhere; }

@media (min-width:801px) and (max-width:1000px) {
  body.clareza.site .site-header { gap:14px; }
  body.clareza.site .brand { flex:0 1 186px; }
  body.clareza.site .brand img { width:100%; }
  body.clareza.site .site-header nav { gap:12px; }
}

@media (max-width:800px) {
  html { scroll-padding-top:140px; }
  body.clareza.site .site-header {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:0 12px;
    min-height:0;
    padding-block:3px;
  }
  body.clareza.site .brand-lockup { width:min(100%,200px); }
  body.clareza.site .brand img { width:100%; }
  body.clareza.site .site-header .header-cta { grid-column:2; grid-row:1; padding:10px 12px; }
  body.clareza.site .site-header nav {
    display:flex;
    grid-column:1/-1;
    grid-row:2;
    justify-content:space-between;
    gap:4px 8px;
    border-top:1px solid #a8bbc8;
  }
  body.clareza.site .site-header nav a { display:grid; align-items:center; min-height:44px; font-size:12px; }
  body.clareza.site :is(.hero, .section-opening, .challenge-workspace, .stages-layout, .method, .about-section, .contact-section) {
    display:grid;
    grid-template-columns:minmax(0,1fr);
  }
  body.clareza.site .hero h1 { font-size:clamp(34px, 7vw, 58px); }
  body.clareza.site .hero-art { min-height:0; max-height:none; margin:0; padding:0; justify-items:center; }
  body.clareza.site .hero-art .art { max-height:clamp(190px, 50vw, 310px); }
  body.clareza.site .hero-art .art-caption { justify-content:center; gap:18px; }
  body.clareza.site .perspective-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body.clareza.site .about-copy { grid-row:1; }
  body.clareza.site .contact-section form { margin-top:0; }
  body.clareza.site .reading-progress { top:0; }
}

@media (max-width:480px) {
  body.clareza.site .hero h1 { font-size:clamp(32px, 9.4vw, 43px); }
  body.clareza.site .section h2 { font-size:clamp(29px, 8.4vw, 38px); }
  body.clareza.site .site-header nav a { font-size:11px; }
  body.clareza.site .site-header .header-cta { font-size:11px; }
  body.clareza.site .deliverables-grid { grid-template-columns:minmax(0,1fr); gap:14px; }
  body.clareza.site .work-stages .stage-tabs button { min-height:0; font-size:22px; padding:16px 60px 16px 16px; }
  body.clareza.site .work-stages .stage-tabs .work-icon { bottom:14px; right:14px; width:25px; height:25px; }
  body.clareza.site #brief-form { padding:16px; }
  body.clareza.site #brief-form button { max-width:100%; white-space:normal; }
}
