/* Refinamentos delicados aprovados para a prévia do Encanto em Páginas. */
.page-home .hero{
  background:radial-gradient(ellipse at 80% 20%,#efe3f0 0%,#f5e9ee 26%,transparent 54%),
             linear-gradient(118deg,#fffaf7 0%,#f9eeeb 55%,#f5eaf0 100%);
}
.page-home .blob{background:#ecd1d5;opacity:.82}
.page-home .art-stage .main-book{animation:encanto-flutua 7s ease-in-out infinite}
.page-home .art-stage .star{animation:encanto-brilha 5s ease-in-out infinite}
.page-home .art-stage .star.two{animation-delay:1.3s}
@keyframes encanto-flutua{0%,100%{transform:rotate(8deg) translateY(0)}50%{transform:rotate(7deg) translateY(-8px)}}
@keyframes encanto-brilha{0%,100%{opacity:.45}50%{opacity:1}}

.title-heart{
  display:inline-block;vertical-align:baseline;margin-left:.12em;
  font-size:.68em;font-weight:500;color:#9d6b89;opacity:.85;
  transform:translateY(-.13em);
}
.page-home #como-funciona .steps-intro-action{text-align:center;margin:29px auto 0}
.page-home #como-funciona .steps-intro-action .button{font-size:14px}
.page-home #como-funciona .step{min-height:218px}

/* Recadinhos e autorização opcional: a mesma delicadeza da marca, sem ocre. */
.stories-section{background:linear-gradient(135deg,#fffaf8 0%,#f9eef2 100%)}
.story-form{background:#fffdfc;border:1px solid #ebd6e0;border-radius:25px;padding:30px;box-shadow:0 17px 35px #875a7d14}
.story-form input[type=text],.story-form textarea{border:1px solid #dfced8;border-radius:13px;background:#fffdfe;color:#5b4651;outline-color:#a87d99}
.story-form .media-drop{background:#f9eff4;color:#895c7e;border:1px dashed #d8b6c9;border-radius:16px}
.story-form .media-drop small,.story-form .intro{color:#806b77}
.sharing-choice{background:#fbf2f6;border:1px solid #e6cfdc;border-radius:18px;color:#67495d}
.sharing-choice>p,.sharing-choice .permission-note{color:#806b77}
.sharing-choice .permission{background:#fffdfd;border:1px solid #e5d2dc}
.sharing-choice .permission span{color:#624e5c}
.sharing-choice .permission input{accent-color:#875a7d}
.sharing-choice a{color:#82516f;text-decoration-thickness:1px}
.story-form .story-result{background:#f7eaf1;border:1px dashed #d9bacb}
.story-rating{border:1px solid #ead6e1;border-radius:16px;padding:14px 16px 10px;margin:0 0 19px;background:#fff9fc}
.story-rating legend{font-size:13px;font-weight:700;color:#644959;padding:0 5px}
.story-rating legend small{font-size:11px;font-weight:400;color:#8d7985}
.rating-options{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin-top:2px}
.rating-option{position:relative;display:flex!important;flex-direction:column;align-items:center;justify-content:center;gap:0;width:48px;min-height:50px;margin:0!important;border:1px solid #e8d9e2;border-radius:12px;background:#fff;color:#c4aab9;cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.rating-option span{font-size:24px;line-height:1.2}
.rating-option small{font-size:10px;color:#806a78;font-weight:500}
.rating-option input{position:absolute;opacity:0;width:100%;height:100%;inset:0;cursor:pointer}
.rating-option:has(input:checked){background:#f0dbe7;color:#8b5b7d;border-color:#b987a5}
.rating-option:focus-within{outline:2px solid #a67998;outline-offset:3px}
.rating-option:hover{background:#f7eaf1;color:#885573}
.story-rating .rating-help{font-size:11px;color:#8a7580;margin:8px 0 0}

/* A pessoa escolhe se quer misturar os temas da capa ou destacar um favorito. */
.cover-preference{margin:19px 0 6px;padding:17px 19px 14px;background:#fcf5f9;border:1px solid #ead4e0;border-radius:18px}
.cover-preference .field{margin-bottom:12px}
.cover-preference .field[hidden]{display:none!important}
.cover-preference label{color:#684f60}
.cover-preference select{width:100%;max-width:100%;background:#fffdfd;border-color:#e4cddb}
.cover-preference .note{margin:0;color:#826c7a;line-height:1.55;font-size:12px}

/* Respostas leves, sem uma pilha de caixas brancas fortes. */
.page-home #duvidas,.page-order #duvidas{background:linear-gradient(135deg,#fbf0ee,#f8eff4)}
#duvidas .faq-grid details{background:rgba(255,255,255,.54);border:1px solid rgba(212,174,194,.56);border-radius:17px;box-shadow:0 3px 12px #9d708010;margin-bottom:12px;backdrop-filter:blur(3px)}
#duvidas .faq-grid details[open]{background:rgba(255,252,253,.84);border-color:#dcb8cb}
#duvidas .faq-grid summary:focus-visible{outline:2px solid #875a7d;outline-offset:4px}

/* Bilhetinho claro, com o manuscrito em marrom aconchegante. */
.page-home .last-call{margin:48px auto 82px;padding:37px 24px 39px;background:linear-gradient(135deg,#fffefd 0%,#fffbf8 70%,#faf4f3 100%);border:1px solid #e9ddd9;box-shadow:0 12px 30px #80655a13;border-radius:29px}
.page-home .last-call::before{display:none}
.page-home .last-call h2{font-size:clamp(27px,3vw,37px);line-height:1.22;font-weight:500;letter-spacing:-.7px;max-width:670px;margin:0 auto 13px;color:#574238}
.page-home .last-call h2 .written-accent{font:700 1.35em/1 Caveat,cursive;color:#674636;white-space:nowrap;text-shadow:0 1px 0 #fffdfa}
.page-home .last-call p{font-size:14px;margin:0 auto 20px;max-width:510px;line-height:1.7}
.contact-section .kicker{font:700 23px Caveat,cursive;text-transform:none;letter-spacing:.2px;color:#9b6e81}
.contact-section{background:#fffaf8;border-top:1px solid #f0e2e7}
.footer-brand{display:flex;align-items:center;gap:11px}
.footer-brand img{flex:0 0 41px;width:41px;height:41px}
.footer-brand span{line-height:1.5}
footer .foot{color:#78665e}
footer .foot a{color:#78576c;text-decoration:underline;text-underline-offset:3px}

.pricing-list>a.pricing-option{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:8px;min-height:155px;padding:13px 9px;border:1px solid #e2caba;
  border-radius:17px;background:#fffdfb;color:inherit;text-decoration:none;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease,background .2s ease;
}
.pricing-list>a.pricing-featured{border:2px solid #ad7b96;background:#f8eff2}
.pricing-list>a.pricing-option .pricing-badge{display:block;height:19px;line-height:19px;flex:0 0 19px;font:600 15px/19px Caveat,cursive;position:static!important;transform:none!important;color:#9b6784;white-space:nowrap}
.pricing-list>a.pricing-option strong{display:block;line-height:1.25;white-space:nowrap}
.pricing-list>a.pricing-option span{display:block;line-height:1.2}
.pricing-list>a.pricing-option:hover,.pricing-list>a.pricing-option:focus-visible{
  background:#f8eff3;border-color:#a47794;box-shadow:0 9px 25px #875a7d1e;
  transform:translateY(-4px);outline-offset:3px;
}
.pricing-list>a.pricing-option .option-cta{font:600 12px 'DM Sans',sans-serif;color:#82577c;margin-top:2px}
.pricing-list>a.pricing-option .option-cta:after{content:' ↗'}

/* Com a janela dividida, o menu vira compacto antes de espremer a marca. */
@media (min-width:701px) and (max-width:1180px){
  header{height:78px;padding:0 28px;gap:18px}
  header .brand{flex:0 0 auto;min-width:max-content}
  header .brand-mark{flex:0 0 auto}
  header .menu{display:block;flex:0 0 auto;margin-left:auto}
  header nav{
    display:none;position:absolute;top:78px;right:23px;left:auto;
    width:min(325px,calc(100vw - 46px));padding:18px;
    flex-direction:column;align-items:stretch;gap:7px;
    background:#fffaf8;border:1px solid #eddce5;border-radius:0 0 20px 20px;
    box-shadow:0 16px 24px #49382f1a;font-size:14px;
  }
  header nav.open{display:flex}
  header nav a{padding:8px 10px}
  header nav .nav-cta{margin-top:5px;text-align:center;padding:12px 17px}
}
@media (min-width:701px) and (max-width:980px){
  .page-home .hero h1{font-size:clamp(36px,5vw,49px);letter-spacing:-1.4px;text-wrap:balance}
  .page-home .hero-in{gap:12px}
}
@media (min-width:701px) and (max-width:820px){
  .page-home .hero-in{grid-template-columns:1fr;padding-top:55px}
  .page-home .hero-in>div:first-child{max-width:640px}
  .page-home .art-stage{min-height:440px;margin:-45px auto -30px;transform:scale(.78);width:100%}
}

@media(max-width:620px){
  .story-form{padding:21px}
  .rating-option{width:44px;min-height:49px}
  .pricing-list{grid-template-columns:1fr;gap:10px;max-width:350px}
  .pricing-list>a.pricing-option{min-height:128px;padding:12px 8px;gap:5px}
  .pricing-list>a.pricing-option strong{font-size:16px;text-align:center}
  .pricing-list>a.pricing-option span{font-size:18px}
  .pricing-list>a.pricing-option .option-cta{font-size:12px}
  .page-home .last-call{padding:30px 20px;margin-bottom:56px}
  .page-home .last-call h2{font-size:29px}
}
@media(prefers-reduced-motion:reduce){
  .page-home .art-stage .main-book,.page-home .art-stage .star{animation:none}
  .pricing-list>a.pricing-option{transition:none}
}