/* Fontes e títulos no modelo da Confeitaria Margô (sabec.dev, portfólio "confeitaria-margo"), adotados em 30/10/2026 para o Lombra ver
   ("se não gostar eu peço pra voltar"). Fica num arquivo à parte, carregado depois do inicio.css, para voltar fácil (passo a passo no
   _leia-antes.md). O que muda: Fraunces nos títulos, números e menu, com UMA palavra em itálico da própria Fraunces no degradê da marca;
   Inter no texto e nos botões; rótulos de seção em caixa alta espaçada com um traço fino antes, sem pílula e sem número; nomes de cesta em
   itálico; títulos sem ponto final (no HTML). As cores são as da marca. Fraunces e Inter: licença OFL, hospedadas em fontes/. */
@font-face{font-family:'Fraunces';src:url(fontes/fraunces-latin.woff2) format('woff2');font-weight:300 600;font-style:normal;font-display:swap}
@font-face{font-family:'Fraunces';src:url(fontes/fraunces-italico-latin.woff2) format('woff2');font-weight:300 600;font-style:italic;font-display:swap}
@font-face{font-family:'Inter';src:url(fontes/inter-latin.woff2) format('woff2');font-weight:300 600;font-style:normal;font-display:swap}
/* a estrutura toda nas fontes da Margô: Fraunces no lugar da Plus Jakarta (títulos, números, menu) e Inter no lugar da Switzer (texto e botões) */
:root{--tit:'Fraunces',Georgia,'Times New Roman',serif;--corpo:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;--cursiva:'Fraunces',Georgia,serif}
html{font-synthesis-weight:none}
html{--serifa:'Fraunces',Georgia,'Times New Roman',serif}

/* títulos */
html :is(h1,h2){font-family:var(--serifa);font-weight:400;letter-spacing:-.02em;font-optical-sizing:auto}
html .hero h1{font-weight:300;letter-spacing:-.03em;line-height:1}
html :is(.sec__cab,.varal__cab,.mot__esq,.prova__cab) h2{font-size:clamp(2.1rem,1.2rem + 2.4vw,3.6rem);line-height:1.04}
html .mot__esq h2{font-size:clamp(2rem,1.2rem + 2vw,3rem)}
html .fim h2{font-weight:300;font-size:clamp(2.4rem,1.3rem + 3.4vw,4.75rem);line-height:1}
html .adic__txt h2{font-size:1.5rem}
/* a palavra de destaque: itálico da própria Fraunces (no lugar da Gabelisa), com o degradê da marca */
html .it{font-family:var(--serifa);font-style:italic;font-weight:400;font-size:1em;line-height:inherit;letter-spacing:-.01em;padding:0 .06em 0 0;margin:0}

/* subtítulos dos cartões em serifa; nomes de cesta em itálico, como os doces da vitrine do Margô */
html :is(.mot__item h3,.slide__txt h3,.oc__titulo,.rod h3){font-family:var(--serifa);font-weight:400;letter-spacing:-.015em}
html :is(.varal__tit h3,.ficha h2){font-family:var(--serifa);font-style:italic;font-weight:400;letter-spacing:-.015em}

/* números em serifa leve */
html :is(.num b,.mot__n b){font-family:var(--serifa);font-weight:300;letter-spacing:-.03em}

/* rótulos de seção: caixa alta espaçada, com um traço fino antes (como no Margô), sem número */
html .selo-sec:not(.hero .selo-sec){gap:14px;padding:0;border-radius:0;background:none;font:500 0.75rem/1.6 var(--corpo);letter-spacing:.26em;text-transform:uppercase;color:#8A6A22}  /* marrom dourado, o mesmo de "O clássico", "Maternidade" e "Empresas" (.oc__selo) */
html .selo-sec:not(.hero .selo-sec):before{content:"";flex:none;width:38px;height:1px;background:currentColor}

/* botões, perguntas e rodapé, no jeito do Margô: botões em Inter 500, títulos do rodapé em caixa alta pequena */
/* guia de fontes (Lombra, 04/11): títulos Fraunces; palavra em destaque Fraunces itálico; subtítulos e textos Inter Regular (400, o Lombra preferiu
   400 nos subtítulos); botões e menus Inter Medium (500). O menu do topo, que na rodada de 30/10 tinha voltado à Plus Jakarta e à Switzer,
   agora também é Inter 500. */
html .btn{font-weight:500}
html :is(.cab,.mc) :is(a,button,summary){font-family:var(--corpo);font-weight:500;letter-spacing:0}
html .mc :is(.mc__link,.mc__gatilho,.mc__sub a,.mc__sub li:last-child a,.mc__wa){font-family:var(--corpo);font-weight:500}
html .faq summary{font-weight:400;font-size:1.25rem}
html .rod h4{font:500 0.6875rem/1.6 var(--corpo);letter-spacing:.24em;text-transform:uppercase;color:rgba(255,255,255,.55)}
html .oc__preco b,html .card__etiqueta{font-weight:500}
/* legenda da polaroide das ocasiões ("Café da manhã"): itálico da Fraunces, no lugar da Gabelisa */
html .oc__pol figcaption{font:italic 400 1.625rem/1 var(--tit);letter-spacing:-.01em}
@media (max-width:760px){html .oc__pol figcaption{font-size:1.375rem}}
/* telas que imitam o WhatsApp e o formulário do app continuam em letra sem serifa */
html :is(.pg__v b,.ped h5,.ped__bloco>b){font-family:var(--corpo)}
/* campo "Presente para ..." da abertura: a Inter é mais larga que a Switzer e o texto passava por baixo do botão */
@media (min-width:761px){html :is(.pedido__pre,.pedido input,.rola){font-size:1.875rem}}

/* ===== hierarquia de peso e itálico, como na Margô (revisão de 30/10) =====
   O que a Margô faz: título em Fraunces LEVE (300; 400 nas seções claras) e, nele, UMA palavra em itálico um degrau mais pesada, na cor de acento;
   texto corrido em Inter 400, com os dados que decidem a leitura em negrito (<b> 500/600) e, no máximo, uma frase de convite em itálico da Fraunces;
   nome do item em Fraunces 500 e a descrição dele em Inter menor e mais clara; rótulo em Inter caixa alta espaçada. Aqui: */
html .it{font-weight:500;font-synthesis:none}
html .hero h1{font-weight:300}
html .hero h1 .it{font-weight:500}
html :is(.sec__cab,.varal__cab,.mot__esq,.prova__cab,.fim,.faq,.adic__txt) h2{font-weight:400}
/* negrito no texto corrido: sempre na cor do título, para destacar sem gritar */
html b{font-weight:600}
html :is(.hero__sub,.sec__sub,.mot__lead,.mot__r,.oc__frase,.slide__txt p,.fim p,.adic__txt p) b{font-weight:600;color:var(--ink)}
html .mot__r b:first-child{color:var(--ink)}
html :is(.sec__sub,.fim p,.hero__sub) em{font-family:var(--serifa);font-style:italic;font-weight:400;font-size:1.06em;color:var(--ink)}
/* subtítulos e textos de apoio: Inter 400, tom suave, entrelinha folgada (a Margô usa 1,55 a 1,6) */
html :is(.hero__sub,.sec__sub,.mot__lead,.fim p){line-height:1.6}
/* itens: nome em Fraunces 500 e a descrição miúda em Inter, como "Bolos sob encomenda / sob consulta" da Margô */
html .oc__op b{font:500 1.125rem/1.2 var(--serifa);letter-spacing:-.01em}
html .oc__op small{font-size:0.8125rem;color:var(--mut)}
/* etiqueta do ponto forte: Inter caixa alta espaçada, na cor de acento (como os rótulos da Margô) */
html .mot__item .mot__q{font:500 0.6875rem/1.4 var(--corpo);letter-spacing:.2em;text-transform:uppercase;color:#3f74bb}
html .mot__item h3{font-weight:500}
html .hero__sub b{white-space:nowrap}
/* título da abertura (pedido do Lombra, 30/10): leve, mas não fino. O texto em Fraunces 400 e "presentes" em itálico 600, para a palavra se destacar */
html .hero h1{font-weight:400;letter-spacing:-.03em}
html .hero h1 .it{font-weight:600}
/* nome da empresa no painel: Fraunces 500 no degradê das palavras de destaque (a bio ao lado ficou sem o botão do WhatsApp) */
html .painel__nome{font:500 1.5rem/1.25 var(--serifa);letter-spacing:-.015em;width:fit-content;background:var(--grad-txt);-webkit-background-clip:text;background-clip:text;color:transparent}