/* Cardápio digital da Horta Facilita: cores do logo, creme e os legumes. */
:root{
  --creme:#FFFBEF; --papel:#FAF4E2; --linha:rgba(5,66,36,.12);
  --floresta:#054224; --floresta-e:#032D18; --folha:#4D901D; --folha-e:#3A7414; --lima:#B3CD61;
  --cenoura:#EE7A1E; --cenoura-e:#C9580A; --beterraba:#8A1838;
  --tinta:#12261A; --cinza:#4A5E50;
  --t-marca:'Fredoka','Plus Jakarta Sans',sans-serif; --t-texto:'Plus Jakarta Sans',system-ui,sans-serif;
  --ease:cubic-bezier(.16,1,.3,1);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:70px}
body{margin:0;background:var(--creme);color:var(--tinta);font:500 15px/1.5 var(--t-texto);-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%}
button,input,textarea{font:inherit;color:inherit}
h2,p{margin:0}

/* topo */
.topo{position:relative;max-width:560px;margin:0 auto;padding:0 16px}
.topo__fotos{display:grid;grid-template-columns:1fr 1.25fr 1fr;gap:8px;padding-top:14px}
.topo__fotos img{width:100%;height:170px;object-fit:cover;border-radius:22px}
.topo__fotos img:nth-child(2){height:200px;margin-top:-14px;border-radius:26px}
.topo__card{position:relative;margin:-56px 6px 0;padding:18px 18px 22px;border-radius:28px;background:var(--creme);text-align:center;box-shadow:0 24px 40px -30px rgba(3,45,24,.6)}
.topo__logo{width:min(230px,62%);margin:0 auto;height:auto}
.topo__sub{margin-top:10px;font-size:15.5px;color:var(--cinza)}
.selos{list-style:none;margin:14px 0 0;padding:0;display:flex;justify-content:center;flex-wrap:wrap;gap:6px}
.selos li{padding:6px 11px;border-radius:99px;background:#fff;border:1px solid var(--linha);font:600 12.5px/1 var(--t-marca);color:var(--floresta)}
.topo__local{margin-top:12px;font-size:13px;font-weight:700;color:var(--folha-e)}

/* abas */
.abas{position:sticky;top:0;z-index:10;display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;padding:12px 16px;margin-top:16px;background:rgba(255,251,239,.94);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--linha)}
.abas::-webkit-scrollbar{display:none}
.abas a{flex:none;padding:8px 14px;border-radius:99px;background:#fff;border:1px solid var(--linha);text-decoration:none;font:600 13.5px/1 var(--t-marca);color:var(--floresta)}
.abas a:focus-visible{outline:3px solid var(--cenoura);outline-offset:2px}
@media (min-width:600px){.abas{justify-content:center}}

.conteudo{max-width:560px;margin:0 auto;padding:6px 16px 120px}
.bloco{padding-top:26px}
.tit{font:700 24px/1.15 var(--t-marca);color:var(--floresta)}
.precos{margin-top:12px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.precos div{padding:14px 6px;border-radius:18px;background:var(--floresta);color:var(--creme);text-align:center}
.precos b{display:block;font:700 15px/1 var(--t-marca);color:var(--lima)}
.precos span{display:block;margin-top:6px;font:700 21px/1 var(--t-marca)}
.precos .destaque{background:var(--cenoura);color:#2A1200}
.precos .destaque b{color:#5A2600}
.obs{margin-top:10px;font-size:13.5px;color:var(--cinza)}

.cab{display:flex;align-items:center;gap:14px;padding:10px;border-radius:22px;background:var(--papel);border:1px solid var(--linha)}
.cab img{width:84px;height:84px;object-fit:cover;border-radius:16px;flex:none}
.cab p{margin-top:3px;font-size:13.5px;color:var(--cinza)}

.lista{margin-top:10px;display:grid;gap:8px}
.item{padding:14px 14px 12px;border-radius:20px;background:#fff;border:1px solid var(--linha)}
.item__linha{display:flex;align-items:flex-start;gap:10px}
.item__txt{flex:1;min-width:0}
.item__nome{font:700 16.5px/1.2 var(--t-marca);color:var(--floresta)}
.item__desc{margin-top:3px;font-size:13px;color:var(--cinza);line-height:1.4}
.item__preco{flex:none;font:700 15px/1.2 var(--t-marca);color:var(--cenoura-e);white-space:nowrap}
.item__preco.consulta{color:var(--cinza);font-size:13px}
.opcoes{margin-top:10px;display:flex;flex-wrap:wrap;gap:6px}
.opcoes button{padding:7px 11px;border-radius:99px;border:1.5px solid var(--linha);background:var(--creme);font:600 13px/1 var(--t-marca);color:var(--floresta);cursor:pointer}
.opcoes button[aria-pressed="true"]{background:var(--floresta);border-color:var(--floresta);color:var(--creme)}
.opcoes--peso button[aria-pressed="true"]{background:var(--folha);border-color:var(--folha)}
.opcoes button:focus-visible,.add:focus-visible{outline:3px solid var(--cenoura);outline-offset:2px}
.item__acao{margin-top:12px;display:flex;align-items:center;justify-content:space-between;gap:10px}
.item__rotulo{font-size:12px;font-weight:700;color:var(--folha-e);letter-spacing:.04em;text-transform:uppercase}
.add{display:inline-flex;align-items:center;gap:8px;padding:10px 16px;border:0;border-radius:14px;background:var(--cenoura);color:#2A1200;font:700 14.5px/1 var(--t-marca);cursor:pointer;transition:transform .15s var(--ease)}
.add:active{transform:scale(.97)}
.add.ok{background:var(--folha);color:#fff}

.frase{margin:34px 0 0;text-align:center;font:700 26px/1.2 'Caveat',cursive;color:var(--folha-e)}

.rodape{padding:34px 16px 120px;background:var(--floresta);color:var(--creme);text-align:center;display:grid;justify-items:center;gap:10px}
.rodape img{width:140px;height:auto}
.rodape a{color:var(--lima);font-weight:700}
.rodape__copy{font-size:12.5px;color:rgba(255,251,239,.7)}
.selo-b2{display:inline-flex;align-items:center;gap:8px;margin-top:4px;padding:7px 12px;border-radius:99px;border:1px solid rgba(255,255,255,.2);font-size:12px;color:rgba(255,251,239,.8)!important;font-weight:500!important;text-decoration:none}

/* barra e sacola */
.barra{position:fixed;left:0;right:0;bottom:0;z-index:20;padding:10px 12px calc(10px + env(safe-area-inset-bottom))}
.barra__btn{display:flex;align-items:center;gap:12px;width:100%;max-width:536px;margin:0 auto;padding:14px 16px;border:0;border-radius:18px;background:var(--floresta);color:var(--creme);cursor:pointer;box-shadow:0 18px 30px -12px rgba(3,45,24,.6)}
.barra__qtd{display:grid;place-items:center;min-width:30px;height:30px;padding:0 6px;border-radius:10px;background:var(--cenoura);color:#2A1200;font:700 15px/1 var(--t-marca)}
.barra__txt{flex:1;text-align:left;font:700 16px/1 var(--t-marca)}
.barra__total{font:700 16px/1 var(--t-marca);color:var(--lima)}
.sacola{position:fixed;inset:0;z-index:30}
.sacola__fundo{position:absolute;inset:0;background:rgba(3,45,24,.45)}
.sacola__painel{position:absolute;left:0;right:0;bottom:0;max-width:560px;margin:0 auto;max-height:88vh;overflow:auto;padding:18px 16px calc(18px + env(safe-area-inset-bottom));border-radius:26px 26px 0 0;background:var(--creme);animation:sobe .35s var(--ease)}
@keyframes sobe{from{transform:translateY(40px);opacity:0}}
.sacola__topo{display:flex;align-items:center;justify-content:space-between}
.sacola__topo h2{font:700 22px/1 var(--t-marca);color:var(--floresta)}
.fechar{width:38px;height:38px;border:0;border-radius:12px;background:#fff;font-size:24px;line-height:1;cursor:pointer}
.sacola__itens{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:8px}
.sacola__itens li{display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:16px;background:#fff;border:1px solid var(--linha)}
.sacola__itens .nm{flex:1;min-width:0;font-weight:600;font-size:14px}
.sacola__itens .nm small{display:block;color:var(--cinza);font-weight:500}
.qtd{display:flex;align-items:center;gap:6px}
.qtd button{width:30px;height:30px;border:0;border-radius:10px;background:var(--papel);font:700 17px/1 var(--t-marca);color:var(--floresta);cursor:pointer}
.qtd span{min-width:18px;text-align:center;font-weight:700}
.sacola__total{margin-top:14px;display:flex;justify-content:space-between;font:700 17px/1 var(--t-marca);color:var(--floresta)}
.sacola__aviso{margin-top:6px;font-size:12.5px;color:var(--cinza)}
.campo{display:grid;gap:6px;margin-top:14px;font-size:13px;font-weight:700;color:var(--folha-e)}
.campo input,.campo textarea{padding:12px 14px;border-radius:14px;border:1.5px solid var(--linha);background:#fff;font-weight:500;color:var(--tinta);resize:vertical}
.campo input:focus,.campo textarea:focus{outline:none;border-color:var(--folha)}
.enviar{margin-top:16px;display:flex;align-items:center;justify-content:center;gap:10px;padding:16px;border-radius:16px;background:#1FA855;color:#fff;font:700 16px/1 var(--t-marca);text-decoration:none}
.enviar:focus-visible{outline:3px solid var(--cenoura);outline-offset:2px}

@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}