/* Café da Manhã Fácil — estático, mobile-first (390px), caminhos relativos */

:root{
  --sage:#3F6F63; --sage-dark:#345C52;
  --creme:#FFF9F3; --creme-2:#FBF1E7;
  --cta:#F28C5B; --cta-dark:#E0763F;
  --aveia:#F3C969;
  --txt:#26332F; --txt-2:#6C7772;
  --card:#FFFFFF; --linha:#E9DFD3;

  --ff:"Plus Jakarta Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
  --fs-0:.82rem; --fs-1:.92rem; --fs-2:1rem; --fs-3:1.18rem; --fs-4:1.45rem; --fs-5:1.9rem; --fs-6:2.35rem;

  --sp-1:.35rem; --sp-2:.6rem; --sp-3:1rem; --sp-4:1.5rem; --sp-5:2.25rem; --sp-6:3.25rem;
  --r-1:10px; --r-2:16px; --r-3:20px;
  --sh-1:0 1px 2px rgba(38,51,47,.05), 0 2px 8px rgba(38,51,47,.05);
  --sh-2:0 6px 20px rgba(38,51,47,.09);
  --wrap:1080px; --wrap-txt:660px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0; background:var(--creme); color:var(--txt);
  font-family:var(--ff); font-weight:400; font-size:var(--fs-2); line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block}
h1,h2,h3,h4{color:var(--sage); line-height:1.25; margin:0 0 var(--sp-3)}
h1{font-size:var(--fs-6); font-weight:700}
h2{font-size:var(--fs-5); font-weight:700}
h3{font-size:var(--fs-3); font-weight:600}
h4{font-size:var(--fs-2); font-weight:600; color:var(--txt)}
p{margin:0 0 var(--sp-3)}
a{color:var(--sage-dark); text-decoration:underline; text-underline-offset:2px}
strong{font-weight:600}

.skip{position:absolute; left:-9999px; top:0; background:var(--sage); color:#fff; padding:.6rem 1rem; z-index:200}
.skip:focus{left:8px; top:8px}

:focus-visible{outline:3px solid var(--sage); outline-offset:2px; border-radius:6px}

/* NAV */
.nav{position:sticky; top:0; z-index:100; background:rgba(255,249,243,.94);
  backdrop-filter:saturate(1.1) blur(6px); border-bottom:1px solid var(--linha)}
.nav__inner{max-width:var(--wrap); margin:0 auto; padding:.55rem var(--sp-3);
  display:flex; flex-direction:column; gap:.3rem}
.nav__brand{font-weight:700; color:var(--sage); text-decoration:none; font-size:var(--fs-2)}
.nav__links{display:flex; gap:.25rem .9rem; flex-wrap:wrap; font-size:var(--fs-0)}
.nav__links a{color:var(--txt-2); text-decoration:none; font-weight:500; padding:.2rem 0}
.nav__links a:hover{color:var(--sage)}
@media(min-width:720px){
  .nav__inner{flex-direction:row; align-items:center; justify-content:space-between}
  .nav__links{font-size:var(--fs-1)}
}

main{max-width:var(--wrap); margin:0 auto; padding:0 var(--sp-3)}

/* HERO */
.hero{display:grid; gap:var(--sp-4); padding:var(--sp-5) 0 var(--sp-4)}
.hero__media{border-radius:var(--r-3); overflow:hidden; box-shadow:var(--sh-1); border:1px solid var(--linha)}
.hero__media img{display:block; width:100%; height:auto}
.hero__headline{font-size:var(--fs-3); font-weight:600; color:var(--txt)}
.hero__support{color:var(--txt-2)}
@media(min-width:860px){
  .hero{grid-template-columns:1fr 1fr; align-items:center; padding:var(--sp-6) 0 var(--sp-5)}
  h1{font-size:2.8rem}
}

.intro{max-width:var(--wrap-txt); margin:0 auto var(--sp-5); padding:var(--sp-3) 0}
.intro__nota{font-size:var(--fs-1); color:var(--txt-2); background:var(--creme-2);
  border-left:3px solid var(--aveia); padding:.7rem .9rem; border-radius:0 var(--r-1) var(--r-1) 0}

/* BOTÕES */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:.4rem;
  min-height:48px; padding:.75rem 1.4rem; border-radius:var(--r-2); border:2px solid transparent;
  font-family:inherit; font-weight:600; font-size:var(--fs-2); cursor:pointer; text-decoration:none;
  line-height:1.2; text-align:center}
.btn--cta{background:var(--cta); color:#3a2314; border-color:var(--cta)}
.btn--cta:hover{background:var(--cta-dark); border-color:var(--cta-dark); color:#fff}
.btn--ghost{background:transparent; color:var(--sage-dark); border-color:var(--linha)}
.btn--ghost:hover{border-color:var(--sage); background:#fff}

/* SEÇÕES */
.secao{padding:var(--sp-5) 0; border-top:1px solid var(--linha)}
.secao--alt{background:var(--creme-2); border-radius:var(--r-3); padding:var(--sp-5) var(--sp-3); margin:var(--sp-4) 0}
.secao__sub{color:var(--txt-2); max-width:var(--wrap-txt)}
.secao__nota{font-size:var(--fs-1); color:var(--txt-2); margin-top:var(--sp-3)}

/* DECISÃO */
.decisao{display:grid; gap:var(--sp-4); margin-top:var(--sp-4)}
.decisao__grupo h3{margin-bottom:var(--sp-2)}
.decisao__opts{display:flex; flex-wrap:wrap; gap:var(--sp-2)}
.opt{display:inline-flex; align-items:center; min-height:48px; padding:.7rem 1.1rem;
  background:var(--card); border:1.5px solid var(--linha); border-radius:var(--r-2);
  font-family:inherit; font-size:var(--fs-1); font-weight:600; color:var(--txt); cursor:pointer;
  text-decoration:none}
.opt:hover{border-color:var(--sage); color:var(--sage)}
.opt[aria-pressed="true"],.opt.is-on{background:var(--sage); color:#fff; border-color:var(--sage)}
@media(min-width:720px){.decisao{grid-template-columns:1fr 1fr}}

/* INGREDIENTES / TOGGLES */
.ingredientes,.filtros{display:flex; flex-wrap:wrap; gap:var(--sp-2); margin:var(--sp-4) 0 var(--sp-3)}
.toggle,.chip-toggle{min-height:44px; padding:.55rem 1rem; border-radius:999px;
  border:1.5px solid var(--linha); background:var(--card); color:var(--txt);
  font-family:inherit; font-size:var(--fs-1); font-weight:500; cursor:pointer}
.toggle:hover,.chip-toggle:hover{border-color:var(--sage)}
.toggle[aria-pressed="true"],.chip-toggle[aria-pressed="true"]{
  background:var(--sage); color:#fff; border-color:var(--sage); font-weight:600}
.ingredientes__contador,.contador{font-weight:600; color:var(--sage); margin:var(--sp-2) 0}
.ingredientes__result{display:grid; gap:var(--sp-2)}
.ing-item{display:flex; gap:.7rem; align-items:center; background:var(--card); border:1px solid var(--linha);
  border-radius:var(--r-1); padding:.6rem .8rem; text-decoration:none; color:var(--txt)}
.ing-item b{color:var(--sage); font-weight:700}
.ing-item span{color:var(--txt-2); font-size:var(--fs-1)}
.aviso{background:var(--creme-2); border:1px dashed var(--aveia); border-radius:var(--r-1);
  padding:.8rem 1rem; color:var(--txt)}

/* QUIZ */
.quiz{display:grid; gap:var(--sp-3); max-width:var(--wrap-txt); margin-top:var(--sp-4)}
.quiz fieldset{border:1px solid var(--linha); border-radius:var(--r-2); padding:.9rem 1rem; margin:0}
.quiz legend{font-weight:600; color:var(--sage); padding:0 .4rem}
.quiz label{display:inline-flex; align-items:center; gap:.4rem; margin:.3rem .9rem .3rem 0; font-size:var(--fs-1)}
.quiz input{width:1.1rem; height:1.1rem; accent-color:var(--sage)}
.escolha-result{margin-top:var(--sp-4)}
.escolha-card{background:var(--card); border:1px solid var(--linha); border-radius:var(--r-3);
  overflow:hidden; box-shadow:var(--sh-2); max-width:440px}
.escolha-card img{width:100%; height:auto}
.escolha-card__body{padding:var(--sp-3)}
.escolha-card__hoje{font-size:var(--fs-0); font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--cta-dark)}
.escolha-card h3{margin:.2rem 0}
.escolha-card__acoes{display:flex; gap:var(--sp-2); flex-wrap:wrap; margin-top:var(--sp-3)}

/* GRID DE CARDS */
.grid{display:grid; gap:var(--sp-3); grid-template-columns:1fr}
@media(min-width:560px){.grid{grid-template-columns:1fr 1fr}}
@media(min-width:900px){.grid{grid-template-columns:1fr 1fr 1fr}}
.card{display:flex; flex-direction:column; background:var(--card); border:1px solid var(--linha);
  border-radius:var(--r-2); overflow:hidden; text-decoration:none; color:var(--txt); box-shadow:var(--sh-1)}
.card:hover{box-shadow:var(--sh-2); transform:translateY(-2px)}
@media (prefers-reduced-motion:reduce){.card:hover{transform:none}}
.card__img{display:block; aspect-ratio:4/3; background:var(--creme-2)}
.card__img img{width:100%; height:100%; object-fit:cover}
.card__body{padding:.8rem .9rem 1rem; display:flex; flex-direction:column; gap:.3rem}
.card__num{font-size:var(--fs-0); font-weight:600; color:var(--txt-2)}
.card__name{font-weight:700; color:var(--sage); font-size:var(--fs-2); line-height:1.3}
.card__meta{font-size:var(--fs-1); color:var(--txt-2)}
.card__chips{list-style:none; margin:.35rem 0 0; padding:0; display:flex; flex-wrap:wrap; gap:.3rem}
.card__chips .chip{font-size:var(--fs-0); background:var(--creme-2); border:1px solid var(--linha);
  padding:.15rem .5rem; border-radius:999px; color:var(--txt-2)}
.card.is-hidden{display:none}

.sem-resultado{background:var(--card); border:1px solid var(--linha); border-radius:var(--r-2);
  padding:var(--sp-4); text-align:center}

/* CHECKLIST / LISTAS */
.checklist,.lista{list-style:none; padding:0; margin:var(--sp-3) 0; display:grid; gap:var(--sp-2)}
.checklist li,.lista li{background:var(--card); border:1px solid var(--linha); border-radius:var(--r-1); padding:.6rem .8rem}
.checklist label{display:flex; gap:.6rem; align-items:flex-start; cursor:pointer}
.checklist input{margin-top:.2rem; width:1.1rem; height:1.1rem; accent-color:var(--sage)}
.lista li{list-style:none}
.lista-num{padding-left:1.2rem; display:grid; gap:var(--sp-2)}
@media(min-width:640px){.checklist{grid-template-columns:1fr 1fr}}

/* SEMANA */
.semana{display:grid; gap:var(--sp-3); grid-template-columns:1fr; margin-top:var(--sp-4)}
@media(min-width:560px){.semana{grid-template-columns:1fr 1fr}}
@media(min-width:900px){.semana{grid-template-columns:1fr 1fr 1fr}}
.dia{display:flex; flex-direction:column; min-width:0; background:var(--card); border:1px solid var(--linha);
  border-radius:var(--r-2); overflow:hidden; text-decoration:none; color:var(--txt); box-shadow:var(--sh-1)}
.dia__img{display:block; width:100%; aspect-ratio:4 / 3; overflow:hidden; background:var(--creme-2)}
.dia__img img{display:block; width:100%; height:100%; object-fit:cover}
.dia__nome{font-weight:700; color:var(--sage); padding:.7rem .9rem 0}
.dia__receita{padding:.15rem .9rem; font-size:var(--fs-1); overflow-wrap:break-word}
.dia__meta{padding:0 .9rem .9rem; font-size:var(--fs-0); color:var(--txt-2)}
.semana__prep{margin-top:var(--sp-4); background:var(--card); border:1px solid var(--linha);
  border-radius:var(--r-2); padding:var(--sp-3)}
.semana__prep ol{margin:0; padding-left:1.2rem}

/* RECEITAS COMPLETAS */
.grupo{margin:var(--sp-5) 0 var(--sp-3); padding-bottom:.4rem; border-bottom:2px solid var(--aveia)}
.receitas{display:grid; gap:var(--sp-4)}
.receita{background:var(--card); border:1px solid var(--linha); border-radius:var(--r-3);
  padding:var(--sp-4); box-shadow:var(--sh-1); scroll-margin-top:110px}
.receita__img{width:100%; max-width:520px; aspect-ratio:4 / 3; margin:0 auto var(--sp-3);
  border-radius:var(--r-2); overflow:hidden; border:1px solid var(--linha); background:var(--creme-2)}
.receita__img img{display:block; width:100%; height:100%; object-fit:cover}
@media(max-width:560px){.receita__img{max-width:100%}}
.receita__nome{display:flex; gap:.6rem; align-items:baseline; font-size:var(--fs-4)}
.receita__num{font-size:var(--fs-2); font-weight:700; color:#fff; background:var(--sage);
  border-radius:8px; padding:.1rem .45rem; flex:none}
.receita__meta{display:flex; flex-wrap:wrap; gap:.3rem 1rem; font-size:var(--fs-1); color:var(--txt-2)}
.receita__meta strong{color:var(--txt)}
.receita__nota{font-size:var(--fs-1); color:var(--txt-2); font-style:italic}
.receita__chips{list-style:none; padding:0; margin:var(--sp-3) 0; display:flex; flex-wrap:wrap; gap:.4rem}
.receita__chips .chip{font-size:var(--fs-0); background:var(--creme-2); border:1px solid var(--linha);
  padding:.25rem .6rem; border-radius:999px; color:var(--txt)}
.receita__aler{font-size:var(--fs-1); background:#FDF3E9; border:1px solid var(--aveia);
  border-radius:var(--r-1); padding:.6rem .8rem; color:var(--txt)}
.receita__ings{padding:0; list-style:none; display:grid; gap:.3rem}
.receita__ings li{padding-left:1.4rem; position:relative}
.receita__ings li::before{content:""; position:absolute; left:0; top:.45em; width:.7rem; height:.7rem;
  border:2px solid var(--sage); border-radius:4px}
.receita__passos{padding-left:1.3rem; display:grid; gap:.45rem}
.receita__passos li{padding-left:.2rem}
.receita__extra{font-size:var(--fs-1); background:var(--creme-2); border-radius:var(--r-1);
  padding:.55rem .8rem; margin:.4rem 0}
.receita__extra strong{color:var(--sage)}
.receita__voltar{margin-top:var(--sp-3); font-size:var(--fs-1)}

/* TABELA */
.tabela-wrap{overflow-x:auto; -webkit-overflow-scrolling:touch; margin:var(--sp-3) 0}
table{border-collapse:collapse; width:100%; min-width:420px; background:var(--card);
  border:1px solid var(--linha); border-radius:var(--r-1); overflow:hidden}
th,td{text-align:left; padding:.6rem .8rem; border-bottom:1px solid var(--linha); font-size:var(--fs-1)}
th{background:var(--creme-2); color:var(--sage); font-weight:600}
tr:last-child td{border-bottom:0}

/* RODAPÉ */
.rodape{max-width:var(--wrap); margin:var(--sp-6) auto 0; padding:var(--sp-5) var(--sp-3);
  border-top:1px solid var(--linha); color:var(--txt-2); font-size:var(--fs-1)}
.rodape__inner{display:flex; flex-direction:column; gap:.65rem}
.rodape__produto,.rodape__descricao,.rodape__mini,.rodape__copyright{margin:0}
.rodape__produto{color:var(--sage)}
.rodape__mini,.rodape__copyright{font-size:var(--fs-0)}
.rodape__nav{display:flex; flex-wrap:wrap; gap:.4rem 1rem; margin:.4rem 0}
.rodape__nav a{color:var(--sage-dark)}

.voltar-topo{position:fixed; right:14px; bottom:14px; z-index:90; min-height:44px;
  padding:.55rem .9rem; border-radius:999px; border:1.5px solid var(--linha);
  background:rgba(255,249,243,.96); color:var(--sage-dark); font-family:inherit; font-weight:600;
  font-size:var(--fs-0); cursor:pointer; box-shadow:var(--sh-1)}
.voltar-topo:hover{border-color:var(--sage)}

/* IMPRESSÃO — a versão online não é otimizada para impressão.
   A versão diagramada em PDF é comercializada separadamente. */
@media print{
  body{display:none !important}
}