/* Biografias e autobiografias | Extensão do site de Ione Grillo.
   Seletores próprios para preservar o estilo e os componentes existentes. */
[data-bio] {
  --bio-petrol: #226277;
  --bio-deep: #173f4c;
  --bio-ink: #29303d;
  --bio-muted: #606d75;
  --bio-mint: #d5eae2;
  --bio-sage: #e7efeb;
  --bio-cream: #faf8f5;
  --bio-line: #dce5e2;
  --bio-serif: "Cormorant Garamond", Georgia, serif;
  --bio-sans: "Lato", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--bio-ink);
  font-family: var(--bio-sans);
  font-size: 1rem;
  line-height: 1.7;
  -webkit-text-size-adjust: 100%;
}
[data-bio], [data-bio] *, [data-bio] *::before, [data-bio] *::after { box-sizing: border-box; }
body.bio-page { margin: 0; background: #fff; }
[data-bio] :is(h1,h2,h3,p,figure,blockquote,ul,ol) { margin: 0; }
[data-bio] :is(h1,h2,h3) { font-family: var(--bio-serif); font-weight: 600; }
[data-bio] a { color: inherit; }
[data-bio] img { display: block; max-width: 100%; height: auto; }
[data-bio] svg { flex-shrink: 0; }
[data-bio] :is(a,button,summary):focus-visible { outline: 3px solid #387d94; outline-offset: 5px; }
[data-bio] :is(h1,h2,h3,p,a,li) { overflow-wrap: break-word; }
.bio-wrap { width: min(100% - 4rem, 1152px); margin-inline: auto; }
.bio-section { padding-block: 6rem; }
.bio-eyebrow { display: block; font: 600 .875rem/1.5 var(--bio-sans); letter-spacing: .14em; text-transform: uppercase; }
.bio-title { font-size: clamp(2.15rem, 3.9vw, 3.5rem); line-height: 1.14; letter-spacing: -.025em; }
.bio-lead { font-size: 1.125rem; line-height: 1.8; }
.bio-muted { color: var(--bio-muted); }
.bio-stack > * + * { margin-top: 1.5rem; }
.bio-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 1rem 1.5rem; }
.bio-button {
  display: inline-flex; align-items: center; justify-content: center; gap: .65rem;
  min-height: 3.25rem; max-width: 100%; padding: .8rem 1.6rem;
  border: 1px solid transparent; border-radius: 999px;
  background: var(--bio-petrol); color: #fff !important;
  font: 600 1rem/1.5 var(--bio-sans); text-align: center; text-decoration: none;
  transition: background-color .2s, box-shadow .2s, transform .2s;
  box-shadow: 0 5px 14px rgb(23 63 76 / 10%);
}
.bio-button:hover { background: var(--bio-deep); box-shadow: 0 7px 20px rgb(23 63 76 / 18%); transform: translateY(-2px); }
.bio-button svg { width: 1.2rem; height: 1.2rem; }
.bio-button--light { background: #fff; color: var(--bio-deep) !important; }
.bio-button--light:hover { background: var(--bio-mint); }
.bio-button--outline { background: transparent; border-color: var(--bio-petrol); color: var(--bio-petrol) !important; box-shadow: none; }
.bio-button--outline:hover { color: #fff !important; }
.bio-text-link { text-underline-offset: .3em; text-decoration-thickness: 1px; font-size: .9375rem; }
.bio-text-link:hover { text-decoration-thickness: 2px; }
.bio-icon { width: 1.4rem; height: 1.4rem; }

/* Chamada inserida imediatamente depois da mentoria na página inicial. */
.bio-module { background: linear-gradient(115deg, #173f4c, #226277); color: #fff; padding-block: 5.5rem; }
.bio-module .bio-eyebrow { color: var(--bio-mint); }
.bio-module-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, .8fr); align-items: center; gap: 5rem; }
.bio-module h2 { color: #fff; font-size: clamp(2.1rem, 4vw, 3.5rem); line-height: 1.16; letter-spacing: -.025em; }
.bio-module h2 em { color: #d5eae2; font-weight: 400; }
.bio-module-copy { color: #edf4f3; max-width: 39rem; font-size: 1.125rem; line-height: 1.8; }
.bio-module-options { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; padding-block: .25rem; font-size: .9375rem; color: #edf4f3; }
.bio-module-options span { display: inline-flex; align-items: center; gap: .5rem; }
.bio-module-aside { padding: 2.25rem 0 2.25rem 2.75rem; border-left: 1px solid rgb(213 234 226 / 30%); }
.bio-module-aside blockquote { font: 400 clamp(1.6rem, 2.5vw, 2.2rem)/1.45 var(--bio-serif); color: #fff; }
.bio-module-aside p { margin-top: 1.5rem; color: #d5eae2; font-size: .9375rem; }
.bio-module .bio-button:focus-visible { outline-color: #d5eae2; }

/* Subpágina independente, sem necessidade de framework ou configuração de rotas. */
.bio-skip { position: absolute; top: -6rem; left: 1rem; z-index: 100; padding: .7rem 1rem; background: #fff; color: #173f4c; }
.bio-skip:focus { top: .7rem; }
.bio-header { border-bottom: 1px solid var(--bio-line); background: #fff; }
.bio-header-inner { display: flex; align-items: center; justify-content: space-between; gap: 2rem; min-height: 6rem; padding-block: 1rem; }
.bio-brand { display: grid; text-decoration: none; flex-shrink: 0; }
.bio-brand strong { color: var(--bio-petrol); font: 600 1.65rem/1.25 var(--bio-serif); }
.bio-brand span { margin-top: .25rem; color: var(--bio-muted); font-size: .875rem; }
.bio-nav { display: flex; align-items: center; flex-wrap: wrap; gap: 1.75rem; font-size: .9375rem; }
.bio-nav a { text-decoration: none; padding-block: .5rem; }
.bio-nav a:hover { color: var(--bio-petrol); text-decoration: underline; text-underline-offset: .3em; }
.bio-nav .bio-nav-home { display: inline-flex; align-items: center; gap: .5rem; color: var(--bio-petrol); }
.bio-hero { padding-block: 4.5rem 5.5rem; background: linear-gradient(130deg, #fff 5%, #faf8f5 64%, #edf4f0); }
.bio-hero-grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr); gap: 5rem; align-items: center; }
.bio-hero h1 { font-size: clamp(2.75rem, 5vw, 4.6rem); line-height: 1.08; letter-spacing: -.035em; }
.bio-hero h1 em { display: block; color: var(--bio-petrol); font-weight: 400; }
.bio-hero .bio-eyebrow { color: var(--bio-petrol); margin-bottom: 1.5rem; }
.bio-hero .bio-lead { max-width: 38rem; margin-top: 1.75rem; color: #52616b; }
.bio-hero .bio-actions { margin-top: 2rem; }
.bio-hero-note { margin-top: 1rem !important; color: var(--bio-muted); font-size: .875rem; }
.bio-hero-photo img { width: 100%; aspect-ratio: 4/5; object-fit: cover; object-position: center 35%; border-radius: 28px; box-shadow: 0 20px 42px rgb(23 63 76 / 12%); }
.bio-hero-photo figcaption { margin-top: 1rem; display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; color: #58676d; font-size: .875rem; }
.bio-hero-photo figcaption strong { color: var(--bio-petrol); font-weight: 600; }
.bio-section-intro { max-width: 46rem; margin-bottom: 3rem; }
.bio-section-intro .bio-eyebrow { color: var(--bio-petrol); margin-bottom: 1rem; }
.bio-section-intro p { margin-top: 1.25rem; color: var(--bio-muted); font-size: 1.0625rem; }
.bio-paths { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5rem; }
.bio-path { display: flex; flex-direction: column; gap: 1.4rem; padding: 2.5rem; border: 1px solid var(--bio-line); border-radius: 24px; background: #fafcfb; }
.bio-path--guided { background: var(--bio-cream); }
.bio-path-top { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
.bio-path-top .bio-eyebrow { font-size: .875rem; color: var(--bio-petrol); letter-spacing: .08em; }
.bio-path-icon { display: flex; align-items: center; justify-content: center; width: 3.25rem; height: 3.25rem; border-radius: 50%; color: var(--bio-petrol); background: #e7efeb; }
.bio-path h3 { font-size: 2rem; line-height: 1.2; letter-spacing: -.02em; }
.bio-path > p { color: #52616b; }
.bio-path ul { display: grid; gap: .75rem; padding-left: 1.2rem; color: #46565f; }
.bio-path li::marker { color: var(--bio-petrol); }
.bio-path .bio-button { margin-top: auto; align-self: flex-start; }
.bio-choice-note { margin-top: 1.75rem !important; color: var(--bio-muted); font-size: .9375rem; }
.bio-process { background: #f3f7f5; }
.bio-steps { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 2.5rem; padding: 0; list-style: none; }
.bio-step-number { display: block; padding-bottom: 1.25rem; border-bottom: 1px solid #bacfc6; font: 400 2.65rem/1 var(--bio-serif); color: var(--bio-petrol); }
.bio-steps h3 { margin-top: 1.5rem; margin-bottom: .75rem; font-size: 1.55rem; line-height: 1.3; }
.bio-steps p { color: #52616b; }
.bio-process-note { margin-top: 2.5rem !important; padding-top: 1.5rem; border-top: 1px solid #d4e1db; color: #52616b; font-size: .9375rem; }
.bio-questions-layout { display: grid; grid-template-columns: minmax(0,.8fr) minmax(0,1.2fr); gap: 5rem; align-items: start; }
.bio-questions-intro .bio-eyebrow { color: var(--bio-petrol); }
.bio-questions-intro .bio-title { margin-top: 1rem; }
.bio-questions-intro p { margin-top: 1.5rem; color: var(--bio-muted); }
.bio-questions { list-style: none; padding: 0; counter-reset: memory; }
.bio-questions li { counter-increment: memory; display: grid; grid-template-columns: 2.4rem 1fr; gap: 1rem; padding-block: 1.15rem; border-bottom: 1px solid var(--bio-line); }
.bio-questions li:first-child { padding-top: 0; }
.bio-questions li::before { content: counter(memory, decimal-leading-zero); color: var(--bio-petrol); font: 400 1.25rem/1.6 var(--bio-serif); }
.bio-author { background: var(--bio-cream); }
.bio-author-grid { display: grid; grid-template-columns: minmax(0,.7fr) minmax(0,1.3fr); gap: 5rem; align-items: center; }
.bio-author-photo { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: 24px; }
.bio-author .bio-eyebrow { color: var(--bio-petrol); }
.bio-author .bio-title { margin-top: 1rem; }
.bio-author p { margin-top: 1.5rem; color: #52616b; }
.bio-author blockquote { margin-top: 2rem; border-left: 2px solid #9bbcaf; padding-left: 1.5rem; font: 400 1.45rem/1.55 var(--bio-serif); color: var(--bio-petrol); }
.bio-contact { padding-block: 6rem; background: linear-gradient(110deg, #173f4c, #226277); color: #fff; text-align: center; }
.bio-contact .bio-wrap { max-width: 850px; }
.bio-contact .bio-eyebrow { color: #d5eae2; margin-bottom: 1.25rem; }
.bio-contact h2 { color: #fff; }
.bio-contact h2 em { color: #d5eae2; font-weight: 400; }
.bio-contact .bio-lead { color: #edf4f3; margin: 1.5rem auto 2rem; max-width: 43rem; }
.bio-contact-number { margin-top: 1.25rem !important; font-size: .9375rem; color: #d5eae2; }
.bio-contact-number a { text-underline-offset: .25em; }
.bio-contact :is(a,button):focus-visible { outline-color: #d5eae2; }
.bio-footer { padding-block: 2rem; background: #fff; }
.bio-footer-inner { display: flex; justify-content: space-between; align-items: center; gap: 1.25rem 2rem; flex-wrap: wrap; font-size: .875rem; color: var(--bio-muted); }
.bio-footer-links { display: flex; flex-wrap: wrap; gap: 1.5rem; }
.bio-footer a { text-underline-offset: .3em; }
.bio-footer a:hover { color: var(--bio-petrol); }
.bio-page :is(section, main)[id] { scroll-margin-top: 2rem; }
@media (min-width: 1440px) { .bio-hero { padding-block: 5.5rem 6rem; } }
@media (max-width: 1023px) {
  .bio-module-grid, .bio-hero-grid, .bio-author-grid, .bio-questions-layout { gap: 3rem; }
  .bio-hero-grid { grid-template-columns: minmax(0,1.1fr) minmax(0,.9fr); }
  .bio-hero h1 { font-size: clamp(2.8rem, 5.8vw, 4rem); }
  .bio-path { padding: 2rem; }
  .bio-steps { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 2.5rem; }
  .bio-nav { gap: 1.25rem; }
}
@media (max-width: 767px) {
  .bio-wrap { width: min(100% - 2.5rem, 1152px); }
  .bio-section, .bio-contact { padding-block: 4rem; }
  .bio-module { padding-block: 4rem; }
  .bio-module-grid, .bio-hero-grid, .bio-paths, .bio-questions-layout, .bio-author-grid { grid-template-columns: minmax(0,1fr); }
  .bio-module-grid { gap: 2.5rem; }
  .bio-module-aside { padding: 1.75rem 0 0; border-left: 0; border-top: 1px solid rgb(213 234 226 / 30%); }
  .bio-module-aside blockquote { max-width: 31rem; font-size: 1.65rem; }
  .bio-header-inner { flex-direction: column; align-items: flex-start; gap: .75rem; padding-block: 1.25rem; }
  .bio-nav { width: 100%; justify-content: space-between; gap: .5rem 1rem; font-size: .875rem; }
  .bio-nav .bio-nav-home svg { display: none; }
  .bio-hero { padding-block: 3.25rem 4rem; }
  .bio-hero h1 { max-width: 32rem; font-size: clamp(2.65rem, 8.7vw, 3.7rem); }
  .bio-hero-photo { width: 100%; max-width: 31rem; margin-inline: auto !important; }
  .bio-hero-photo img { aspect-ratio: 1; object-position: center 43%; }
  .bio-hero-photo figcaption { gap: .25rem .75rem; }
  .bio-path { padding: 1.75rem; }
  .bio-path h3 { font-size: 1.85rem; }
  .bio-path .bio-button { width: 100%; }
  .bio-section-intro { margin-bottom: 2rem; }
  .bio-questions-layout, .bio-author-grid { gap: 2rem; }
  .bio-author-photo { max-width: 22rem; }
  .bio-footer-inner { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 420px) {
  .bio-actions { align-items: stretch; }
  .bio-actions .bio-button { width: 100%; }
  .bio-actions .bio-text-link { width: 100%; text-align: center; padding: .5rem 0; }
  .bio-steps { grid-template-columns: minmax(0,1fr); gap: 2rem; }
  .bio-path { padding: 1.5rem; }
  .bio-path-top .bio-eyebrow { max-width: 12rem; }
  .bio-button { padding-inline: 1.15rem; }
}
@media (prefers-reduced-motion: reduce) { [data-bio] *, [data-bio] *::before, [data-bio] *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }
@media print {
  .bio-header, .bio-actions, .bio-path .bio-button, .bio-contact .bio-button, .bio-footer-links, .bio-skip { display: none; }
  .bio-section, .bio-hero, .bio-contact { padding-block: 2rem; }
  .bio-module, .bio-contact { background: #fff; color: #29303d; }
  .bio-contact :is(h2,h2 em,p,.bio-eyebrow) { color: #29303d; }
  .bio-path, .bio-steps li { break-inside: avoid; }
}