/*
 * iKero (10/10/2026, docs/modulos/pagina-inicial-publica.md, "Redesenho via Claude Design") — a página inicial pública (`/`).
 * CSS puro, sem framework e sem build (o deploy não roda npm): carregado só por layouts/landing-ikero/app.blade.php, com `?v=`
 * subido a cada alteração. As outras páginas públicas continuam no main.css do template + ikero-site.css.
 *
 * Contraste medido (MASTER §6): texto #4b5d68 sobre #fcfcfc 6,68:1 e sobre #f4f2ef 6,13:1; #d13605 sobre branco 4,95:1; branco
 * sobre #d13605 4,95:1; ícone sobre o fundo tênue #fff1ec em #c73104 (o #fa5420 dava 3,0:1, no limite).
 * Cores de 13/10/2026 (página mais quente, "folhas" no lugar das faixas): #4b5d68 sobre o creme #fff4ec 6,33:1 e sobre o pêssego
 * #ffe6d8 5,73:1 (5,14:1 sob a forma laranja); #c73104 sobre o creme 5,01:1; branco sobre a terracota #8a2a0c 8,69:1 e #ffe0d1
 * sobre ela 6,96:1; branco sobre o preenchimento #d13605 4,95:1.
 * Mais tarde em 13/10/2026 (pedido do proprietário): a terracota saiu — faixa forte e rodapé no laranja do projeto em
 * preenchimento (#d13605, branco 4,95:1); o #fa5420 com branco dá 3,2:1 e reprova no AA. Texto secundário ali é branco (o
 * #ffe0d1 dava 4,0:1).
 */

/* ===== Fonte: Inter servida pelo próprio site (nada de terceiro antes do consentimento de cookies) ===== */
@font-face {
    font-family: "Inter";
    font-style: normal;
    font-display: swap;
    font-weight: 100 900;
    src: url("../fonts/inter-latin-wght-normal.woff2?v=1") format("woff2-variations"), url("../fonts/inter-latin-wght-normal.woff2?v=1") format("woff2");
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+2074,
        U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
    font-family: "Inter";
    font-style: normal;
    font-display: swap;
    font-weight: 100 900;
    src: url("../fonts/inter-latin-ext-wght-normal.woff2?v=1") format("woff2-variations"), url("../fonts/inter-latin-ext-wght-normal.woff2?v=1") format("woff2");
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F,
        U+A720-A7FF;
}

/* ===== Tokens (o laranja de assinatura vem de CorDoSite no :root do layout: --base-1) ===== */
:root {
    --ikh-assinatura: var(--base-1, #fa5420);
    --ikh-preenchimento: #d13605;
    --ikh-preenchimento-hover: #b82f04;
    --ikh-tenue: #fff1ec;
    --ikh-tenue-hover: #fff4f0;
    --ikh-sobre-tenue: #c73104;
    --ikh-titulo: #37322c;
    --ikh-texto: #4b5d68;
    --ikh-fundo: #fcfcfc;
    --ikh-fundo-alt: #fff4ec; /* creme quente (era o bege #f4f2ef, quase igual ao branco) */
    --ikh-pessego: #ffe6d8; /* fundo do banner */
    --ikh-faixa: var(--ikh-preenchimento); /* faixa forte e rodapé: o laranja de preenchimento */
    --ikh-terracota: var(--ikh-faixa); /* apelido antigo (era #8a2a0c, marrom; hoje o laranja) — não usar em código novo */
    --ikh-sobre-terracota: #fff; /* texto sobre a faixa laranja (o #ffe0d1 dava 4,0:1) */
    /* escala de espaçamentos (13/10/2026, auditoria de alinhamento): grids de cartões e fotos usam --ikh-esp-3 */
    --ikh-esp-1: 8px; --ikh-esp-2: 16px; --ikh-esp-3: 24px; --ikh-esp-4: 32px; --ikh-esp-6: 64px;
    --ikh-superficie: #ffffff;
    --ikh-hover-neutro: #f3f1ee;
    --ikh-borda: #e5e5e5;
    --ikh-curva: cubic-bezier(.22, .61, .36, 1); /* a curva das entradas e do hover do site (era literal em ~20 lugares) */
    --ikh-curva-troca: cubic-bezier(.65, 0, .35, 1); /* 15/10/2026: troca de foto da pilha (algo que já está na tela se move) */
    --ikh-subida: -6px; /* quanto o cartão sobe ao passar o mouse */
    --ikh-hover-quente: #f7f5f2; /* fundo de hover dos itens de lista (era literal; o --ikh-hover-neutro #f3f1ee é o dos botões) */
    --ikh-borda-quente: #f6e6dc; /* contorno dos cartões sobre o branco (revisão da home, 13/10/2026: era literal em 4 lugares) */
    --ikh-borda-campo: #8c857d; /* borda de campo: 3,64:1 no branco (contorno de componente pede 3:1) */
    /* status: os MESMOS do cadastro e dos painéis (MASTER, --ik-sucesso-texto / --ik-erro-texto) — revisão da home, 13/10/2026: eram
       #15803d / #b91c1c aqui e outro par no cadastro. #0a6045 no branco 7,58:1; #a3143a no branco 7,72:1 (≥ 6,6:1 em todos os fundos do site). */
    --ikh-sucesso: #0a6045;
    --ikh-erro: #a3143a;
    --ikh-sucesso-borda: #b9e3cf;
    --ikh-erro-borda: #f3c3cf;
    --ikh-raio: 10px;
    --ikh-raio-cartao: 20px;
    --ikh-raio-grande: 28px;
    --ikh-sombra-cartao: 0 1px 2px rgba(55, 50, 44, .04), 0 8px 24px rgba(55, 50, 44, .06);
    --ikh-sombra-bloco: 0 1px 2px rgba(55, 50, 44, .04), 0 16px 48px rgba(55, 50, 44, .08); /* bloco solto: a chamada da home */
    --ikh-sombra-cartao-hover: 0 2px 4px rgba(55, 50, 44, .04), 0 18px 40px rgba(55, 50, 44, .12);
    --ikh-sombra-pop: 0 12px 32px rgba(55, 50, 44, .12);
    --ikh-largura: 1200px;
    --ikh-lateral: clamp(20px, 4vw, 40px);
    --ikh-respiro: clamp(40px, 4.5vw, 72px);
    --ikh-folha: clamp(24px, 3vw, 40px); /* canto arredondado com que cada seção sobe sobre a anterior */
}

/* ===== Base ===== */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 96px; }
body {
    margin: 0;
    background: var(--ikh-fundo);
    color: var(--ikh-texto);
    font: 400 16px/26px Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    -webkit-font-smoothing: antialiased;
    overflow-x: hidden;
}
h1, h2, h3, h4, p, ul, ol, dl, dd, blockquote, figure { margin: 0; }
/* sem palavra sozinha na última linha (13/10/2026): títulos equilibrados, parágrafos "bonitos" */
h1, h2, h3 { text-wrap: balance; }
p { text-wrap: pretty; }
ul.ikh-lista { padding: 0; list-style: none; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--ikh-preenchimento); }
a:hover { color: var(--ikh-preenchimento-hover); }
button, input { font: inherit; }
:focus-visible { outline: 2px solid var(--ikh-preenchimento); outline-offset: 2px; }
.ikh-visualmente-oculto {
    position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0);
    white-space: nowrap; border: 0;
}
.ikh-pular {
    position: absolute; left: 16px; top: 12px; z-index: 30; padding: 10px 16px; background: var(--ikh-superficie);
    color: var(--ikh-titulo); border-radius: var(--ikh-raio); font-weight: 600; text-decoration: none;
    transform: translateY(-200%); /* fora da tela até receber foco (a sombra vazava no canto com o top negativo) */
}
.ikh-pular:focus { transform: none; box-shadow: var(--ikh-sombra-pop); }
.ikh-container { max-width: var(--ikh-largura); margin: 0 auto; padding: 0 var(--ikh-lateral); }
.ikh-icone { width: 18px; height: 18px; flex: none; stroke: currentColor; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }

/* ===== Botões ===== */
.ikh-botao {
    display: inline-flex; align-items: center; gap: 8px; min-height: 48px; padding: 0 20px; border-radius: var(--ikh-raio);
    font-size: 15px; font-weight: 600; line-height: 1.2; text-decoration: none; cursor: pointer; white-space: nowrap;
    transition: background .2s ease, transform .2s var(--ikh-curva), box-shadow .2s ease;
}
.ikh-botao--primario { background: var(--ikh-preenchimento); color: #fff; border: 0; min-height: 52px; padding: 0 24px; font-size: 16px; }
.ikh-botao--primario:hover { background: var(--ikh-preenchimento-hover); color: #fff; transform: translateY(-2px); box-shadow: 0 8px 20px rgba(209, 54, 5, .28); }
.ikh-botao--contorno { background: var(--ikh-superficie); color: var(--ikh-preenchimento); border: 1.5px solid var(--ikh-preenchimento); align-self: flex-start; }
.ikh-botao--contorno:hover { background: var(--ikh-tenue-hover); color: var(--ikh-preenchimento); transform: translateY(-2px); box-shadow: 0 6px 16px rgba(55, 50, 44, .1); }
/* selos oficiais das lojas de apps (PT-BR, Google e Apple): o desenho não se altera; só a altura, a mesma nos dois (o PNG do Google
   foi recortado da margem transparente que vem no arquivo oficial). */
.ikh-selo-loja { display: inline-flex; align-items: center; border-radius: 10px; line-height: 0; transition: transform .2s var(--ikh-curva), opacity .2s ease; }
.ikh-selo-loja:hover { transform: translateY(-1px); opacity: .9; }
.ikh-selo { display: block; width: auto; height: 48px; }
.ikh-link-seta { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; font-size: 15px; text-decoration: none; transition: transform .2s var(--ikh-curva); }

/* ===== Cabeçalho flutuante (13/10/2026, pedido do proprietário) =====
   Uma "pílula" translúcida (branco a 72% + desfoque) que flutua 12 px abaixo do topo, na largura do conteúdo, e continua presa ao
   rolar. A margem negativa embaixo deixa a primeira faixa da página (banner ou topo das páginas internas) subir por trás dela; a
   borda transparente dessa faixa devolve o espaço sem cortar o fundo (o fundo pinta por baixo da borda). Texto sobre a pílula: a
   cor do menu (#4b5d68) sobre o branco a 72% em cima do pêssego mais forte (var(--ikh-pessego)) dá 6,52:1; o laranja #c73104 do hover, 5,17:1. */
:root { --ikh-topo-altura: 64px; --ikh-topo-folga: 12px; --ikh-topo-sobra: calc(var(--ikh-topo-altura) + var(--ikh-topo-folga) + 2px); } /* +2: a borda da pílula */
.ikh-topo {
    position: sticky; top: var(--ikh-topo-folga); z-index: 20;
    width: min(calc(var(--ikh-largura) - 2 * var(--ikh-lateral) + 48px), calc(100% - 24px)); margin: var(--ikh-topo-folga) auto calc(-1 * var(--ikh-topo-sobra));
    background: rgba(255, 255, 255, .72); -webkit-backdrop-filter: blur(14px) saturate(1.4); backdrop-filter: blur(14px) saturate(1.4);
    border: 1px solid rgba(255, 255, 255, .7); border-radius: 20px; box-shadow: 0 6px 24px rgba(55, 50, 44, .08); transition: box-shadow .3s ease, background .3s ease;
}
.ikh-topo.is-preso { background: rgba(255, 255, 255, .8); box-shadow: 0 12px 32px rgba(55, 50, 44, .14); }
.ikh-topo > .ikh-container { max-width: none; padding-inline: 24px; }
@media (max-width: 575px) { .ikh-topo > .ikh-container { padding-inline: 16px; } }
/* a primeira faixa da página sobe por trás da pílula (com aviso do servidor no meio, é o aviso que desce) */
.ikh-topo + main > :first-child { border-top: var(--ikh-topo-sobra) solid transparent; background-origin: border-box; } /* o degradê começa na borda, sem repetir nela */
.ikh-topo + .ikh-avisos { margin-top: calc(var(--ikh-topo-sobra) + 16px); }
.ikh-topo__barra { min-height: var(--ikh-topo-altura); display: flex; align-items: center; justify-content: space-between; gap: 24px; }
/* o grid do topo e a coluna do rodapé esticavam o link (424/342 px de área clicável); no topo ele fica centrado na altura da barra,
   no rodapé, alinhado ao início da coluna */
.ikh-logo { display: inline-flex; align-items: center; width: auto; text-decoration: none; justify-self: start; align-self: center; }
/* o arquivo (1200×400) tem margem transparente: 11% em cima, 28% embaixo e 119 px (9,9% da largura = 29,75% da altura) à esquerda.
   O recuo negativo, proporcional à altura, põe o desenho na borda do conteúdo no topo (48/40 px) e no rodapé (64 px).
   TODO: recortar o espaço vazio do asset do logo (e então tirar o margin-left) */
.ikh-logo img { --ikh-logo-altura: 48px; height: var(--ikh-logo-altura); width: auto; max-width: none; flex-shrink: 0; margin-left: calc(-.2975 * var(--ikh-logo-altura)); }
/* 13/10/2026 (revisão da home): o `max-width: 100%` global limitava a imagem à largura do link, que é a da imagem MENOS o recuo negativo —
   o logo saía a 2,7:1 em vez de 3:1 (medido 129,7×48 no topo, 173×64 no rodapé). Sem limite e sem encolher, volta a 3:1. */
@media (max-width: 575px) { .ikh-logo img { --ikh-logo-altura: 40px; } }
.ikh-nav { display: flex; flex-wrap: wrap; gap: 28px; }
.ikh-nav a {
    color: var(--ikh-texto); font-weight: 500; font-size: 15px; padding: 6px 0; text-decoration: none; border-bottom: 2px solid transparent;
}
.ikh-nav a:hover { color: var(--ikh-titulo); }
.ikh-nav a[aria-current="page"] { color: var(--ikh-titulo); font-weight: 600; border-bottom-color: var(--ikh-assinatura); }
.ikh-topo__acoes { display: flex; align-items: center; gap: 12px; }
.ikh-pop { position: relative; }
.ikh-pop__botao {
    display: inline-flex; align-items: center; gap: 6px; min-height: 40px; padding: 0 10px; background: transparent; border: 0;
    border-radius: 8px; color: var(--ikh-texto); font-size: 14px; font-weight: 600; cursor: pointer;
}
.ikh-pop__botao:hover { background: var(--ikh-hover-neutro); }
.ikh-pop__botao .ikh-icone--seta { width: 14px; height: 14px; }
/* cadastros no topo (13/10/2026): links de texto com o ícone em laranja, separados por um fio; nunca botão */
.ikh-topo__parceiros { display: flex; align-items: center; margin: 0; padding: 0; list-style: none; }
.ikh-topo__parceiros li + li { display: flex; align-items: center; }
.ikh-topo__parceiros li + li::before { content: ""; width: 1px; height: 20px; margin: 0 6px; background: var(--ikh-borda); }
.ikh-topo__parceiro {
    display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0 10px; border-radius: 8px; white-space: nowrap;
    color: var(--ikh-titulo); font-size: 14px; font-weight: 600; text-decoration: none; transition: background .2s ease, color .2s ease;
}
.ikh-topo__parceiro .ikh-icone { width: 18px; height: 18px; flex: none; color: var(--ikh-sobre-tenue); }
.ikh-topo__parceiro:hover { background: var(--ikh-tenue); color: var(--ikh-sobre-tenue); }
/* a página atual (13/10/2026, proprietário): o mesmo traço laranja de 2px do menu (.ikh-nav a[aria-current]), embaixo do texto */
.ikh-topo__parceiro { position: relative; }
.ikh-topo__parceiro[aria-current="page"]::after { content: ""; position: absolute; left: 10px; right: 10px; bottom: 2px; height: 2px;
    background: var(--ikh-assinatura); }
/* notebook pequeno: sem os ícones, para caber ao lado do menu centralizado */
@media (min-width: 992px) and (max-width: 1199px) { .ikh-topo__parceiro .ikh-icone { display: none; } .ikh-topo__parceiro { padding: 0 6px; }
    .ikh-topo__parceiro[aria-current="page"]::after { left: 6px; right: 6px; } }
.ikh-pop__lista {
    position: absolute; right: 0; top: calc(100% + 8px); min-width: 200px; margin: 0; padding: 8px; list-style: none;
    background: var(--ikh-superficie); border: 1px solid var(--ikh-borda); border-radius: 12px; box-shadow: var(--ikh-sombra-pop);
    display: none; flex-direction: column; gap: 2px; z-index: 25;
}
/* com JS abre pelo botão (.is-aberto); sem JS, por passar o mouse ou pelo foco do teclado */
.ikh-pop.is-aberto .ikh-pop__lista,
html:not([data-ik-js]) .ikh-pop:hover .ikh-pop__lista,
html:not([data-ik-js]) .ikh-pop:focus-within .ikh-pop__lista { display: flex; }
/* 15/10/2026 (improve-animations): a lista surge do botão que a abriu (canto de cima à direita), 150 ms — antes aparecia seca */
.ikh-pop__lista { transform-origin: top right; }
.ikh-pop.is-aberto .ikh-pop__lista { animation: ikh-pop-abre .15s var(--ikh-curva); }
@keyframes ikh-pop-abre { from { opacity: 0; transform: translateY(-4px) scale(.97); } }
.ikh-pop__lista a {
    display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 10px 12px; border-radius: 8px;
    color: var(--ikh-titulo); font-weight: 500; font-size: 15px; text-decoration: none;
}
.ikh-pop__lista a:hover { background: var(--ikh-hover-quente); }
.ikh-pop__lista a[aria-current="true"] { font-weight: 600; background: var(--ikh-hover-quente); }
.ikh-pop__lista .ikh-icone { color: var(--ikh-sobre-tenue); }
/* opção de parceria no menu do celular (13/10/2026): ícone num disco tênue + título e a quem serve */
.ikh-parceria { display: flex; align-items: flex-start; gap: 12px; text-decoration: none; }
.ikh-parceria__icone { flex: none; width: 36px; height: 36px; border-radius: 50%; background: var(--ikh-tenue); color: var(--ikh-sobre-tenue);
    display: inline-flex; align-items: center; justify-content: center; }
.ikh-parceria__icone .ikh-icone { width: 18px; height: 18px; }
.ikh-parceria__texto { display: flex; flex-direction: column; gap: 2px; font-size: 13px; font-weight: 400; line-height: 1.4; color: var(--ikh-texto); }
.ikh-parceria__texto strong { font-size: 15px; font-weight: 600; color: var(--ikh-titulo); }
.ikh-menu-celular a.ikh-parceria { justify-content: flex-start; align-items: flex-start; padding: 10px 8px; }
.ikh-menu-celular a.ikh-parceria:hover { background: var(--ikh-hover-quente); }
.nav-toggle {
    width: 44px; height: 44px; display: none; align-items: center; justify-content: center; background: transparent; border: 0;
    border-radius: var(--ikh-raio); color: var(--ikh-titulo); cursor: pointer;
}
.nav-toggle:hover { background: var(--ikh-hover-neutro); }
.nav-toggle .ikh-icone { width: 24px; height: 24px; }
.nav-toggle .ikh-icone--fechar, .nav-toggle[aria-expanded="true"] .ikh-icone--menu { display: none; }
.nav-toggle[aria-expanded="true"] .ikh-icone--fechar { display: block; }
.ikh-menu-celular { border-top: 1px solid rgba(55, 50, 44, .08); padding: 12px 16px 16px; display: flex; flex-direction: column; gap: 4px; background: transparent; border-radius: 0 0 20px 20px; }
html[data-ik-js] .ikh-menu-celular:not(.is-aberto) { display: none; }
/* 15/10/2026 (improve-animations): o menu do celular desce 8 px esmaecendo, 200 ms — antes abria num corte seco */
html[data-ik-js] .ikh-menu-celular.is-aberto { animation: ikh-menu-abre .2s var(--ikh-curva); }
@keyframes ikh-menu-abre { from { opacity: 0; transform: translateY(-8px); } }
.ikh-menu-celular a { padding: 12px 8px; min-height: 44px; display: flex; align-items: center; justify-content: space-between;
    color: var(--ikh-texto); font-weight: 500; text-decoration: none; border-radius: 8px; }
.ikh-menu-celular a[aria-current] { color: var(--ikh-titulo); font-weight: 600; }
.ikh-menu-celular a.ikh-parceria[aria-current] { background: var(--ikh-hover-quente); box-shadow: inset 3px 0 0 var(--ikh-assinatura); }
.ikh-menu-celular__grupo { margin-top: 12px; padding-top: 16px; border-top: 1px solid var(--ikh-borda); display: flex; flex-direction: column; gap: 8px; }
.ikh-menu-celular__rotulo { font-size: 13px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--ikh-texto); padding: 0 8px; }
.ikh-menu-celular .ikh-botao--contorno { align-self: stretch; justify-content: flex-start; color: var(--ikh-preenchimento); }

@media (max-width: 991px) {
    .ikh-nav, .ikh-topo__acoes { display: none; }
    .nav-toggle { display: inline-flex; }
}
@media (min-width: 992px) {
    .ikh-menu-celular { display: none !important; }
    /* menu no centro de verdade (13/10/2026): com space-between ele ficava onde as larguras do logo e do botão deixassem */
    .ikh-topo__barra { display: grid; grid-template-columns: 1fr auto 1fr; }
    .ikh-topo__acoes { justify-self: end; }
}

/* ===== Avisos (retorno do servidor: newsletter, cadastro) ===== */
.ikh-avisos { max-width: var(--ikh-largura); margin: 16px auto 0; padding: 0 var(--ikh-lateral); display: flex; flex-direction: column; gap: 8px; }
.ikh-aviso {
    display: flex; align-items: flex-start; gap: 10px; padding: 12px 14px; background: var(--ikh-superficie); border: 1px solid var(--ikh-borda);
    border-radius: 12px; font-size: 15px; line-height: 1.5; box-shadow: var(--ikh-sombra-cartao);
}
.ikh-aviso .ikh-icone { margin-top: 3px; }
.ikh-aviso--sucesso { color: var(--ikh-sucesso); border-color: var(--ikh-sucesso-borda); }
.ikh-aviso--erro { color: var(--ikh-erro); border-color: var(--ikh-erro-borda); }

/* ===== Seções ===== */
.ikh-secao { position: relative; padding: var(--ikh-respiro) 0 calc(var(--ikh-respiro) + var(--ikh-folha)); background: var(--ikh-superficie); }
.ikh-secao--alt { background: var(--ikh-fundo-alt); }
/* "folhas" (13/10/2026): no lugar das faixas retas, cada seção sobe sobre a anterior com os cantos de cima arredondados; o espaço
   extra embaixo de cada seção é o que a próxima cobre. Só entre seções (o topo das páginas internas continua emendado). */
:is(.ikh-banner, .ikh-secao) + .ikh-secao { margin-top: calc(-1 * var(--ikh-folha)); border-radius: var(--ikh-folha) var(--ikh-folha) 0 0; }
/* faixa forte: o laranja de preenchimento com título branco */
.ikh-secao--terracota { background: var(--ikh-faixa); color: var(--ikh-sobre-terracota); }
.ikh-secao--terracota .ikh-titulo-secao { color: #fff; }
.ikh-secao--terracota :focus-visible { outline-color: #fff; }
.ikh-secao__cab { display: flex; flex-direction: column; gap: 10px; max-width: 44em; margin-bottom: clamp(24px, 2.5vw, 36px); }
.ikh-titulo-secao {
    font-size: clamp(28px, 3vw, 42px); line-height: 1.12; font-weight: 700; letter-spacing: -.02em; color: var(--ikh-titulo); text-wrap: balance;
}
.ikh-duas { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 460px), 1fr)); gap: clamp(32px, 4vw, 64px); align-items: center; }
.ikh-texto-largo { max-width: 44em; }
.ikh-moldura { border-radius: var(--ikh-raio-cartao); overflow: hidden; aspect-ratio: 4 / 3; background: var(--ikh-fundo-alt); }
.ikh-moldura img { width: 100%; height: 100%; object-fit: cover; }

/* Banner */
.ikh-banner {
    position: relative; overflow: hidden; isolation: isolate; padding: clamp(28px, 3.5vw, 48px) 0 calc(clamp(36px, 4vw, 56px) + var(--ikh-folha));
    background: linear-gradient(160deg, var(--ikh-pessego) 0%, #fff0e7 55%, var(--ikh-fundo-alt) 100%); background-size: cover; background-position: center;
}
/* formas da marca nos cantos (laranja a 10–12%): a de cima fica atrás da foto, a de baixo quase toda fora da tela */
.ikh-banner::before, .ikh-banner::after { content: ""; position: absolute; z-index: -1; border-radius: 50%; pointer-events: none; }
.ikh-banner::before { width: clamp(360px, 46vw, 720px); aspect-ratio: 1; top: clamp(-260px, -16vw, -120px); right: clamp(-240px, -12vw, -80px);
    background: radial-gradient(circle at 40% 60%, rgba(var(--base-rgb, 250, 84, 32), .16), rgba(var(--base-rgb, 250, 84, 32), .06) 70%); }
.ikh-banner::after { width: clamp(220px, 24vw, 380px); aspect-ratio: 1; bottom: clamp(-200px, -12vw, -120px); left: clamp(-160px, -9vw, -60px);
    background: rgba(var(--base-rgb, 250, 84, 32), .1); }
.ikh-banner--com-fundo { background-image: linear-gradient(rgba(255, 240, 231, .9), rgba(255, 240, 231, .9)), var(--ikh-banner-fundo); }
.ikh-banner__texto { display: flex; flex-direction: column; gap: clamp(20px, 2vw, 28px); align-items: flex-start; }
.ikh-banner .title { font-size: clamp(40px, 4.6vw, 68px); line-height: 1.04; font-weight: 800; letter-spacing: -.025em; color: var(--ikh-titulo); text-wrap: balance; }
.ikh-banner__legenda { font-size: clamp(17px, 1.4vw, 20px); line-height: 1.5; max-width: 34em; text-wrap: pretty; }
/* 13/10/2026: o selo do banner É o .ikh-sobretitulo (classe na Blade; era uma cópia das regras) — aqui só a margem do banner.
   #c73104 sobre o creme do banner: 4,92:1 */
.ikh-banner__texto .ikh-banner__slogan { margin: 0 0 -8px; } /* mais específico: o .ikh-sobretitulo vem depois no arquivo */
.ikh-banner--sem-imagem .ikh-duas { grid-template-columns: 1fr; }
.ikh-banner--sem-imagem .ikh-banner__texto { max-width: 44em; margin: 0 auto; align-items: center; text-align: center; }
.ikh-banner--sem-imagem .ik-chamada-cliente { justify-content: center; }
.ikh-banner__imagem { width: 100%; height: clamp(280px, 34vw, 500px); border-radius: var(--ikh-raio-grande); overflow: hidden; box-shadow: 0 30px 70px rgba(55, 50, 44, .16); }
.ikh-banner__imagem img { width: 100%; height: 100%; object-fit: cover; }
.ik-chamada-cliente { display: flex; flex-wrap: wrap; gap: 12px; align-self: stretch; } /* na largura da coluna: a coluna alinha ao início e o "em breve" encolhia ao conteúdo */
.ikh-em-breve {
    display: flex; align-items: center; gap: 14px; padding: 14px 18px 14px 14px; background: var(--ikh-superficie); border: 1px solid var(--ikh-borda);
    border-radius: 14px; box-shadow: var(--ikh-sombra-cartao);
    font-size: 15px; line-height: 1.5; color: var(--ikh-titulo); width: 100%; box-sizing: border-box; text-align: left; /* a borda direita na da coluna */
}
/* lista de espera no banner (13/10/2026, Fase 2): o formulário da newsletter como ação principal enquanto o app não sai; as lojas
   como "em breve" em texto — os selos oficiais não podem ser acinzentados (regras de uso do Google e da Apple) */
.ikh-espera { align-self: stretch; display: flex; flex-direction: column; gap: 12px; padding: clamp(16px, 2vw, 20px); background: var(--ikh-superficie);
    border: 1px solid var(--ikh-borda); border-radius: 16px; box-shadow: var(--ikh-sombra-cartao); }
.ikh-espera__texto { font-size: 15px; line-height: 1.5; color: var(--ikh-titulo); font-weight: 600; }
.ikh-espera__lojas { display: flex; flex-wrap: wrap; gap: 8px; }
.ikh-espera__lojas li { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; background: var(--ikh-hover-neutro);
    color: var(--ikh-texto); font-size: 13px; font-weight: 600; }
.ikh-espera__lojas .ikh-icone { width: 14px; height: 14px; }
.ikh-em-breve .ikh-chip { width: 44px; height: 44px; border-radius: 12px; margin: 0; flex: none; }
.ikh-em-breve .ikh-chip .ikh-icone { width: 22px; height: 22px; }
.ikh-em-breve .ikh-link-seta { display: flex; width: fit-content; margin-top: 2px; }
.ikh-link-seta .ikh-icone { width: 16px; height: 16px; transition: transform .2s var(--ikh-curva); }
.ikh-link-seta:hover .ikh-icone { transform: translateX(3px); }
.ikh-numeros {
    margin-top: 8px; padding-top: 24px; border-top: 1px solid var(--ikh-borda); width: 100%;
    display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 1fr)); gap: 20px 24px;
}
.ikh-numeros div { display: flex; flex-direction: column-reverse; gap: 2px; }
.ikh-numeros dt { font-size: 14px; }
.ikh-numeros dd { font-size: clamp(24px, 2.1vw, 30px); font-weight: 800; letter-spacing: -.02em; color: var(--ikh-titulo); line-height: 1.1; }

/* Sobre nós */
.ikh-sobre__texto { display: flex; flex-direction: column; gap: 16px; }
.ikh-sobre__legenda { font-size: clamp(17px, 1.4vw, 20px); font-weight: 600; color: var(--ikh-titulo); }
.ikh-sem-imagem .ikh-duas { grid-template-columns: 1fr; }
.ikh-sem-imagem .ikh-sobre__texto { max-width: 44em; }

/* Onde entregamos */
.ikh-zonas { display: flex; flex-wrap: wrap; gap: 10px; }
.ikh-zonas li {
    display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px 0 12px; background: var(--ikh-superficie);
    border-radius: 999px; box-shadow: 0 1px 2px rgba(55, 50, 44, .04), 0 4px 12px rgba(55, 50, 44, .06); color: var(--ikh-titulo); font-weight: 500; font-size: 15px;
}
.ikh-zonas .ikh-icone { width: 16px; height: 16px; color: var(--ikh-assinatura); }
.ikh-cidades { display: flex; flex-direction: column; gap: 14px; margin-top: 8px; padding-top: 20px; border-top: 1px solid var(--ikh-borda); }
.ikh-cidades__rotulo { font-size: 13px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--ikh-texto); }
.ikh-cidades .ikh-zonas__nota { padding-top: 0; border-top: 0; }
.ikh-zonas__nota { padding-top: 20px; border-top: 1px solid var(--ikh-borda); font-size: 15px; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }

/* Cartões (Características, Depoimentos) */
.ikh-cartoes { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 260px), 1fr)); gap: var(--ikh-esp-3); }
.ikh-cartao {
    position: relative; overflow: hidden; display: flex; flex-direction: column; gap: 14px; padding: 28px; background: var(--ikh-superficie);
    border-radius: var(--ikh-raio-cartao); box-shadow: var(--ikh-sombra-cartao); transition: transform .3s var(--ikh-curva), box-shadow .3s ease;
}
.ikh-cartao:hover { transform: translateY(var(--ikh-subida)); box-shadow: var(--ikh-sombra-cartao-hover); }
/* assinatura acima do título (13/10/2026; colada no pé parecia cortada): traço 32×4 no topo do texto, logo abaixo da capa, a 16 px
   do título (gap 14 + 2); cresce um pouco ao passar o mouse */
.ikh-cartao::after {
    content: ""; order: -1; flex: none; width: 48px; height: 4px; margin-bottom: 2px; border-radius: 4px; background: var(--ikh-assinatura);
    /* 15/10/2026 (improve-animations): cresce por scaleX (só composição), não por width (refazia o layout) — 32 px = 48 × .6667 */
    transform: scaleX(.6667); transform-origin: left center; transition: transform .35s var(--ikh-curva);
}
.ikh-cartao:hover::after { transform: scaleX(1); }
/* cartões sobre o branco ganham um contorno quente (a sombra sozinha some no fundo claro) */
.ikh-secao:not(.ikh-secao--alt) .ikh-cartao { box-shadow: 0 0 0 1px var(--ikh-borda-quente), var(--ikh-sombra-cartao); }
.ikh-secao:not(.ikh-secao--alt) .ikh-cartao:hover { box-shadow: 0 0 0 1px var(--ikh-borda-quente), var(--ikh-sombra-cartao-hover); }
.ikh-cartao h3 { font-size: 20px; font-weight: 700; color: var(--ikh-titulo); line-height: 1.3; letter-spacing: -.01em; }
/* com mais de uma coluna, o título reserva duas linhas: as descrições começam na mesma altura (numa coluna só não sobra vazio) */
@media (min-width: 600px) { .ikh-cartoes .ikh-cartao h3 { min-height: calc(2 * 1.3em); min-height: 2lh; } }
.ikh-cartao p { font-size: 15px; line-height: 1.55; }
/* imagem do admin no cartão: faixa no topo, na largura do cartão (a miniatura de 64 px parecia um ícone) */
.ikh-cartao__capa { order: -2; width: calc(100% + 56px); max-width: none; margin: -28px -28px 4px; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--ikh-raio-cartao) var(--ikh-raio-cartao) 0 0; }
.ikh-chip { width: 44px; height: 44px; border-radius: 12px; background: var(--ikh-tenue); display: flex; align-items: center; justify-content: center; color: var(--ikh-sobre-tenue); }
.ikh-chip .ikh-icone { width: 22px; height: 22px; }
.ikh-chip--pequeno { width: 28px; height: 28px; border-radius: 8px; margin-top: 2px; }
.ikh-chip--pequeno .ikh-icone { width: 16px; height: 16px; }

/* Plataforma em colunas (13/10/2026): uma coluna fixa por público, sem abas */
.ikh-publicos { display: grid; grid-template-columns: 1fr; gap: var(--ikh-esp-3); }
/* lado a lado só quando cabem todos (2 ou 3 públicos); antes, no tablet, ficavam 2 em cima e 1 sozinho embaixo (revisão de 13/10/2026) */
@media (min-width: 992px) { .ikh-publicos { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: 1fr; } }
.ikh-publico-col { display: flex; flex-direction: column; gap: 20px; padding: clamp(20px, 2.4vw, 28px); background: var(--ikh-superficie);
    border: 1px solid var(--ikh-borda-quente); border-radius: var(--ikh-raio-cartao); box-shadow: var(--ikh-sombra-cartao); }
.ikh-publico-col__titulo { display: flex; align-items: center; gap: 12px; font-size: 20px; font-weight: 700; color: var(--ikh-titulo); }
.ikh-publico-col__itens { display: flex; flex-direction: column; gap: 16px; flex: 1; }
.ikh-publico-col__itens li { display: flex; gap: 14px; align-items: flex-start; }
.ikh-publico-col__itens div { display: flex; flex-direction: column; gap: 4px; }
.ikh-publico-col__itens h4 { font-size: 16px; font-weight: 700; color: var(--ikh-titulo); line-height: 1.35; margin: 0; }
.ikh-publico-col__itens p { font-size: 14px; line-height: 1.5; }
.ikh-publico-col .ikh-botao { align-self: flex-start; }

/* Por que nos escolher */
.ikh-escolher { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 400px), 1fr)); gap: var(--ikh-esp-3); }
.ikh-escolher li {
    position: relative; min-height: 240px; border-radius: var(--ikh-raio-cartao); overflow: hidden; padding: 24px; display: flex;
    align-items: flex-end; box-shadow: 0 8px 24px rgba(55, 50, 44, .06); transition: transform .3s var(--ikh-curva), box-shadow .3s ease;
}
.ikh-escolher li:hover { transform: translateY(var(--ikh-subida)); box-shadow: 0 18px 40px rgba(55, 50, 44, .12); }
.ikh-escolher h3 { position: relative; font-size: 22px; font-weight: 700; line-height: 1.25; }
.ikh-escolher__com-imagem img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.ikh-escolher__com-imagem h3 { z-index: 2; color: #fff; font-size: 24px; letter-spacing: -.01em; text-shadow: 0 1px 2px rgba(0, 0, 0, .35); }
.ikh-escolher__sem-imagem { background: var(--ikh-preenchimento); box-shadow: 0 8px 24px rgba(209, 54, 5, .18); }
.ikh-secao--terracota .ikh-escolher li { box-shadow: 0 10px 30px rgba(40, 10, 0, .28); }
.ikh-secao--terracota .ikh-escolher li:hover { box-shadow: 0 22px 48px rgba(40, 10, 0, .36); }
/* na faixa laranja o cartão sem foto (laranja) sumiria no fundo: vira branco com o título em laranja (4,95:1) */
.ikh-secao--terracota .ikh-escolher__sem-imagem { background: var(--ikh-superficie); }
.ikh-secao--terracota .ikh-escolher__sem-imagem h3 { color: var(--ikh-preenchimento); }
.ikh-escolher__sem-imagem h3 { color: #fff; }
/* celular: cartões mais baixos e títulos menores */
@media (max-width: 600px) {
    .ikh-escolher li { min-height: 200px; padding: 14px; }
    .ikh-escolher h3 { font-size: 17px; }
    .ikh-escolher__com-imagem h3 { font-size: 19px; }
}

/* Vamos começar e chamada para cadastro */
.ikh-comecar { display: flex; flex-direction: column; gap: 10px; }
.ikh-comecar > * { max-width: 44em; }
.ikh-comecar p { max-width: 40em; text-wrap: pretty; }
.ikh-secao--colada { padding-bottom: clamp(20px, 2vw, 28px); }
.ikh-secao--sem-topo { padding-top: 0; }
.ikh-chamada {
    background: var(--ikh-superficie); border-radius: var(--ikh-raio-grande); box-shadow: var(--ikh-sombra-bloco);
    padding: clamp(24px, 3vw, 40px); display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: clamp(24px, 3vw, 48px); align-items: center;
}
.ikh-chamada--sem-imagem { grid-template-columns: 1fr; }
.ikh-chamada h2 { font-size: clamp(24px, 2.4vw, 34px); line-height: 1.18; }
.ikh-chamada__botoes { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 20px; }
.ikh-chamada__legenda { margin-top: 12px; font-size: 17px; line-height: 1.55; color: var(--ikh-texto); text-wrap: pretty; }
.ikh-chamada__apoio { margin-top: 8px; font-size: 15px; }
.ikh-chamada__imagem { aspect-ratio: 16 / 9; border-radius: 16px; overflow: hidden; }
/* a chamada de cadastro é o momento de cor da página: cartão no preenchimento, texto branco, forma da marca no canto */
.ikh-chamada--cor { position: relative; overflow: hidden; isolation: isolate; background: var(--ikh-preenchimento); color: #fff;
    box-shadow: 0 24px 60px rgba(209, 54, 5, .28); }
.ikh-chamada--cor::before { content: ""; position: absolute; z-index: -1; width: 420px; aspect-ratio: 1; border-radius: 50%; top: -220px; left: -160px;
    background: rgba(255, 255, 255, .07); pointer-events: none; }
.ikh-chamada--cor .ikh-titulo-secao, .ikh-chamada--cor .ikh-chamada__legenda { color: #fff; }
.ikh-chamada--cor :focus-visible { outline-color: #fff; }
.ikh-chamada--cor .ikh-botao--contorno { background: transparent; color: #fff; border-color: #fff; }
.ikh-chamada--cor .ikh-botao--contorno:hover { background: rgba(255, 255, 255, .12); color: #fff; box-shadow: none; }
/* o primeiro botão é a ação principal do cartão: sólido branco com o texto no preenchimento (4,95:1) */
.ikh-chamada--cor .ikh-chamada__botoes .ikh-botao:first-child { background: #fff; color: var(--ikh-preenchimento); }
.ikh-chamada--cor .ikh-chamada__botoes .ikh-botao:first-child:hover { background: var(--ikh-tenue-hover); color: var(--ikh-preenchimento-hover); box-shadow: 0 8px 20px rgba(40, 10, 0, .2); }
.ikh-chamada--cor .ikh-chamada__imagem { box-shadow: 0 16px 40px rgba(40, 10, 0, .25); }
.ikh-chamada__imagem img { width: 100%; height: 100%; object-fit: cover; }

/* Depoimentos */
.ikh-depoimentos { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
.ikh-depoimento figure { display: flex; flex-direction: column; gap: 20px; height: 100%; }
.ikh-depoimento figure > .ikh-icone { width: 24px; height: 24px; color: var(--ikh-assinatura); }
.ikh-depoimento blockquote { font-size: 16px; line-height: 1.6; color: var(--ikh-titulo); flex: 1; text-wrap: pretty; }
.ikh-depoimento figcaption { display: flex; align-items: center; gap: 12px; }
.ikh-depoimento__foto { width: 44px; height: 44px; border-radius: 50%; object-fit: cover; flex: none; }
.ikh-depoimento__iniciais {
    width: 44px; height: 44px; border-radius: 50%; background: var(--ikh-tenue); color: var(--ikh-preenchimento-hover); display: flex;
    align-items: center; justify-content: center; font-weight: 700; font-size: 14px; flex: none;
}
.ikh-depoimento__nome { display: flex; flex-direction: column; }
.ikh-depoimento__nome strong { font-weight: 600; color: var(--ikh-titulo); font-size: 15px; }
.ikh-depoimento__nome span { font-size: 14px; }

/* ===== Páginas internas (Sobre nós, Contato, Termos e políticas) ===== */
.ikh-pagina-topo { padding: clamp(36px, 4.5vw, 64px) 0 clamp(24px, 3vw, 36px); background: var(--ikh-fundo-alt); }
/* o conteúdo continua na mesma faixa do título (sem a troca de cor que separava as duas partes) */
.ikh-pagina-topo + .ikh-secao--alt { padding-top: 0; }
.ikh-pagina-topo__texto { display: flex; flex-direction: column; gap: 14px; max-width: 44em; }
/* 13/10/2026 (proprietário): o <h1> das páginas internas no MESMO tamanho do Contato (eram 56 × 80 px) */
.ikh-pagina-topo h1 { font-size: clamp(44px, 6vw, 80px); line-height: 1; font-weight: 800; letter-spacing: -.04em; color: var(--ikh-titulo); text-wrap: balance; }
.ikh-pagina-topo p { font-size: clamp(17px, 1.4vw, 20px); line-height: 1.5; text-wrap: pretty; }
/* o sobretítulo é um <p>: a regra da legenda acima o aumentava (13/10/2026) */
.ikh-pagina-topo .ikh-sobretitulo { margin: 0; font-size: 13px; line-height: 1.4; }

/* o texto que o admin escreve (HTML limpo pelo HtmlSeguro): leitura confortável, listas e títulos de volta */
.ikh-artigo {
    max-width: 44em; padding: clamp(24px, 3vw, 48px); background: var(--ikh-superficie); border-radius: var(--ikh-raio-cartao);
    box-shadow: var(--ikh-sombra-cartao); display: flex; flex-direction: column; gap: 20px; color: var(--ikh-texto); overflow-wrap: anywhere;
}
.ikh-artigo__texto { display: flex; flex-direction: column; gap: 16px; }
.ikh-artigo__texto > * { margin: 0; }
.ikh-artigo__texto h1, .ikh-artigo__texto h2, .ikh-artigo__texto h3, .ikh-artigo__texto h4 {
    font-size: 22px; font-weight: 700; color: var(--ikh-titulo); line-height: 1.3; margin-top: 8px;
}
.ikh-artigo__texto h3, .ikh-artigo__texto h4 { font-size: 18px; }
.ikh-artigo__texto ul, .ikh-artigo__texto ol { padding-left: 22px; display: flex; flex-direction: column; gap: 8px; }
.ikh-artigo__texto ul { list-style: disc; }
.ikh-artigo__texto ol { list-style: decimal; }
.ikh-artigo__texto strong, .ikh-artigo__texto b { color: var(--ikh-titulo); }
.ikh-artigo__texto a { text-decoration: underline; }
.ikh-artigo__texto img { border-radius: 12px; }
.ikh-artigo__duvidas { padding-top: 20px; border-top: 1px solid var(--ikh-borda); font-size: 15px; }
.ikh-artigo__duvidas a { font-weight: 600; }
/* Sobre nós: desde 18/10/2026 no mesmo cartão das páginas legais (`.ikh-legal`) — sem regra própria */
/* grade que se ajusta ao número de cartões (3 itens ocupam a largura toda, sem buraco à direita) */
.ikh-cartoes--fluido { grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); }

/* Termos e políticas: o texto na largura toda do conteúdo (decisão do proprietário, 10/10/2026) */
.ikh-legal .ikh-artigo { max-width: none; padding: clamp(24px, 3vw, 40px); gap: 16px; }
.ikh-legal .ikh-artigo__texto { gap: 14px; }
.ikh-legal .ikh-artigo__texto ul, .ikh-legal .ikh-artigo__texto ol { gap: 6px; }
/* com o texto na largura toda, uma linha fina separa as seções (o olho acha onde cada uma começa) */
.ikh-legal .ikh-artigo__texto h2:not(:first-child) { margin-top: 14px; padding-top: 22px; border-top: 1px solid var(--ikh-borda); }
.ikh-legal .ikh-artigo__texto li::marker { color: var(--ikh-sobre-tenue); }
.ikh-legal .ikh-artigo__duvidas { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; }
.ikh-legal .ikh-artigo__duvidas .ikh-link-seta { text-decoration: none; }
@media (max-width: 767px) {
    /* no celular o texto sai do cartão: mais largura de leitura */
    .ikh-legal .ikh-artigo { padding: 0; background: none; box-shadow: none; }
}

/* Contato */
.ikh-formulario {
    display: flex; flex-direction: column; gap: 18px; padding: clamp(24px, 3vw, 40px); background: var(--ikh-superficie);
    border-radius: var(--ikh-raio-cartao); box-shadow: var(--ikh-sombra-cartao);
}
.ikh-formulario h2 { font-size: 24px; font-weight: 700; letter-spacing: -.01em; color: var(--ikh-titulo); }
.ikh-campo { display: flex; flex-direction: column; gap: 6px; }
.ikh-campo label { font-size: 14px; font-weight: 600; color: var(--ikh-titulo); }
.ikh-campo input, .ikh-campo textarea {
    width: 100%; min-height: 48px; padding: 0 14px; border: 1px solid var(--ikh-borda-campo); border-radius: var(--ikh-raio); background: var(--ikh-superficie);
    color: var(--ikh-titulo); font-size: 16px;
}
.ikh-campo textarea { padding: 12px 14px; min-height: 160px; resize: vertical; }
.ikh-campo input:focus-visible, .ikh-campo textarea:focus-visible { border-color: var(--ikh-preenchimento); }
.ikh-campo [aria-invalid="true"] { border-color: var(--ikh-erro); }
.ikh-campo__obrigatorio { color: var(--ikh-erro); }
.ikh-campo__erro { font-size: 14px; color: var(--ikh-erro); }
.ikh-captcha { display: flex; flex-direction: column; gap: 8px; }
.ikh-captcha__linha { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.ikh-captcha__linha input { flex: 1 1 160px; width: auto; }
/* nome e e-mail lado a lado */
.ikh-campos-linha { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 18px; }
.ikh-formulario__envio { display: flex; align-items: center; gap: 16px 20px; flex-wrap: wrap; }
.ikh-formulario__envio .ikh-formulario__nota { flex: 1 1 260px; }
.ikh-captcha__linha img { height: 48px; width: auto; border-radius: 8px; border: 1px solid var(--ikh-borda); }
.ikh-captcha__recarregar {
    display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border: 0; border-radius: var(--ikh-raio);
    background: var(--ikh-hover-neutro); color: var(--ikh-titulo); cursor: pointer;
}
.ikh-formulario .ikh-botao--primario { min-height: 48px; }
.ikh-formulario__nota { font-size: 13px; line-height: 1.5; }
.ikh-botao--com-icone .ikh-icone { width: 16px; height: 16px; }

/* ===== Rodapé (referência do proprietário, 11/10/2026) ===== */
.ikh-rodape {
    position: relative; overflow: hidden; background: var(--ikh-faixa); color: #fff;
    margin-top: calc(-1 * var(--ikh-folha)); border-radius: var(--ikh-folha) var(--ikh-folha) 0 0; /* a mesma "folha" das seções */
}
.ikh-rodape a { color: #fff; }
.ikh-rodape :focus-visible { outline-color: #fff; }
/* formas de fundo: só nos cantos e muito suaves (branco a 6%): o texto branco nunca passa por cima delas */
.ikh-rodape__forma { position: absolute; border-radius: 50%; background: rgba(255, 255, 255, .06); pointer-events: none; }
.ikh-rodape__forma--a { width: 420px; height: 420px; top: -260px; left: -200px; }
.ikh-rodape__forma--b { width: 520px; height: 520px; bottom: -340px; right: -220px; }
.ikh-rodape__conteudo { position: relative; padding-top: clamp(40px, 5vw, 72px); padding-bottom: 32px; display: flex; flex-direction: column; gap: clamp(32px, 4vw, 48px); }
.ikh-newsletter {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 420px), 1fr)); gap: var(--ikh-esp-3) var(--ikh-esp-6); align-items: center;
    padding: clamp(24px, 3vw, 40px); border-radius: var(--ikh-raio-grande); background: var(--ikh-fundo-alt); color: var(--ikh-texto);
    box-shadow: 0 20px 50px rgba(40, 10, 0, .25);
}
/* a inscrição num cartão claro dentro do rodapé laranja: o texto volta às cores da página */
.ikh-newsletter h2 { color: var(--ikh-titulo); }
.ikh-newsletter a { color: var(--ikh-preenchimento); }
.ikh-newsletter :focus-visible { outline-color: var(--ikh-preenchimento); }
.ikh-newsletter__cab { display: flex; flex-direction: column; gap: 6px; }
.ikh-newsletter h2 { font-size: clamp(24px, 2.4vw, 32px); font-weight: 700; letter-spacing: -.01em; line-height: 1.15; }
.ikh-newsletter__cab p { font-size: 17px; }
.ikh-newsletter-form { display: flex; flex-direction: column; gap: 12px; }
.ikh-newsletter__linha { display: flex; flex-wrap: wrap; gap: 10px; }
.ikh-newsletter__campo { position: relative; flex: 1 1 240px; display: flex; }
.ikh-newsletter__campo .ikh-icone { position: absolute; left: 16px; top: 50%; transform: translateY(-50%); width: 20px; height: 20px; color: var(--ikh-texto); pointer-events: none; }
.ikh-newsletter-form input[type="email"] {
    width: 100%; min-height: 52px; padding: 0 16px 0 46px; border: 1px solid var(--ikh-borda-campo); border-radius: 12px; background: #fff; color: var(--ikh-titulo); font-size: 16px;
}
.ikh-newsletter-form button[type="submit"] {
    display: inline-flex; align-items: center; gap: 10px; min-height: 52px; padding: 0 22px; background: var(--ikh-preenchimento); color: #fff;
    border: 0; border-radius: 12px; font-size: 16px; font-weight: 700; cursor: pointer; transition: background .2s ease, transform .2s var(--ikh-curva);
}
.ikh-newsletter-form button[type="submit"]:hover { background: var(--ikh-preenchimento-hover); transform: translateY(-2px); }
.ikh-newsletter__consentimento { font-size: 13px; line-height: 1.55; }
.ikh-newsletter__consentimento a { text-decoration: underline; }
/* Turnstile só aparece quando a Cloudflare pede interação (data-appearance="interaction-only"); se aparecer, na largura do formulário,
   à esquerda, a 12 px do campo (o gap do form) */
.ikh-newsletter-form .cf-turnstile { width: 100%; text-align: left; }
.ikh-newsletter__erro { font-size: 14px; background: #fff; color: var(--ikh-erro); padding: 8px 12px; border-radius: 8px; border: 1px solid var(--ikh-erro-borda); }
.ik-isca { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ikh-rodape__colunas { display: flex; flex-wrap: wrap; gap: 40px 48px; }
.ikh-rodape__marca { flex: 2 1 300px; display: flex; flex-direction: column; gap: 20px; }
.ikh-rodape__marca .ikh-logo { align-self: flex-start; }
.ikh-rodape__marca .ikh-logo img { --ikh-logo-altura: 64px; filter: brightness(0) invert(1); }
.ikh-rodape__marca > p { max-width: 24em; font-size: 17px; line-height: 1.5; text-wrap: pretty; }
/* redes sociais pelo logotipo oficial de cada uma (13/10/2026) — glifo branco num círculo de 44px (alvo de toque) com fundo branco a 14%;
   branco sobre o laranja #d13605 = 4,95:1. Sem sublinhado: o círculo é o indicador; foco pelo anel branco do rodapé. */
.ikh-redes { display: flex; flex-wrap: wrap; gap: 10px; }
.ikh-redes a { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%;
    background: rgba(255, 255, 255, .14); color: #fff; text-decoration: none; transition: background .2s ease, transform .2s var(--ikh-curva); }
.ikh-redes a:hover { background: rgba(255, 255, 255, .26); transform: translateY(-2px); }
.ikh-logo-rede { width: 20px; height: 20px; fill: currentColor; }
@media (prefers-reduced-motion: reduce) { .ikh-redes a:hover { transform: none; } }
.ikh-rodape__lojas { display: flex; flex-wrap: wrap; gap: 12px; }
.ikh-rodape__lojas a { display: inline-flex; align-items: center; border-radius: 10px; line-height: 0; transition: transform .2s var(--ikh-curva); }
.ikh-rodape__lojas a:hover { transform: translateY(-1px); }
.ikh-rodape__coluna { flex: 1 1 190px; display: flex; flex-direction: column; gap: 16px; font-style: normal; }
.ikh-rodape__coluna h2 { font-size: 18px; font-weight: 700; letter-spacing: .01em; color: inherit; } /* 13/10/2026: o style.css do site antigo (páginas de cadastro) pinta `h1, h2` de preto */
.ikh-rodape__coluna ul { display: flex; flex-direction: column; gap: 2px; font-size: 15px; }
/* revisão da home (13/10/2026): links do rodapé com 26px de altura no celular — agora com área de toque de 40px (o espaço entre eles
   saiu do gap e entrou no padding, o visual fica igual) */
.ikh-rodape__coluna li > a, .ikh-rodape__coluna li > button { min-height: 40px; }
.ikh-rodape__coluna a, .ikh-rodape__coluna button { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; }
.ikh-rodape__coluna li > a > .ikh-icone, .ikh-rodape__coluna li > button > .ikh-icone { width: 18px; height: 18px; flex: none; opacity: .9; }
.ikh-rodape__coluna a:hover, .ikh-rodape__coluna button:hover { text-decoration: underline; color: #fff; }
.ikh-rodape__coluna button { background: transparent; border: 0; padding: 0; color: #fff; font-size: 15px; cursor: pointer; text-align: left; }
.ikh-rodape__contato ul { gap: 2px; } /* 13/10/2026: o mesmo espaço dos outros itens do rodapé (era 14px + os 40px de toque = 54px entre cidade e telefone) */
.ikh-rodape__contato a { gap: 12px; font-size: 16px; }
.ikh-rodape__direitos { padding-top: 24px; border-top: 1px solid rgba(255, 255, 255, .3); font-size: 14px; }


/* ===== Aparecer na rolagem: só com JS (sem JS, tudo visível). 13/10/2026: no máximo 300 ms por entrada (era até 1,1 s). A seção entra e, dentro dela, os blocos em sequência ===== */
html { scroll-behavior: smooth; }
html[data-ik-js] [data-reveal] {
    opacity: 0; transform: translateY(24px);
    transition: opacity .3s var(--ikh-curva), transform .3s var(--ikh-curva);
}
html[data-ik-js] [data-reveal] > .ikh-container > * { transition: opacity .3s var(--ikh-curva), transform .3s var(--ikh-curva); }
html[data-ik-js] [data-reveal]:not([data-reveal="in"]) > .ikh-container > * { opacity: 0; transform: translateY(16px); }
html[data-ik-js] [data-reveal="in"] { opacity: 1; transform: none; }
html[data-ik-js] [data-reveal="in"] > .ikh-container > :nth-child(1) { transition-delay: .04s; }
html[data-ik-js] [data-reveal="in"] > .ikh-container > :nth-child(2) { transition-delay: .08s; }
html[data-ik-js] [data-reveal="in"] > .ikh-container > :nth-child(3) { transition-delay: .12s; }
html[data-ik-js] [data-reveal="in"] > .ikh-container > :nth-child(n+4) { transition-delay: .16s; }

/* Cartões e itens de uma seção entram um depois do outro (o JS marca data-ikh-item e a ordem em --ikh-i). Animação com
   fill-mode "backwards": depois de terminar ela solta o transform, e o :hover dos cartões continua funcionando. */
@keyframes ikh-subir { from { opacity: 0; transform: translateY(28px) scale(.98); } to { opacity: 1; transform: none; } }
@keyframes ikh-foto { from { opacity: 0; transform: scale(1.08); } to { opacity: 1; transform: none; } }
html[data-ik-js] [data-reveal]:not([data-reveal="in"]) [data-ikh-item] { opacity: 0; }
html[data-ik-js] [data-reveal="in"] [data-ikh-item] {
    animation: ikh-subir .3s var(--ikh-curva) backwards; animation-delay: calc(.08s + var(--ikh-i, 0) * .05s);
}
/* fotos grandes das seções: entram com um leve "assentar" (a moldura corta o zoom) */
html[data-ik-js] [data-reveal]:not([data-reveal="in"]) :is(.ikh-moldura, .ikh-chamada__imagem) img { opacity: 0; }
html[data-ik-js] [data-reveal="in"] :is(.ikh-moldura, .ikh-chamada__imagem) img { animation: ikh-foto .3s var(--ikh-curva) .08s backwards; }

/* Banner: entra ao abrir a página — texto em sequência, foto deslizando da direita */
@keyframes ikh-banner-foto { from { opacity: 0; transform: translateX(32px) scale(.97); } to { opacity: 1; transform: none; } }
html[data-ik-js] .ikh-banner__texto > * { animation: ikh-subir .3s var(--ikh-curva) backwards; }
html[data-ik-js] .ikh-banner__texto > :nth-child(1) { animation-delay: 0s; }
html[data-ik-js] .ikh-banner__texto > :nth-child(2) { animation-delay: .04s; }
html[data-ik-js] .ikh-banner__texto > :nth-child(3) { animation-delay: .08s; }
html[data-ik-js] .ikh-banner__texto > :nth-child(n+4) { animation-delay: .12s; }
html[data-ik-js] .ikh-banner__imagem { animation: ikh-banner-foto .3s var(--ikh-curva) .04s backwards; }

/* ===== Clique: o botão "afunda" ao toque e solta uma onda a partir do ponto tocado (a onda vem do JS) ===== */
:is(.ikh-botao, .ikh-newsletter-form button[type="submit"]) { position: relative; overflow: hidden; isolation: isolate; }
:is(.ikh-botao, .ikh-newsletter-form button[type="submit"], .ikh-selo-loja, .ikh-rodape__lojas a, .ikh-link-seta):active {
    transform: scale(.96); transition-duration: .08s;
}
.ikh-link-seta:active .ikh-icone { transform: translateX(6px); }
.ikh-onda {
    position: absolute; z-index: -1; border-radius: 50%; pointer-events: none; background: currentColor; opacity: .28;
    transform: translate(-50%, -50%) scale(0); animation: ikh-onda .6s ease-out forwards;
}
.ikh-botao--primario .ikh-onda, .ikh-newsletter-form button[type="submit"] .ikh-onda { background: #fff; opacity: .35; }
@keyframes ikh-onda { to { transform: translate(-50%, -50%) scale(1); opacity: 0; } }

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
    html[data-ik-js] [data-reveal], html[data-ik-js] [data-reveal] > .ikh-container > * { opacity: 1; transform: none; }
    html[data-ik-js] [data-reveal] [data-ikh-item], html[data-ik-js] [data-reveal] img { opacity: 1; }
    .ikh-onda { display: none; }
}

/* ===== Contato (13/10/2026, referência do proprietário) =====
   À esquerda: sobretítulo com traço, <h1> grande, legenda, três selos e o formulário; à direita: a foto 4:5 (com os traços laranja do
   lado de fora do canto) e o cartão "Quer vender ou entregar com o iKero?". Consolidado em 13/10/2026 (revisão da home, rodada 2): cada
   regra num lugar só, com o valor que valia depois dos ajustes do dia (comparação de pixels antes/depois = 0).
   Contraste (MASTER §6): sobretítulo #c73104 no creme #fff4ec 4,92:1; legenda e selos #4b5d68 no creme 6,1:1; contador 13px #4b5d68
   no branco 6,5:1. Traços e ícones laranja são decoração (aria-hidden). */
.ikh-contato-pagina { padding: clamp(28px, 4vw, 56px) 0 calc(var(--ikh-respiro) + var(--ikh-folha));
    background: linear-gradient(180deg, var(--ikh-fundo-alt) 0%, var(--ikh-fundo) 85%); }
.ikh-contato2 { display: grid; grid-template-columns: minmax(0, 1fr); gap: 28px; }
.ikh-contato2__principal { display: flex; flex-direction: column; gap: 32px; min-width: 0; }
.ikh-sobretitulo { display: flex; align-items: center; gap: 14px; margin: 0 0 14px; font-size: 13px; font-weight: 600; letter-spacing: .14em;
    text-transform: uppercase; color: var(--ikh-sobre-tenue); }
.ikh-sobretitulo::before { content: ""; width: 34px; height: 4px; border-radius: 2px; background: var(--ikh-assinatura); flex: none; }
.ikh-contato2__topo h1 { margin: 0 0 18px; font-size: clamp(44px, 6vw, 80px); line-height: 1; font-weight: 800; letter-spacing: -.04em; color: var(--ikh-titulo); }
.ikh-contato2__legenda { margin: 0; max-width: 32em; font-size: clamp(17px, 1.4vw, 20px); /* o tamanho da legenda das outras páginas internas */ line-height: 1.4; color: var(--ikh-texto); text-wrap: pretty; }
/* selos numa linha só, cada texto em duas linhas; no celular, um embaixo do outro */
.ikh-contato2__selos { list-style: none; margin: 28px 0 0; padding: 0; display: flex; flex-wrap: nowrap; gap: 20px; }
.ikh-contato2__selos li { display: flex; flex: 1 1 0; align-items: center; gap: 12px; min-width: 0; font-size: 14px; line-height: 1.4;
    color: var(--ikh-texto); text-wrap: wrap; }
.ikh-contato2__selo-icone { flex: none; width: 52px; height: 52px; border-radius: 50%; background: var(--ikh-tenue); color: var(--ikh-sobre-tenue);
    display: flex; align-items: center; justify-content: center; }
.ikh-contato2__selo-icone .ikh-icone { width: 24px; height: 24px; }

/* formulário: nome e e-mail lado a lado, textarea na fonte do site (o navegador usa monoespaçada), quadro do Turnstile com a altura
   reservada (o formulário não cresce depois da primeira pintura) */
.ikh-formulario__cabeca { display: flex; flex-direction: column; gap: 6px; }
.ikh-formulario__cabeca h2 { margin: 0; }
.ikh-formulario__cabeca p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--ikh-texto); }
.ikh-campo__contador { margin: 0; align-self: flex-end; font-size: 13px; color: var(--ikh-texto); font-variant-numeric: tabular-nums; }
.ikh-campo textarea, .ikh-campo input { font-family: inherit; }
.ikh-contato2 .ikh-campos-linha { grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr)); }
.ikh-contato2 .ikh-formulario__nota { display: flex; gap: 10px; align-items: flex-start; }
.ikh-contato2 .ikh-formulario__nota .ikh-icone { width: 18px; height: 18px; flex: none; margin-top: 1px; color: var(--ikh-texto); }
.ikh-contato2 .ikh-formulario__envio .ikh-formulario__nota { flex: 1 1 200px; }
.ikh-contato2 .cf-turnstile { min-height: 65px; }

/* foto: proporção própria (4:5, a da imagem) — não estica com a coluna enquanto o formulário termina de montar; o recorte fica no rosto
   e na sacola (o logo oficial foi aplicado na sacola por cima da foto gerada) */
.ikh-contato2__lateral { display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.ikh-contato2__foto { position: relative; margin: 0; }
.ikh-contato2__foto img { display: block; width: 100%; aspect-ratio: 16 / 11; object-fit: cover; object-position: 50% 32%; border-radius: var(--ikh-raio-grande); }
/* os traços ficam do lado de fora, apontando para o canto (por cima da foto cortavam o canto arredondado). 13/10/2026: só com a foto ao
   lado do formulário — com ela embaixo (< 992px) os traços invadiam o canto do cartão do formulário */
.ikh-contato2__tracos { display: none; position: absolute; top: -34px; right: -30px; width: 40px; height: 40px; fill: none; stroke: var(--ikh-assinatura);
    stroke-width: 3.5; stroke-linecap: round; pointer-events: none; }

.ikh-parceiro2 { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 20px 16px; padding: clamp(24px, 3vw, 32px);
    border-radius: var(--ikh-raio-cartao); background: linear-gradient(135deg, var(--ikh-superficie) 0%, var(--ikh-fundo-alt) 100%);
    box-shadow: var(--ikh-sombra-cartao); }
/* revisão do Fale conosco (13/10/2026): na escala do título do formulário — o cartão é secundário e o título dele era maior que o da ação principal */
.ikh-parceiro2__texto h2 { margin: 0 0 12px; font-size: clamp(22px, 2vw, 24px); line-height: 1.2; font-weight: 700; letter-spacing: -.015em;
    color: var(--ikh-titulo); text-wrap: balance; }
.ikh-parceiro2__texto p { margin: 0; font-size: 17px; line-height: 1.5; color: var(--ikh-texto); }
.ikh-parceiro2__icones { display: grid; grid-template-columns: 56px 56px; grid-template-rows: 56px 56px; align-self: start; }
.ikh-parceiro2__icones span { width: 64px; height: 64px; border-radius: 16px; background: var(--ikh-superficie); box-shadow: var(--ikh-sombra-cartao);
    color: var(--ikh-preenchimento); display: flex; align-items: center; justify-content: center; }
.ikh-parceiro2__icones span:first-child { grid-column: 1; grid-row: 1; }
.ikh-parceiro2__icones span:last-child { grid-column: 2; grid-row: 2; margin: -8px 0 0 -8px; }
.ikh-parceiro2__icones .ikh-icone { width: 30px; height: 30px; }
/* 13/10/2026: "Cadastrar entregador" estourava o botão em 1440 (texto 235px numa caixa de 222px) — 16px como os outros botões e coluna
   mínima de 240px: quando os dois não cabem lado a lado, empilham (cada um numa linha, sem quebrar o rótulo) */
.ikh-parceiro2__botoes { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 12px; }
.ikh-parceiro2__botoes .ikh-botao { align-self: auto; justify-content: center; min-height: 56px; font-size: 16px; white-space: normal; text-align: center; }
.ikh-parceiro2__botoes .ikh-icone { width: 20px; height: 20px; flex: none; }
/* o link "Fale com a gente" (fechamento do Sobre nós — o mesmo cartão, 13/10/2026) e o texto que não se estica na largura toda */
.ikh-parceiro2__botoes .ikh-link-seta { align-self: center; justify-self: start; min-height: 44px; }
.ikh-parceiro2__texto { max-width: 40em; }

@media (min-width: 992px) {
    .ikh-contato2 { grid-template-columns: minmax(0, 1.08fr) minmax(0, 1fr); align-items: stretch; }
    .ikh-contato2__foto { flex: 0 0 auto; aspect-ratio: 4 / 5; }
    .ikh-contato2__foto img { position: absolute; inset: 0; height: 100%; aspect-ratio: auto; object-position: 50% 45%; }
    .ikh-contato2__lateral .ikh-parceiro2 { margin-top: auto; }
    /* 13/10/2026 (proprietário): no Fale conosco os dois botões numa linha só, como a base do cartão da mensagem ao lado — a coluna tem
       ~460px em 1440 (224px por botão): respiro e rótulo menores para "Cadastrar entregador" caber sem quebrar */
    .ikh-contato2__lateral .ikh-parceiro2__botoes { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .ikh-contato2__lateral .ikh-parceiro2__botoes .ikh-botao { padding-inline: 10px; font-size: 15px; gap: 8px; white-space: nowrap; }
    .ikh-contato2__tracos { display: block; }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
    /* entre 992 e 1199 a coluna tem ~380px (183px por botão): rótulo de 14px e sem o ícone no botão — o cartão já mostra os dois ícones */
    .ikh-contato2__lateral .ikh-parceiro2__botoes .ikh-botao { font-size: 14px; }
    .ikh-contato2__lateral .ikh-parceiro2__botoes .ikh-botao .ikh-icone { display: none; }
}
@media (max-width: 575px) {
    .ikh-contato2__selos { flex-direction: column; }
    .ikh-parceiro2__icones { display: none; }
    .ikh-parceiro2 { grid-template-columns: minmax(0, 1fr); }
}

/* ===== Plataforma no molde da referência (13/10/2026) =====
   Selo, título grande e legenda à esquerda; a foto dos três perfis à direita (máscara em onda, dentro da margem do container), com uma
   forma pêssego atrás; os cartões sobem por cima da foto. Cartão: cabeçalho pêssego de ponta a ponta (rótulo + subtítulo), três
   benefícios com ícone preto sem fundo, botão na largura toda (o do cliente é primário só no modo "lojas"). Fundo branco das seções
   alternadas; a foto desce 28px da borda de cima, com o canto de cima à direita arredondado; o pé dela esmaece no branco.
   Consolidado em 13/10/2026 (revisão da home, rodada 2).
   Contraste (MASTER §6): selo #c73104 sobre #fff1ec 4,92:1; legenda #4b5d68 no branco; título #37322c sobre var(--ikh-pessego) 10,6:1; subtítulo
   #4b5d68 sobre var(--ikh-pessego) 5,7:1; ícone #37322c no branco 12,7:1 (no hover #c73104, 5,43:1). */
.ikh-plat { background: var(--ikh-superficie); overflow: hidden; }
.ikh-plat__topo { position: relative; display: grid; gap: 24px; margin-bottom: 28px; }
/* 13/10/2026 (proprietário): o selo da Plataforma deixou a pílula — é o .ikh-sobretitulo (traço laranja, caixa alta), como o do Contato */
.ikh-plat__selo { margin-bottom: 16px; }
.ikh-plat .ikh-titulo-secao { margin: 0 0 16px; max-width: 11.5em; font-size: clamp(36px, 4.6vw, 64px); line-height: 1.02; letter-spacing: -.035em; text-wrap: balance; }
.ikh-plat__legenda { margin: 0; max-width: 30em; font-size: clamp(17px, 1.5vw, 21px); line-height: 1.5; color: var(--ikh-texto); text-wrap: pretty; }
.ikh-plat__foto { margin: 0; overflow: hidden; border-radius: var(--ikh-raio-grande); aspect-ratio: 16 / 9; }
.ikh-plat__foto img { display: block; width: 100%; height: 100%; object-fit: cover; object-position: 45% 25%; }
@media (min-width: 992px) {
    .ikh-plat__topo { display: block; min-height: 330px; margin-bottom: 0; }
    .ikh-plat__texto { position: relative; z-index: 1; max-width: 44%; padding-bottom: 72px; }
    .ikh-plat__foto, .ikh-plat__topo::before { position: absolute; top: calc(-1 * var(--ikh-respiro) + 28px); bottom: -48px; right: 0; border-radius: 0; aspect-ratio: auto; }
    .ikh-plat__foto { width: 58%; -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M22,0 H100 V100 H16 C8,92 12,80 6,66 C0,52 8,40 5,27 C3,16 11,6 22,0 Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M22,0 H100 V100 H16 C8,92 12,80 6,66 C0,52 8,40 5,27 C3,16 11,6 22,0 Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat; }
    .ikh-plat__foto { border-radius: 0 var(--ikh-raio-grande) 0 0; }
    .ikh-plat__foto::after { content: ""; position: absolute; inset: 0; pointer-events: none;
        background: linear-gradient(180deg, rgba(255, 255, 255, 0) 72%, rgba(255, 255, 255, .85) 90%, #fff 100%); }
    .ikh-plat__topo::before { content: ""; width: calc(58% + 56px); background: linear-gradient(160deg, var(--ikh-pessego) 0%, rgba(255, 230, 216, .55) 70%, rgba(255, 230, 216, .15) 100%);
        -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M16,0 H100 V100 H9 C2,92 6,80 1,66 C-3,52 3,40 0,27 C-1,16 6,6 16,0 Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' preserveAspectRatio='none'%3E%3Cpath d='M16,0 H100 V100 H9 C2,92 6,80 1,66 C-3,52 3,40 0,27 C-1,16 6,6 16,0 Z'/%3E%3C/svg%3E") center / 100% 100% no-repeat; }
    .ikh-plat .ikh-publicos { position: relative; z-index: 1; }
}
/* cartões de perfil */
.ikh-publicos .ikh-publico-col { --ikh-plat-pad: clamp(20px, 2.4vw, 28px); gap: 18px; padding: var(--ikh-plat-pad); overflow: hidden;
    transition: transform .3s var(--ikh-curva), box-shadow .3s ease; }
.ikh-publico-col__cabeca { position: relative; display: block; margin: calc(-1 * var(--ikh-plat-pad)) calc(-1 * var(--ikh-plat-pad)) 4px;
    padding: 22px var(--ikh-plat-pad) 20px; background: var(--ikh-pessego); }
.ikh-publico-col__cabeca .ikh-publico-col__titulo { margin: 0 0 6px; font-size: 22px; letter-spacing: -.01em; }
.ikh-publico-col__cabeca p { margin: 0; font-size: 15px; line-height: 1.5; color: var(--ikh-texto); }
/* o traço de assinatura na base do cabeçalho, ao passar o mouse */
.ikh-publico-col__cabeca::after { content: ""; position: absolute; left: var(--ikh-plat-pad); bottom: 0; height: 4px;
    border-radius: 4px 4px 0 0; background: var(--ikh-assinatura);
    /* 15/10/2026: scaleX em vez de width (ver .ikh-cartao::after) — 56 px fixos, recolhido em 0 */
    width: 56px; transform: scaleX(0); transform-origin: left center; transition: transform .45s var(--ikh-curva); }
.ikh-publico-col__item-icone { flex: none; width: 26px; height: 26px; margin-top: 1px; display: flex; align-items: center; justify-content: center;
    color: var(--ikh-titulo); transition: color .3s ease, transform .3s var(--ikh-curva); }
.ikh-publico-col__item-icone .ikh-icone { width: 24px; height: 24px; }
.ikh-publicos .ikh-publico-col__itens li:nth-child(2) .ikh-publico-col__item-icone { transition-delay: .06s; }
.ikh-publicos .ikh-publico-col__itens li:nth-child(3) .ikh-publico-col__item-icone { transition-delay: .12s; }
.ikh-publico-col .ikh-publico-col__botao { position: relative; align-self: stretch; justify-content: center; gap: 10px; min-height: 54px; }
.ikh-publico-col .ikh-publico-col__botao:not(.ikh-botao--primario) { padding-inline: 40px; }
.ikh-publico-col__botao .ikh-icone { width: 20px; height: 20px; }
.ikh-publico-col__botao .ikh-publico-col__seta { position: absolute; right: 14px; width: 18px; height: 18px; transition: transform .25s var(--ikh-curva); }
@media (hover: hover) {
    .ikh-publicos .ikh-publico-col:hover { transform: translateY(var(--ikh-subida)); box-shadow: 0 0 0 1px var(--ikh-borda-quente), var(--ikh-sombra-cartao-hover); }
    .ikh-publicos .ikh-publico-col:hover .ikh-publico-col__cabeca::after { transform: scaleX(1); }
    .ikh-publicos .ikh-publico-col:hover .ikh-publico-col__item-icone { color: var(--ikh-sobre-tenue); transform: scale(1.08); }
    .ikh-publico-col__botao:hover .ikh-publico-col__seta { transform: translateX(4px); }
}
@media (prefers-reduced-motion: reduce) {
    .ikh-publicos .ikh-publico-col:hover { transform: none; }
    .ikh-publicos .ikh-publico-col:hover .ikh-publico-col__item-icone { transform: none; }
    .ikh-publico-col__botao:hover .ikh-publico-col__seta { transform: none; }
}

/* ===== Foto de trás — UM efeito para "Feito para a sua cidade" e "Por que pedir no iKero" (13/10/2026, proprietário) =====
   Cada cartão com foto tem duas: a de trás (fixa por posição, img/escolha/ e img/caracteristicas/) fica embaixo, um pouco ampliada; ao
   passar o mouse a da frente sobe e sai pelo topo com um leve giro e sombra na borda de baixo — como uma foto levantada da pilha —, e a de
   trás se acomoda. Só decoração. Sem animação para quem pediu menos movimento: as duas trocam por opacidade. */
.ikh-cartao__capa--pilha { position: relative; overflow: hidden; height: auto; }
.ikh-cartao__capa--pilha img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
:is(.ikh-escolher__com-imagem .ikh-escolher__verso, .ikh-cartao__capa--pilha .ikh-cartao__verso) { transform: scale(1.08); transition: transform .7s var(--ikh-curva); }
:is(.ikh-escolher__com-imagem .ikh-escolher__frente, .ikh-cartao__capa--pilha .ikh-cartao__frente) { transform-origin: 50% 100%;
    box-shadow: 0 18px 30px rgba(40, 20, 5, 0); transition: transform .7s var(--ikh-curva-troca), box-shadow .7s ease; }
/* camada própria só na foto grande (na capa pequena ela muda o anti-serrilhado da borda de baixo) */
.ikh-escolher__com-imagem .ikh-escolher__frente { will-change: transform; }
@media (hover: hover) {
    :is(.ikh-escolher__com-imagem:hover .ikh-escolher__verso, .ikh-cartao:hover .ikh-cartao__verso) { transform: scale(1); }
    :is(.ikh-escolher__com-imagem:hover .ikh-escolher__frente, .ikh-cartao:hover .ikh-cartao__frente) { transform: translateY(-104%) rotate(-3deg);
        box-shadow: 0 18px 30px rgba(40, 20, 5, .35); }
}
@media (prefers-reduced-motion: reduce) {
    :is(.ikh-escolher__com-imagem .ikh-escolher__verso, .ikh-cartao__capa--pilha .ikh-cartao__verso) { transform: none; transition: none; }
    :is(.ikh-escolher__com-imagem .ikh-escolher__frente, .ikh-cartao__capa--pilha .ikh-cartao__frente) { transition: opacity .3s ease; }
    :is(.ikh-escolher__com-imagem:hover .ikh-escolher__frente, .ikh-cartao:hover .ikh-cartao__frente) { transform: none; box-shadow: none; opacity: 0; }
}
/* "Feito para a sua cidade": o título direto sobre a foto, em branco, num degradê escuro só no terço de baixo (por cima das duas fotos).
   Contraste: branco sobre o pé do degradê (#140c06 a 78% sobre a foto) ≥ 7:1 mesmo em foto clara; a sombra do texto cobre o meio-tom. */
.ikh-escolher__com-imagem::after { content: ""; position: absolute; inset: 0; z-index: 1; pointer-events: none;
    background: linear-gradient(180deg, rgba(20, 12, 6, 0) 45%, rgba(20, 12, 6, .45) 72%, rgba(20, 12, 6, .78) 100%); }

/* ===== Folhas flutuando (13/10/2026, proprietário) =====
   Cada seção que sobe sobre a anterior (a "folha" de canto arredondado) projeta uma sombra suave PARA CIMA, sobre a seção de baixo, e tem um
   fio claro na borda — como uma folha pousada em cima da outra. A sombra é da própria seção (o overflow dela não a corta) e a ordem do
   documento já põe a de baixo por baixo. O rodapé laranja ganha a mesma sombra, mais escura. Sem movimento: nada a desligar. */
:is(.ikh-banner, .ikh-secao) + .ikh-secao {
    box-shadow: 0 -8px 22px -6px rgba(55, 50, 44, .14), 0 -30px 60px -18px rgba(55, 50, 44, .16), 0 1px 0 rgba(255, 255, 255, .9) inset;
}
.ikh-rodape { box-shadow: 0 -8px 22px -6px rgba(120, 30, 0, .22), 0 -30px 60px -18px rgba(120, 30, 0, .22); }
/* ===== Transição entre páginas do site (13/10/2026, proprietário) =====
   Navegar pelo menu do cabeçalho (Início, Sobre nós, Contato, cadastros) troca de página com a transição nativa do navegador entre
   documentos (View Transitions, mesma origem): a página que sai esmaece subindo 8px e a que entra sobe 14px; o cabeçalho flutuante fica
   parado (grupo próprio). Navegador sem suporte (Firefox hoje) navega como antes — nada depende disto. Com "reduzir movimento", desligada. */
@media (prefers-reduced-motion: no-preference) {
    @view-transition { navigation: auto; }
}
.ikh-topo { view-transition-name: ikh-topo; }
::view-transition-old(root) { animation: ikh-pagina-sai .18s var(--ikh-curva) both; } /* 15/10/2026: era ease-in (começava devagar) */
::view-transition-new(root) { animation: ikh-pagina-entra .34s var(--ikh-curva) both; }
::view-transition-group(ikh-topo) { animation: none; }
::view-transition-old(ikh-topo), ::view-transition-new(ikh-topo) { animation: none; }
::view-transition-old(ikh-topo) { display: none; }
@keyframes ikh-pagina-sai { to { opacity: 0; transform: translateY(-8px); } }
@keyframes ikh-pagina-entra { from { opacity: 0; transform: translateY(14px); } }
/* ===== Cartão "Receba as novidades do iKero" ao passar o mouse (13/10/2026, proprietário) =====
   O mesmo efeito dos cartões de perfil: o cartão sobe 6px com a sombra mais forte e um traço laranja cresce acima do título; o ícone de
   enviar do botão anda 4px. Só ao passar o mouse (digitar no campo não move o cartão). Sem movimento com "reduzir movimento". */
.ikh-newsletter { transition: transform .3s var(--ikh-curva), box-shadow .3s ease; }
.ikh-newsletter button[type="submit"] .ikh-icone { transition: transform .25s var(--ikh-curva); }
@media (hover: hover) {
    .ikh-newsletter:hover { transform: translateY(-6px); box-shadow: 0 30px 64px rgba(40, 10, 0, .34); }
    .ikh-newsletter button[type="submit"]:hover .ikh-icone { transform: translateX(4px); }
}
@media (prefers-reduced-motion: reduce) {
    .ikh-newsletter:hover { transform: none; }
    .ikh-newsletter button[type="submit"]:hover .ikh-icone { transform: none; }
}
/* ===== Faixa "Venda e entregue com o iKero" ao passar o mouse (13/10/2026, proprietário) =====
   O mesmo efeito dos outros cartões: sobe 6px com a sombra mais forte e um traço cresce acima do título — BRANCO (laranja sumiria no
   fundo laranja) —; a foto aproxima levemente dentro da moldura. Só ao passar o mouse; sem movimento com "reduzir movimento". */
.ikh-chamada--cor { transition: transform .3s var(--ikh-curva), box-shadow .3s ease; }
.ikh-chamada--cor .ikh-chamada__imagem img { transition: transform .7s var(--ikh-curva); }
@media (hover: hover) {
    .ikh-chamada--cor:hover { transform: translateY(-6px); box-shadow: 0 28px 60px rgba(209, 54, 5, .32); }
    .ikh-chamada--cor:hover .ikh-chamada__imagem img { transform: scale(1.05); }
}
@media (prefers-reduced-motion: reduce) {
    .ikh-chamada--cor:hover { transform: none; }
    .ikh-chamada--cor:hover .ikh-chamada__imagem img { transform: none; }
}
/* ===== "Delivery da sua cidade" ao passar o mouse (13/10/2026, proprietário) =====
   A seção não tem cartão: o bloco foto + texto reage como os cartões da home — a foto sobe 6px com sombra e aproxima 5% dentro da moldura,
   um traço laranja cresce acima do título e os pinos das cidades ficam laranja. Sem movimento com "reduzir movimento". */
.ikh-sobre .ikh-moldura { transition: transform .3s var(--ikh-curva), box-shadow .3s ease; }
.ikh-sobre .ikh-moldura img { transition: transform .7s var(--ikh-curva); }
.ikh-sobre .ikh-zonas .ikh-icone { transition: color .3s ease; }
@media (hover: hover) {
    /* a foto da página Sobre nós reage igual (revisão de 13/10/2026) */
    .ikh-sobre .ikh-duas:hover .ikh-moldura { transform: translateY(var(--ikh-subida)); box-shadow: var(--ikh-sombra-cartao-hover); }
    .ikh-sobre .ikh-duas:hover .ikh-moldura img { transform: scale(1.05); }
    .ikh-sobre .ikh-duas:hover .ikh-zonas .ikh-icone { color: var(--ikh-sobre-tenue); }
}
@media (prefers-reduced-motion: reduce) {
    .ikh-sobre .ikh-duas:hover .ikh-moldura, .ikh-sobre .ikh-duas:hover .ikh-moldura img { transform: none; }
}
/* ===== Traço de assinatura do hover — UM componente (revisão da home, 13/10/2026) =====
   Antes eram três cópias com `width: 0 → 56px` e `display: block`: o traço invisível reservava 18px e descia o título dessas seções em
   relação às outras. Agora fica posicionado ACIMA do título (não ocupa espaço) e cresce por scaleX. A cor vem de --ikh-traco-cor (branco
   na faixa laranja). Cartões de perfil usam o mesmo traço na base do cabeçalho (.ikh-publico-col__cabeca::after). */
.ikh-newsletter__cab h2, .ikh-chamada--cor .ikh-titulo-secao, .ikh-sobre .ikh-titulo-secao { position: relative; }
.ikh-newsletter__cab h2::before, .ikh-chamada--cor .ikh-titulo-secao::before, .ikh-sobre .ikh-titulo-secao::before {
    content: ""; position: absolute; left: 0; top: -16px; width: 56px; height: 4px; border-radius: 4px; background: var(--ikh-traco-cor, var(--ikh-assinatura));
    transform: scaleX(0); transform-origin: left center; transition: transform .45s var(--ikh-curva); }
.ikh-chamada--cor { --ikh-traco-cor: #fff; }
@media (hover: hover) {
    .ikh-newsletter:hover .ikh-newsletter__cab h2::before, .ikh-chamada--cor:hover .ikh-titulo-secao::before,
    .ikh-sobre .ikh-duas:hover .ikh-titulo-secao::before { transform: scaleX(1); }
}

/* ===== Alinhamento da página inicial (13/10/2026, revisão com Playwright de 390 a 1440 px) ===== */
/* 1. o rótulo do botão do perfil quebra em vez de passar por baixo da seta ("Cadastre-se para entregar" estourava 3 a 28px) */
.ikh-publico-col .ikh-publico-col__botao { white-space: normal; text-align: center; line-height: 1.25; padding-block: 10px; }
/* 2. quatro cartões de "Por que pedir" em 2 × 2 onde não cabem quatro (antes 3 + 1, com um vazio de dois cartões) */
@media (min-width: 600px) and (max-width: 1199.98px) {
    .ikh-cartoes--fluido:has(> li:nth-child(4):last-child) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
    /* 3. os três cabeçalhos de perfil na mesma altura: ver "cartões de perfil em linhas compartilhadas" (14/10/2026) — aqui só a reserva
       para navegador sem subgrid */
    @supports not (grid-template-rows: subgrid) { .ikh-publico-col__cabeca p { min-height: 4.5em; } }
    /* o botão de rótulo em duas linhas ("Cadastre-se para entregar") com a mesma altura dos vizinhos */
    .ikh-publico-col .ikh-publico-col__botao { min-height: 62px; }
    /* 4. "Delivery da sua cidade": foto e texto lado a lado (antes a foto ocupava a largura toda, 944 × 690px); a página Sobre nós é só
       texto desde 18/10/2026 */
    .ikh-sobre .ikh-duas { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 991.98px) {
    /* 4. empilhado, a foto numa faixa mais baixa (4:3 na largura toda passava de 500px de altura) */
    .ikh-sobre .ikh-moldura { aspect-ratio: 16 / 9; }
}
@media (min-width: 768px) and (max-width: 1199.98px) {
    /* 5. rodapé: a marca numa linha e as três colunas de links lado a lado (antes "Contato" descia sozinho) */
    .ikh-rodape__marca { flex-basis: 100%; }
}
@media (max-width: 575.98px) {
    /* 6. no celular, os botões da chamada e o "Inscrever-se" na largura toda, como o "Baixar o app" */
    .ikh-chamada__botoes .ikh-botao { flex: 1 1 100%; justify-content: center; }
    .ikh-newsletter-form button[type="submit"] { width: 100%; justify-content: center; }
}
/* 8. cartão "Quer vender ou entregar" em largura toda (fechamento do Sobre nós): os ícones ocupam a coluna da direita na altura do texto E dos
   botões — antes ficavam só na linha do texto (112px contra ~70px de texto) e os botões começavam ~60px abaixo dele. Vale também para o Fale
   conosco abaixo de 992px (a coluna vira largura toda); na coluna estreita (≥ 992px) o cartão não muda. */
@media (min-width: 576px) {
    .ikh-parceiro2 .ikh-parceiro2__icones { grid-column: 2; grid-row: 1 / span 2; align-self: center; }
    .ikh-parceiro2 .ikh-parceiro2__botoes { grid-column: 1; }
}
@media (min-width: 992px) {
    /* no Fale conosco a coluna é estreita a partir de 992px: os ícones voltam a ficar só ao lado do texto e os botões na largura toda */
    .ikh-contato2__lateral .ikh-parceiro2 .ikh-parceiro2__icones { grid-row: 1; align-self: start; }
    .ikh-contato2__lateral .ikh-parceiro2 .ikh-parceiro2__botoes { grid-column: 1 / -1; }
}
/* 9. Fale conosco (13/10/2026): de 992px em diante a foto ocupa a altura que sobra na coluna (recortada por `object-fit`) — com 4:5 fixo ela
   encolhia mais que o formulário ao lado e abria um vão de 88 a 163px antes do cartão de cadastro, entre 992 e 1199px */
@media (min-width: 992px) {
    .ikh-contato2__foto { flex: 1 1 auto; aspect-ratio: auto; min-height: 420px; }
    .ikh-contato2__lateral .ikh-parceiro2 { margin-top: 0; }
}
/* 10. no celular, "Enviar mensagem" na largura toda, como os outros botões principais da tela */
@media (max-width: 575.98px) {
    .ikh-contato2 form button[type="submit"] { width: 100%; justify-content: center; }
}

/* ===== Cartões de perfil em linhas compartilhadas (14/10/2026, revisão de código da home) =====
   Lado a lado (≥ 992px), cabeçalho, lista e botão de cada cartão ocupam as MESMAS linhas da grade (subgrid): o cabeçalho mais alto define a
   altura de todos e as listas e os botões começam na mesma altura, qualquer que seja o tamanho dos textos — antes era uma altura mínima fixa
   de 3 linhas no subtítulo, que só valia para os textos de hoje. Sem botão em nenhum cartão (Sobre nós), duas linhas. */
@media (min-width: 992px) {
    @supports (grid-template-rows: subgrid) {
        .ikh-publicos { grid-template-rows: auto 1fr auto; }
        .ikh-publicos .ikh-publico-col { display: grid; grid-row: span 3; grid-template-rows: subgrid; row-gap: 18px; }
        .ikh-publicos:not(:has(.ikh-publico-col__botao)) { grid-template-rows: auto 1fr; }
        .ikh-publicos:not(:has(.ikh-publico-col__botao)) .ikh-publico-col { grid-row: span 2; }
    }
}

/* ===== Sobretítulo no celular (14/10/2026, proprietário) =====
   Na home e no Fale conosco ele herdava altura de linha 2,0 (26px numa letra de 13px): "Delivery local, com regras claras" quebrava em 390px e
   as duas linhas ficavam afastadas, com o traço no meio do bloco. No celular: altura de linha 1,4 (a das outras páginas), espaçamento entre
   letras e traço um pouco menores — cabe numa linha a partir de 390px — e, se ainda quebrar (360px), o traço acompanha a primeira linha. */
@media (max-width: 575.98px) {
    .ikh-sobretitulo { align-items: flex-start; gap: 12px; line-height: 1.4; letter-spacing: .1em; }
    .ikh-sobretitulo::before { width: 28px; margin-top: calc((1.4em - 4px) / 2); }
}

/* ===== 15/10/2026 (improve-animations): em tela de toque o toque dispara :hover e o elemento ficava LEVANTADO depois do toque. Sem mouse,
   nada sobe nem desliza por hover (o afundar do :active continua — ele tem especificidade maior). Cor e sombra do hover ficam. ===== */
@media (hover: none), (pointer: coarse) {
    .ikh-botao--primario:hover, .ikh-botao--contorno:hover, .ikh-selo-loja:hover, .ikh-cartao:hover, .ikh-escolher li:hover,
    .ikh-newsletter-form button[type="submit"]:hover, .ikh-redes a:hover, .ikh-rodape__lojas a:hover { transform: none; }
    .ikh-link-seta:hover .ikh-icone { transform: none; }
    .ikh-cartao:hover::after { transform: scaleX(.6667); }
}

/* ============ Página do Reel compartilhado (19/10/2026, docs/modulos/compartilhar-reels.md) ============ */
.ikh-reel__grade { display: grid; grid-template-columns: minmax(0, 360px) minmax(0, 1fr); gap: var(--ikh-esp-6); align-items: center; }
.ikh-reel__video { aspect-ratio: 9 / 16; border-radius: 24px; overflow: hidden; background: var(--ikh-titulo); box-shadow: 0 16px 40px rgba(55, 50, 44, .18); }
.ikh-reel__video video, .ikh-reel__video img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ikh-reel__texto { display: flex; flex-direction: column; align-items: flex-start; gap: var(--ikh-esp-2); }
/* auditoria de 19/10/2026 (M1): tamanho e altura de linha próprios — herdava o 16px/26px do body e as linhas de um nome longo se
   sobrepunham (32px de fonte em 26px de linha); peso e espaçamento dos títulos internos do site (.ikh-pagina-topo h1), menor porque divide a tela com o vídeo */
.ikh-reel__texto h1 { margin: 0; color: var(--ikh-titulo); font-size: clamp(28px, 3.2vw, 44px); line-height: 1.1; font-weight: 800; letter-spacing: -.04em; text-wrap: balance; }
.ikh-reel__loja { display: flex; align-items: center; gap: 12px; }
.ikh-reel__loja .ikh-sobretitulo { margin: 0; }
.ikh-reel__logo { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; background: var(--ikh-superficie); border: 1px solid var(--ikh-borda-quente); }
.ikh-reel__descricao { margin: 0; color: var(--ikh-texto); white-space: pre-line; }
.ikh-reel__chamada { margin: var(--ikh-esp-1) 0 0; color: var(--ikh-titulo); font-weight: 600; }
.ikh-reel__abrir[hidden] { display: none; }
@media (max-width: 767px) {
    .ikh-reel__grade { grid-template-columns: minmax(0, 1fr); gap: var(--ikh-esp-4); justify-items: center; }
    /* M2: no celular o vídeo cabia em 595 px e o título e a ação ficavam abaixo da dobra — até 60% da altura da tela */
    .ikh-reel__video { width: auto; height: min(60svh, calc((100vw - 40px) * 16 / 9)); max-width: 100%; }
    /* e a descrição (pode ser longa) vem depois da ação: título, "para pedir…" e o próximo passo entram na primeira tela */
    .ikh-reel__descricao { order: 1; }
}