/* Thuany Martins · identidade do site
   Paleta da marca: espresso #372216, taupe #917C6A, linho #F1EEEA, branco #FFFFFF.
   Títulos em Cormorant Garamond (o trecho final em itálico), texto em Jost. */
:root {
  --espresso: #372216;
  --espresso-2: #4A3123;
  --taupe: #917C6A;
  --taupe-claro: #C9B8A8;
  --linen: #F1EEEA;
  --white: #FFFFFF;
  --ink: #2A1A11;
  --ink-soft: #6A5546;
  --hair: #DCD2C8;
  --hair-dark: rgba(241, 238, 234, .18);
  --ok: #4F6B4A;
  --erro: #9A3B2E;
  --display: "Cormorant Garamond", Garamond, "Times New Roman", serif;
  --body: "Jost", "Helvetica Neue", Arial, sans-serif;
  --wrap: 1120px;
  color-scheme: light;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
  margin: 0; background: var(--linen); color: var(--ink);
  font-family: var(--body); font-weight: 300; font-size: 16px; line-height: 1.6;
}
a { color: inherit; }
img { max-width: 100%; }
.band {
  padding-left: max(20px, env(safe-area-inset-left, 0px));
  padding-right: max(20px, env(safe-area-inset-right, 0px));
}
.wrap { max-width: var(--wrap); margin: 0 auto; }
.narrow { max-width: 640px; margin: 0 auto; }
.skip { position: absolute; left: -999px; top: 8px; background: var(--espresso); color: var(--linen); padding: 8px 14px; z-index: 30; }
.skip:focus { left: 12px; }

/* ---------- Tipografia ---------- */
.eyebrow {
  margin: 0; font-size: 11.5px; font-weight: 500; letter-spacing: .26em; text-transform: uppercase; color: var(--taupe);
}
.dark .eyebrow { color: var(--taupe-claro); }
h1, h2, h3 { font-family: var(--display); font-weight: 300; letter-spacing: -.02em; text-wrap: balance; margin: 0; color: var(--espresso); }
.dark h1, .dark h2, .dark h3 { color: var(--linen); }
h1 { font-size: clamp(52px, 8.5vw, 112px); line-height: .9; }
h2 { font-size: clamp(40px, 5.2vw, 64px); line-height: .95; }
h3 { font-size: clamp(24px, 2.6vw, 30px); line-height: 1.12; font-weight: 400; letter-spacing: -.01em; }
h1 em, h2 em { font-style: italic; }
.lede { margin: 0; font-size: 18px; max-width: 46ch; color: var(--ink-soft); }
.dark .lede { color: #DDD2C8; }
p { margin: 0; }
.muted { color: var(--ink-soft); }

/* ---------- Barra superior ---------- */
.topbar { background: var(--espresso); color: var(--linen); }
.topbar .wrap { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block: 18px; border-bottom: 1px solid var(--hair-dark); }
.mark { font-family: var(--display); font-size: 24px; text-decoration: none; letter-spacing: -.3px; white-space: nowrap; }
.mark em { font-style: italic; }
.topbar nav { display: flex; gap: 22px; flex-wrap: wrap; justify-content: flex-end; }
.topbar nav a { font-size: 12px; letter-spacing: .18em; text-transform: uppercase; text-decoration: none; opacity: .8; }
.topbar nav a:hover, .topbar nav a:focus-visible, .topbar nav a[aria-current="page"] { opacity: 1; text-decoration: underline; text-underline-offset: 6px; }

/* ---------- Botões ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  padding: 15px 26px; border-radius: 999px; border: 1px solid transparent;
  font-family: var(--body); font-size: 13px; font-weight: 400; letter-spacing: .12em; text-transform: uppercase;
  text-decoration: none; cursor: pointer; transition: background .25s ease, color .25s ease, border-color .25s ease;
}
.btn svg { width: 14px; height: 14px; flex: none; }
.btn.dark-btn { background: var(--espresso); color: var(--linen); }
.btn.dark-btn:hover, .btn.dark-btn:focus-visible { background: var(--espresso-2); }
.btn.light-btn { background: var(--linen); color: var(--espresso); }
.btn.light-btn:hover, .btn.light-btn:focus-visible { background: var(--white); }
.btn.line { border-color: var(--hair); color: var(--espresso); background: transparent; }
.btn.line:hover, .btn.line:focus-visible { border-color: var(--espresso); }
.dark .btn.line { border-color: var(--hair-dark); color: var(--linen); }
.dark .btn.line:hover, .dark .btn.line:focus-visible { border-color: var(--linen); }
.btn:focus-visible { outline: 2px solid var(--taupe); outline-offset: 3px; }

/* ---------- Seções ---------- */
.dark { background: var(--espresso); color: var(--linen); }
.section { padding-block: 96px; }
.section:not(.dark):not(.paper) + .section:not(.dark):not(.paper) { padding-top: 0; }
[hidden] { display: none !important; }
.paper { background: var(--white); }
.section-head { display: flex; flex-direction: column; gap: 16px; margin-bottom: 48px; max-width: 720px; }
.split { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 56px; }
.split .section-head { margin: 0; position: sticky; top: 28px; align-self: start; }

/* Hero das páginas internas */
.hero { padding-block: 72px 88px; }
.hero-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 56px; align-items: end; }
.hero-text { display: flex; flex-direction: column; gap: 26px; min-width: 0; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; }
.facts { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 10px 28px; font-size: 14px; color: #DDD2C8; }
.facts li { display: flex; align-items: center; gap: 10px; }
.facts li::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: var(--taupe-claro); }

/* Retrato em arco */
.arch {
  width: 100%; max-width: 340px; aspect-ratio: 4 / 5; justify-self: end;
  border-radius: 999px 999px 0 0; overflow: hidden;
  background: linear-gradient(165deg, var(--taupe) 0%, var(--espresso-2) 100%);
  display: grid; place-items: center; border: 1px solid var(--hair-dark);
}
.arch img { width: 100%; height: 100%; object-fit: cover; display: block; }
.monogram { font-family: var(--display); font-style: italic; font-weight: 300; font-size: 96px; line-height: 1; color: var(--linen); opacity: .9; }

/* ---------- Linhas de índice (serviços, temas) ---------- */
.rows { border-top: 1px solid var(--espresso); }
.dark .rows { border-top-color: var(--linen); }
.row {
  display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 24px; align-items: center;
  padding: 26px 8px; border-bottom: 1px solid var(--hair); text-decoration: none;
  transition: background .3s ease, padding .3s ease;
}
.dark .row { border-bottom-color: var(--hair-dark); }
.row > div { min-width: 0; }
.row h3 { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; }
.row p { margin-top: 6px; color: var(--ink-soft); max-width: 56ch; font-size: 15.5px; }
.dark .row p { color: #D4C8BD; }
.go {
  width: 46px; height: 46px; border-radius: 50%; border: 1px solid var(--hair); color: var(--espresso);
  display: grid; place-items: center; transition: background .3s ease, color .3s ease, border-color .3s ease, transform .3s ease;
}
.go svg { width: 16px; height: 16px; }
a.row:hover, a.row:focus-visible { background: var(--white); padding-left: 20px; padding-right: 20px; }
a.row:hover .go, a.row:focus-visible .go { background: var(--espresso); color: var(--linen); border-color: var(--espresso); transform: rotate(-45deg); }
a.row:focus-visible { outline: 2px solid var(--espresso); outline-offset: -2px; }
.row.off { opacity: .6; }
.tag {
  font-family: var(--body); font-size: 10.5px; font-weight: 500; letter-spacing: .18em; text-transform: uppercase;
  padding: 4px 10px 3px; border-radius: 999px; white-space: nowrap;
}
.tag.new { background: var(--espresso); color: var(--linen); }
.tag.soft { border: 1px solid var(--taupe); color: var(--taupe); }

/* Lista de temas sem link */
.topics { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 48px; border-top: 1px solid var(--espresso); }
.topics > div { padding: 26px 0; border-bottom: 1px solid var(--hair); display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.topics p { color: var(--ink-soft); font-size: 15.5px; }

/* Passos (sequência real) */
.steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-top: 1px solid var(--hair-dark); counter-reset: passo; }
.steps.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.steps li { counter-increment: passo; padding: 28px 28px 8px 0; display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.steps li + li { padding-left: 28px; border-left: 1px solid var(--hair-dark); }
.steps li::before { content: counter(passo, decimal-leading-zero); font-family: var(--display); font-style: italic; font-size: 40px; line-height: 1; color: var(--taupe-claro); }
.steps strong { font-family: var(--display); font-weight: 400; font-size: 24px; line-height: 1.15; color: var(--linen); }
.steps p { font-size: 15px; color: #D4C8BD; }

/* Lista com marcador */
.ticks { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; border-top: 1px solid var(--hair); }
.ticks li { display: grid; grid-template-columns: 22px minmax(0, 1fr); gap: 12px; padding: 15px 0; border-bottom: 1px solid var(--hair); }
.ticks li::before { content: ""; width: 14px; height: 8px; margin-top: 8px; border-left: 1.5px solid var(--taupe); border-bottom: 1.5px solid var(--taupe); transform: rotate(-45deg); }
.note { margin-top: 22px; padding: 18px 20px; border-left: 2px solid var(--taupe); background: var(--white); font-size: 15px; color: var(--ink-soft); }

/* Sobre */
.about { display: grid; grid-template-columns: minmax(0, 260px) minmax(0, 1fr); gap: 56px; align-items: start; }
.about .arch { justify-self: start; max-width: 260px; }
.about-text { display: flex; flex-direction: column; gap: 18px; max-width: 62ch; }
.about-text p { color: var(--ink-soft); }
.creds { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.creds li { font-size: 13px; padding: 6px 12px; border: 1px solid var(--hair); border-radius: 999px; background: var(--white); }

/* ---------- Formulários ---------- */
.form-card { background: var(--white); border: 1px solid var(--hair); padding: clamp(24px, 4vw, 44px); display: flex; flex-direction: column; gap: 20px; }
.field { display: flex; flex-direction: column; gap: 8px; min-width: 0; }
.field label, .field legend { font-size: 14px; font-weight: 400; color: var(--espresso); padding: 0; }
.field label small, .field legend small { font-weight: 300; color: var(--ink-soft); }
input[type="text"], input[type="tel"], input[type="email"], input[type="number"], textarea {
  width: 100%; font: inherit; font-weight: 400; color: var(--ink); background: var(--linen);
  border: 1px solid transparent; border-bottom-color: var(--hair); padding: 13px 14px; border-radius: 0; -webkit-appearance: none; appearance: none;
}
textarea { min-height: 96px; resize: vertical; }
input:focus, textarea:focus { outline: none; border-color: var(--espresso); background: var(--white); }
input[aria-invalid="true"] { border-color: var(--erro); }
.err { font-size: 13px; color: var(--erro); min-height: 0; }
fieldset { border: 0; margin: 0; padding: 0; }
.checks { display: flex; flex-wrap: wrap; gap: 8px; }
.checks label { display: inline-flex; align-items: center; gap: 8px; padding: 9px 14px; border: 1px solid var(--hair); border-radius: 999px; font-size: 14px; cursor: pointer; background: var(--white); }
.checks input { accent-color: var(--espresso); margin: 0; }
.checks label:has(input:checked) { border-color: var(--espresso); background: var(--linen); }
.consent { display: grid; grid-template-columns: 18px minmax(0, 1fr); gap: 10px; font-size: 14px; color: var(--ink-soft); }
.consent input { accent-color: var(--espresso); margin-top: 4px; }
.form-foot { font-size: 13px; color: var(--ink-soft); }
.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }

/* ---------- Dúvidas ---------- */
details { border-bottom: 1px solid var(--hair); }
.faq { border-top: 1px solid var(--espresso); }
summary {
  list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 16px;
  padding: 18px 2px; font-size: 16px; font-weight: 400;
}
summary::-webkit-details-marker { display: none; }
summary::after { content: "+"; font-family: var(--display); font-size: 28px; line-height: 1; color: var(--taupe); transition: transform .25s ease; flex: none; }
details[open] summary::after { transform: rotate(45deg); }
summary:focus-visible { outline: 2px solid var(--espresso); outline-offset: 2px; }
details p { margin: 0 2px 20px; font-size: 15px; color: var(--ink-soft); max-width: 62ch; }

/* ---------- Rodapé ---------- */
.foot { background: var(--espresso); color: var(--linen); }
.foot-inner { padding-block: 72px 36px; display: flex; flex-direction: column; gap: 44px; }
.motto { margin: 0; font-family: var(--display); font-weight: 300; font-style: italic; font-size: clamp(38px, 6.5vw, 84px); line-height: .95; letter-spacing: -.02em; max-width: 14ch; color: var(--linen); }
.foot-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px 32px; padding-top: 22px; border-top: 1px solid var(--hair-dark); font-size: 13px; color: var(--taupe-claro); }
.foot-links { display: flex; flex-wrap: wrap; gap: 10px 22px; }
.foot-links a { text-decoration: none; letter-spacing: .14em; text-transform: uppercase; font-size: 11.5px; }
.foot-links a:hover, .foot-links a:focus-visible { color: var(--linen); text-decoration: underline; text-underline-offset: 6px; }

/* Aviso */
.toast {
  position: fixed; left: 50%; bottom: calc(24px + env(safe-area-inset-bottom, 0px)); z-index: 40;
  transform: translate(-50%, 12px); opacity: 0; pointer-events: none;
  background: var(--espresso); color: var(--linen); border: 1px solid var(--hair-dark);
  padding: 11px 20px; font-size: 14px; border-radius: 999px; transition: opacity .25s ease, transform .25s ease;
  max-width: calc(100% - 32px); text-align: center;
}
.toast.show { opacity: 1; transform: translate(-50%, 0); }

/* Entrada suave do topo, partindo de um estado visível */
@keyframes rise { from { transform: translateY(12px); } to { transform: none; } }
.hero-text > *, .hero .arch { animation: rise .8s cubic-bezier(.2,.7,.2,1) both; }

/* ---------- Responsivo ---------- */
@media (max-width: 880px) {
  .hero { padding-block: 48px 64px; }
  .hero-grid { grid-template-columns: 1fr; gap: 36px; }
  .hero-grid .arch { order: -1; justify-self: start; max-width: 200px; }
  .split { grid-template-columns: 1fr; gap: 28px; }
  .split .section-head { position: static; }
  .steps, .steps.four { grid-template-columns: 1fr; }
  .steps li, .steps li + li { padding: 22px 0; border-left: 0; }
  .steps li + li { border-top: 1px solid var(--hair-dark); }
  .about { grid-template-columns: 1fr; gap: 32px; }
  .about .arch { max-width: 200px; }
  .section { padding-block: 72px; }
}
@media (max-width: 600px) {
  .topics { grid-template-columns: 1fr; }
  .grid-2 { grid-template-columns: 1fr; }
  .row { padding: 22px 2px; gap: 16px; }
  a.row:hover, a.row:focus-visible { padding-left: 10px; padding-right: 10px; }
  .go { width: 40px; height: 40px; }
  .topbar nav { gap: 14px; }
  .topbar nav .hide-sm { display: none; }
  .btn { width: 100%; }
  .hero-actions .btn { width: auto; flex: 1 1 auto; }
}
@media (prefers-reduced-motion: reduce) {
  * { transition: none !important; animation: none !important; }
  html { scroll-behavior: auto; }
}


/* =========================================================
   Refinamento: topo claro, fotos em moldura com bloco deslocado,
   selos em pílula e seções com imagem.
   ========================================================= */
body::before { content: ""; position: fixed; inset: 0 0 auto; height: env(safe-area-inset-top, 0px); z-index: 25; background: var(--linen); }
.topbar { background: rgba(241, 238, 234, .92); color: var(--espresso); position: sticky; top: env(safe-area-inset-top, 0px); z-index: 20; -webkit-backdrop-filter: saturate(1.2) blur(10px); backdrop-filter: saturate(1.2) blur(10px); }
.topbar .wrap { border-bottom: 1px solid var(--hair); padding-block: 14px; }
.topbar nav { align-items: center; }
.topbar nav a { opacity: .75; }
.topbar nav a.cta {
  opacity: 1; text-decoration: none; background: var(--espresso); color: var(--linen);
  padding: 10px 18px 9px; border-radius: 999px; letter-spacing: .14em; font-size: 11.5px;
}
.topbar nav a.cta:hover, .topbar nav a.cta:focus-visible { background: var(--espresso-2); text-decoration: none; }

.hero:not(.dark) { border-bottom: 1px solid var(--hair); padding-block: 64px 96px; }
.facts { color: var(--ink-soft); gap: 8px; }
.facts li { padding: 7px 14px 6px; border: 1px solid var(--hair); border-radius: 999px; background: var(--white); font-size: 13.5px; }
.facts li::before { display: none; }
.dark .facts { color: #DDD2C8; }
.dark .facts li { background: transparent; border-color: var(--hair-dark); }
.hero:not(.dark) .status { border-color: var(--hair); color: var(--ink-soft); background: var(--white); }
.hero:not(.dark) .status::before { background: var(--taupe); }
.hero-text .form-foot { margin-top: -10px; }

/* Moldura de foto */
.frame { position: relative; margin: 0; width: 100%; max-width: 430px; justify-self: end; }
.frame::after {
  content: ""; position: absolute; inset: 34px -20px -20px 34px; border-radius: 24px;
  background: linear-gradient(160deg, var(--taupe-claro), var(--taupe)); opacity: .45; z-index: 0;
}
.frame.left { justify-self: start; }
.frame.left::after { inset: 34px 34px -20px -20px; }
.frame img {
  position: relative; z-index: 1; display: block; width: 100%; height: auto; aspect-ratio: 4 / 5;
  object-fit: cover; object-position: 50% 22%; border-radius: 24px;
  box-shadow: 0 34px 60px -34px rgba(55, 34, 22, .5);
}
.frame .badge {
  position: absolute; z-index: 2; left: -16px; bottom: 34px;
  display: inline-flex; align-items: center; gap: 9px;
  background: var(--white); color: var(--espresso); padding: 10px 16px 9px; border-radius: 999px;
  font-size: 13px; font-weight: 400; box-shadow: 0 14px 30px -14px rgba(55, 34, 22, .45);
}
.frame .badge::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--taupe); }
.frame.left .badge { left: auto; right: -16px; }
.frame.small { max-width: 320px; margin-top: 28px; }
.dark .frame::after { background: var(--taupe); opacity: .35; }
.hero .frame { animation: rise .8s cubic-bezier(.2,.7,.2,1) both; }

/* Seção foto + texto */
.media-split { display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); gap: 80px; align-items: center; }
.media-text { display: flex; flex-direction: column; gap: 18px; max-width: 58ch; }
.media-text > p { color: var(--ink-soft); }
.media-text .quote {
  margin-top: 6px; padding-left: 18px; border-left: 2px solid var(--taupe);
  font-family: var(--display); font-style: italic; font-size: 25px; line-height: 1.25; color: var(--espresso);
}

/* Página da bio em claro */
.bio-top:not(.dark) { border-bottom: 1px solid var(--hair); }
.bio-top:not(.dark) .arch { border-color: var(--hair); box-shadow: 0 30px 50px -32px rgba(55, 34, 22, .5); }

@media (max-width: 880px) {
  .hero-grid .frame { order: -1; justify-self: start; max-width: 340px; }
  .media-split { grid-template-columns: 1fr; gap: 48px; }
  .frame::after { inset: 26px -14px -14px 26px; }
  .frame.left::after { inset: 26px 26px -14px -14px; }
  .frame .badge { left: 12px; }
  .frame.left .badge { right: 12px; }
}
@media (max-width: 600px) {
  .topbar nav a.cta { padding: 9px 14px 8px; }
}

.foot { border-top: 1px solid var(--hair-dark); }

.motto { font-size: clamp(24px, 3.2vw, 38px); line-height: 1.15; max-width: none; }
.foot-inner { gap: 32px; padding-block: 56px 32px; }