/* Lobombom e a Turma · direção "Clareira colorida" (30/09/2026)
   Cores dos sentimentos são fixas nos 3 idiomas. Nada de texto em imagem.
   Blocos crescem com o texto (o alemão é ~30% mais longo). */

:root{
  --creme:#FFF8EC; --areia:#F3E6CF; --areia-2:#EADBC2; --tinta:#2B2118; --suave:#6E5F4C;
  --azul:#2E58A6; --azul-esc:#1d3c78; --laranja:#F29A2E; --pelo:#A9582A; --folha:#3F8F3A; --grama:#5DBB4E;
  --ceu:#BFE6FF; --noite:#1F2B6B; --ouro:#F2C230;
  --medo:#6C63FF; --sono:#1F2B6B; --tristeza:#2FA8E0; --amizade:#F29A2E; --fe:#F2C230; --gentileza:#EF5F93; --paciencia:#3FAE5A;
  --titulo:Sniglet,'Comic Neue','Trebuchet MS',sans-serif;
  --texto:'Atkinson Hyperlegible','Segoe UI',Roboto,Arial,sans-serif;
  --raio:18px; --gutter:clamp(16px,4vw,32px);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--creme);color:var(--tinta);font:400 1.0625rem/1.65 var(--texto);hyphens:auto;overflow-wrap:break-word}
img{max-width:100%;height:auto}
a{color:var(--azul)}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--laranja);outline-offset:3px;border-radius:6px}
h1,h2,h3,h4{font-family:var(--titulo);font-weight:800;line-height:1.12;text-wrap:balance;margin:0 0 .5em}
h1{font-size:clamp(1.9rem,5vw,2.9rem)}
h2{font-size:clamp(1.35rem,3vw,1.75rem);color:var(--folha)}

.lob-wrap{width:100%;max-width:1180px;margin-inline:auto;padding-inline:var(--gutter)}
.lob-wrap--estreito{max-width:780px}
.lob-skip{position:absolute;left:-999px;top:8px;background:#fff;padding:8px 12px;z-index:99}
.lob-skip:focus{left:8px}

/* Botões */
.lob-btn,.wp-block-button__link{display:inline-flex;align-items:center;justify-content:center;text-align:center;gap:8px;max-width:100%;
  background:var(--azul);color:#fff;font:700 1rem/1.25 var(--texto);border-radius:16px;padding:.8em 1.3em;text-decoration:none;
  box-shadow:0 5px 0 var(--azul-esc);transition:transform .12s,box-shadow .12s}
.lob-btn:hover,.wp-block-button__link:hover{transform:translateY(2px);box-shadow:0 3px 0 var(--azul-esc);color:#fff}
.lob-btn--ouro{background:var(--ouro);color:#2b2000;box-shadow:0 5px 0 #b08b12}
.lob-btn--ouro:hover{box-shadow:0 3px 0 #b08b12;color:#2b2000}

/* Topo */
.lob-xadrez{height:12px;background:
  repeating-linear-gradient(90deg,rgba(46,88,166,.9) 0 10px,transparent 10px 20px),
  repeating-linear-gradient(0deg,rgba(46,88,166,.55) 0 4px,transparent 4px 8px),var(--laranja)}
.lob-topo{background:var(--creme)}
.lob-topo__in{display:flex;align-items:center;justify-content:space-between;gap:10px 20px;flex-wrap:wrap;padding-block:14px}
.lob-logo{font:800 1.6rem/1 var(--titulo);color:var(--pelo);text-decoration:none;display:flex;gap:6px;align-items:baseline}
.lob-logo span{color:var(--azul);font-size:1rem}
.lob-nav{display:flex;align-items:center;gap:6px 18px;flex-wrap:wrap}
.lob-menu,.lob-menu-rodape{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 18px}
.lob-menu a{font-weight:700;color:var(--folha);text-decoration:none}
.lob-menu a:hover,.lob-menu .current-menu-item a{color:var(--azul)}

/* Seletor de idioma: discreto */
.lob-lang{position:relative;font-size:.8rem;color:var(--suave)}
.lob-lang summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:4px;opacity:.8}
.lob-lang summary::-webkit-details-marker{display:none}
.lob-lang svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:1.4}
.lob-lang ul{position:absolute;right:0;top:130%;z-index:20;list-style:none;margin:0;padding:6px;background:#fff;border:2px solid var(--areia-2);border-radius:12px;min-width:150px;box-shadow:0 10px 24px -12px rgba(0,0,0,.3)}
.lob-lang a{display:block;padding:6px 10px;border-radius:8px;color:var(--tinta);text-decoration:none}
.lob-lang a:hover,.lob-lang a[aria-current]{background:var(--areia)}

/* Hero */
.lob-hero{position:relative;overflow:hidden;background:url(../img/clareira.webp) center 58%/cover}
.lob-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(95deg,rgba(255,248,236,.96) 0%,rgba(255,248,236,.82) 42%,rgba(255,248,236,0) 74%)}
.lob-hero__confete{position:absolute;inset:0;pointer-events:none;background-image:
  radial-gradient(7px 7px at 8% 18%,var(--gentileza) 50%,transparent 52%),radial-gradient(6px 6px at 36% 9%,var(--fe) 50%,transparent 52%),
  radial-gradient(8px 8px at 52% 30%,var(--tristeza) 50%,transparent 52%),radial-gradient(6px 6px at 44% 72%,var(--medo) 50%,transparent 52%),
  radial-gradient(7px 7px at 94% 20%,var(--amizade) 50%,transparent 52%),radial-gradient(6px 6px at 22% 88%,var(--paciencia) 50%,transparent 52%)}
.lob-hero__in{position:relative;display:grid;grid-template-columns:1.1fr .9fr;align-items:end;gap:12px;padding-top:clamp(28px,6vw,64px)}
.lob-hero__txt{display:grid;gap:16px;padding-bottom:clamp(48px,7vw,84px);justify-items:start}
.lob-hero h1{margin:0;font-size:clamp(2.1rem,5.5vw,3.4rem)}
.lob-hero p{margin:0;max-width:42ch;font-size:1.125rem;color:#3d3226}
.lob-hero__pics{display:flex;align-items:end;justify-content:center}
.lob-hero__lobo{width:60%;max-width:320px;position:relative;z-index:2}
.lob-hero__lado{width:26%;max-width:130px;margin:0 -18px 10px}
.lob-onda{display:block;width:100%;height:40px;margin-top:-38px;position:relative;z-index:3;fill:var(--creme)}

/* Seções */
.lob-sec{padding-block:clamp(24px,4vw,40px)}
.lob-sec__cab{display:flex;align-items:baseline;justify-content:space-between;gap:8px 16px;flex-wrap:wrap}
.lob-sec__cab a{font-weight:700;text-decoration:none}

/* Sentimentos */
.lob-sentimentos{display:grid;grid-template-columns:repeat(auto-fit,minmax(118px,1fr));gap:10px}
.lob-sentimento{background:var(--c);color:var(--ct);border-radius:20px;padding:16px 8px 13px;text-align:center;text-decoration:none;
  font:800 1.05rem/1.2 var(--titulo);display:grid;gap:4px;box-shadow:inset 0 -6px 0 rgba(0,0,0,.14);transition:transform .15s}
.lob-sentimento small{font:400 .78rem var(--texto);opacity:.92;font-variant-numeric:tabular-nums}
.lob-sentimento:hover{transform:translateY(-3px) rotate(-1deg)}

/* Cards de história */
.lob-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px}
.lob-card{background:#fff;border:3px solid var(--c);border-radius:var(--raio);overflow:hidden;transition:transform .15s}
.lob-card:hover{transform:translateY(-3px)}
.lob-card a{display:grid;color:inherit;text-decoration:none;height:100%}
.lob-card__th{aspect-ratio:16/9;background:var(--areia) center/cover;position:relative;display:block}
.lob-card__th em{position:absolute;left:10px;top:10px;background:var(--c);color:var(--ct);font:700 .75rem var(--texto);font-style:normal;border-radius:99px;padding:3px 10px}
.lob-card__body{padding:10px 12px 14px;display:grid;gap:4px}
.lob-card__body strong{font:800 1.08rem/1.2 var(--titulo)}
.lob-card__body small{color:var(--suave);font-size:.82rem}

/* Turma */
.lob-turma{display:flex;gap:4px;align-items:flex-end;justify-content:space-around;border-radius:24px;padding:16px 12px 0;overflow:hidden;
  background:linear-gradient(180deg,var(--ceu),#E5F6FF 62%,#9ED98F 62%,var(--grama) 100%)}
.lob-turma__p{width:15%;display:grid;justify-items:center;text-decoration:none;color:var(--tinta);transition:transform .15s}
.lob-turma__p--lobo{width:19%}
.lob-turma__p img{width:100%;max-width:110px}
.lob-turma__p--lobo img{max-width:140px}
.lob-turma__p span{font:800 .8rem var(--titulo);background:#fff;border-radius:99px;padding:2px 10px;margin:-6px 0 10px;white-space:nowrap}
.lob-turma__p:hover{transform:translateY(-4px)}

/* Ofertas */
.lob-oferta{border-radius:24px;padding:18px;display:grid;grid-template-columns:110px 1fr;gap:16px;align-items:center;position:relative;overflow:hidden;margin-block:24px}
.lob-oferta--noite{background:radial-gradient(circle at 88% 12%,rgba(242,194,48,.35),transparent 35%),var(--noite);color:#FBF3DF}
.lob-oferta--noite::after{content:"";position:absolute;inset:0;pointer-events:none;background-image:radial-gradient(1.5px 1.5px at 40% 20%,#fff 50%,transparent 52%),radial-gradient(1px 1px at 60% 70%,#fff 50%,transparent 52%),radial-gradient(2px 2px at 75% 35%,#ffe9a8 50%,transparent 52%),radial-gradient(1.5px 1.5px at 92% 80%,#fff 50%,transparent 52%)}
.lob-oferta--kit{background:#fff;border:3px solid var(--areia-2)}
.lob-oferta > div{position:relative;z-index:1;display:grid;gap:8px;justify-items:start}
.lob-oferta__capa{aspect-ratio:3/4;border-radius:12px;background:center 50%/cover;background-position:70% center}
.lob-oferta__capa--kit{background:linear-gradient(160deg,var(--azul),var(--ouro))}
.lob-oferta__tit{margin:0;font:800 1.3rem/1.15 var(--titulo)}
.lob-oferta--noite .lob-oferta__tit{color:var(--ouro)}
.lob-oferta__txt{margin:0;font-size:.95rem}
.lob-oferta--noite .lob-oferta__txt{color:#D3D8EE}

/* História */
.lob-historia{padding-block:24px 8px}
.lob-trilha{font-size:.85rem;color:var(--suave);margin:0 0 10px}
.lob-trilha a{color:inherit}
.lob-meta{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.lob-chip{display:inline-flex;align-items:center;font:700 .82rem var(--texto);border-radius:99px;padding:5px 12px;background:#fff;border:2px solid var(--areia-2);color:var(--tinta);text-decoration:none}
.lob-chip--cheio{background:var(--c);border-color:var(--c);color:var(--ct)}
.lob-video{position:relative;aspect-ratio:16/9;border-radius:22px;background:var(--areia) center/cover;display:grid;place-items:center;border:5px solid var(--c);overflow:hidden;margin-bottom:22px}
.lob-video iframe{position:absolute;inset:0;width:100%;height:100%;border:0}
.lob-video__play{width:72px;height:72px;border-radius:50%;border:0;cursor:pointer;background:var(--laranja);box-shadow:0 6px 0 #b86d14;display:grid;place-items:center}
.lob-video__play::after{content:"";border-left:22px solid #fff;border-top:14px solid transparent;border-bottom:14px solid transparent;margin-left:6px}
.lob-video__aviso{position:absolute;bottom:8px;right:10px;font-size:.72rem;color:#fff;background:rgba(0,0,0,.45);border-radius:6px;padding:2px 8px}
.lob-historia__capa{margin:0 0 22px}
.lob-historia__capa img{border-radius:22px}
.lob-historia__texto{font-size:1.125rem;line-height:1.8}
.lob-caixa{border-radius:20px;padding:14px 18px;margin:20px 0}
.lob-caixa strong{display:block;font:800 1.05rem var(--titulo);color:var(--folha);margin-bottom:4px}
.lob-caixa p{margin:0}
.lob-caixa--dica{background:#EAF7E4;border:3px solid #BFE5B1}
.lob-caixa--versiculo{background:#FFF4CC;border:3px solid #F7DD7A;font-style:italic;margin-inline:0}
.lob-caixa--versiculo strong{color:#8a6a00;font-style:normal}
.lob-caixa--versiculo cite{font-style:normal;font-weight:700;white-space:nowrap}

/* Biblioteca */
.lob-arquivo{padding-block:28px}
.lob-arquivo h1{color:var(--c)}
.lob-arquivo__desc{max-width:65ch;color:var(--suave)}
.lob-filtros{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.lob-filtros--idade{align-items:center;font-size:.9rem;color:var(--suave)}
.lob-chip--cor{border-color:var(--c);color:var(--tinta)}
.lob-chip.is-on{background:var(--c,var(--azul));border-color:var(--c,var(--azul));color:var(--ct,#fff)}
.lob-cards--grade{margin-top:18px}
.lob-vazio{padding:24px 0;color:var(--suave)}
.lob-paginas .nav-links{display:flex;gap:6px;justify-content:center;margin-top:24px;flex-wrap:wrap}
.lob-paginas .page-numbers{display:inline-grid;place-items:center;min-width:40px;height:40px;border-radius:12px;background:#fff;border:2px solid var(--areia-2);text-decoration:none;color:var(--tinta);font-weight:700}
.lob-paginas .current{background:var(--azul);border-color:var(--azul);color:#fff}

/* Conteúdo escrito no editor (páginas, vendas, histórias) */
.lob-pagina{padding-block:28px}
.lob-prosa > *{margin-block:0 1em}
.lob-prosa h2{margin-top:1.4em}
.lob-prosa img{border-radius:16px}
.lob-prosa blockquote{border-left:5px solid var(--laranja);margin-inline:0;padding:.2em 1em;font-style:italic}
.lob-prosa details{background:#fff;border:2px solid var(--areia-2);border-radius:16px;padding:12px 16px;margin-block:10px}
.lob-prosa summary{font-weight:700;cursor:pointer}
.lob-prosa .wp-block-group.has-background{border-radius:24px;padding:clamp(18px,4vw,36px)}
.lob-prosa--venda{max-width:1180px;margin-inline:auto;padding:0 var(--gutter) 24px}
.lob-prosa--venda > .alignfull{margin-inline:calc(-1 * var(--gutter))}
.lob-prosa--venda > *:not(.alignwide):not(.alignfull){max-width:720px;margin-inline:auto}

/* 404 */
.lob-404{text-align:center;padding-block:40px;display:grid;justify-items:center;gap:10px}
.lob-404 img{max-width:200px}

/* Rodapé */
.lob-rodape{margin-top:40px;background:var(--areia);border-top:6px solid var(--grama)}
.lob-rodape__in{display:flex;flex-wrap:wrap;gap:16px 32px;align-items:center;justify-content:space-between;padding-block:24px}
.lob-rodape__marca{display:flex;align-items:center;gap:12px}
.lob-rodape__marca strong{display:block;font:800 1.1rem var(--titulo);color:var(--pelo)}
.lob-rodape__marca span{font-size:.9rem;color:var(--suave)}
.lob-rodape nav{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center}
.lob-rodape a{color:var(--tinta)}
.lob-rodape__copy{margin:0;font-size:.85rem;color:var(--suave);width:100%}

/* Celular */
@media (max-width:720px){
  .lob-hero__in{grid-template-columns:1fr}
  .lob-hero__txt{padding-bottom:8px}
  .lob-hero__pics{margin-bottom:24px}
  .lob-hero__lobo{max-width:200px}
  .lob-hero::before{background:linear-gradient(180deg,rgba(255,248,236,.95) 0%,rgba(255,248,236,.8) 55%,rgba(255,248,236,.2) 100%)}
  .lob-oferta{grid-template-columns:80px 1fr;padding:14px}
  .lob-turma{flex-wrap:wrap;justify-content:center}
  .lob-turma__p{width:30%}
  .lob-turma__p--lobo{width:30%}
}

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