/* ============================================================
   Paginas de procedimento (/<procedimento>-recreio/).
   Complementa styles.css; carrega so nessas paginas.
   Gerado junto com as paginas por ferramentas/paginas_victoria.py.
   ============================================================ */

.pg-hero{
  position:relative; overflow:hidden;
  padding:clamp(40px,5vw,64px) 0 clamp(56px,7vw,92px);
  background:
    radial-gradient(1100px 620px at 78% 8%, rgba(230,210,192,.55), transparent 62%),
    radial-gradient(760px 520px at 8% 92%, rgba(239,226,207,.6), transparent 60%),
    var(--cream);
}
.pg-hero__inner{ max-width:860px; }
.pg-hero h1{
  font-size:clamp(2.4rem,5.4vw,4.2rem); font-weight:300; letter-spacing:-.015em;
  line-height:1.08; margin-bottom:24px;
}
.pg-hero h1 em{ font-style:italic; color:var(--gold-deep); }
.pg-hero .lead{ max-width:700px; margin-bottom:34px; }
.pg-hero__cta{ display:flex; flex-wrap:wrap; gap:14px; }

.crumbs{ display:flex; flex-wrap:wrap; gap:8px; font-size:14px; color:var(--muted); margin-bottom:28px; letter-spacing:.02em; }
.crumbs a{ color:var(--gold-deep); }
.crumbs a:hover{ text-decoration:underline; }
.crumbs span[aria-hidden]{ opacity:.5; }

.facts{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  background:var(--line); border:1px solid var(--line); border-radius:var(--r-md);
  overflow:hidden; margin-top:clamp(40px,5vw,56px); max-width:860px;
}
.facts div{ background:var(--white); padding:22px 24px; }
.facts dt{ font-size:12.5px; letter-spacing:.2em; text-transform:uppercase; color:var(--muted); font-weight:500; margin-bottom:6px; }
.facts dd{ margin:0; font-family:var(--serif); font-size:1.6rem; color:var(--ink); line-height:1.2; }

.prose{ display:grid; grid-template-columns:.8fr 1.2fr; gap:clamp(32px,6vw,88px); align-items:start; }
.prose + .prose{ margin-top:clamp(56px,7vw,96px); }
.prose h2{ font-size:clamp(2rem,3.6vw,2.9rem); font-weight:300; }
.prose h2 em{ font-style:italic; color:var(--gold-deep); }
.prose__body p{ color:var(--ink-2); }
.prose__body h3{ font-size:1.6rem; margin:34px 0 14px; }

.checks{ display:grid; gap:14px; margin:6px 0 10px; }
.checks li{ display:flex; gap:14px; align-items:flex-start; font-size:17.5px; }
.checks li::before{
  content:""; flex:none; width:22px; height:22px; margin-top:4px; border-radius:50%;
  background:var(--gold-soft) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2396703f' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center/13px no-repeat;
}

.pg-faq{ display:grid; gap:12px; }
.pg-faq details{ border:1px solid var(--line); border-radius:var(--r-md); background:var(--white); transition:border-color .35s, box-shadow .35s; }
.pg-faq details[open]{ border-color:var(--gold-light); box-shadow:var(--shadow-s); }
.pg-faq summary{
  list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:18px;
  padding:22px 26px; font-size:18px; color:var(--ink);
}
.pg-faq summary::-webkit-details-marker{ display:none; }
.pg-faq summary::after{ content:"+"; flex:none; width:30px; height:30px; display:grid; place-items:center; border:1px solid var(--line); border-radius:50%; color:var(--gold-deep); font-size:20px; line-height:1; }
.pg-faq details[open] summary::after{ content:"–"; background:var(--gold); border-color:var(--gold); color:#fff; }
.pg-faq details p{ padding:0 26px 24px; margin:0; font-size:16.5px; color:var(--muted); }

.local{ display:grid; grid-template-columns:1fr 1fr; gap:clamp(28px,4vw,56px); align-items:center; }
.local__box{ background:var(--white); border:1px solid var(--line); border-radius:var(--r-lg); padding:clamp(28px,4vw,44px); }
.local__box p{ margin-bottom:.6em; }
.local__box strong{ color:var(--ink); font-weight:500; }

.rel{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:16px; }
.rel a{
  display:block; padding:24px 26px; border:1px solid var(--line); border-radius:var(--r-md);
  background:var(--white); transition:border-color .3s, transform .35s var(--ease), box-shadow .35s;
}
.rel a:hover{ border-color:var(--gold-light); transform:translateY(-3px); box-shadow:var(--shadow-s); }
.rel strong{ display:block; font-family:var(--serif); font-size:1.45rem; font-weight:400; color:var(--ink); margin-bottom:4px; }
.rel span{ font-size:15.5px; color:var(--muted); }

@media (max-width:1020px){
  .prose, .local{ grid-template-columns:1fr; }
}
@media (max-width:640px){
  .facts{ grid-template-columns:1fr; }
  .pg-hero__cta .btn{ width:100%; }
}
@media (max-width:420px){
  .cta .btn{ white-space:normal; text-align:center; }
}