/* ============================================================
   Trilion Signature — páginas /signature/luxo (hub) e /signature/luxo/{slug} (Joalheria e Imobiliário).
   Carregado DEPOIS de canal.css (tokens e classes tc-*: tc-hero, tc-sec, tc-lead, tc-cta, tc-faq, tc-qa, tc-crumb, tc-pfoot) e antes de a11y.css.
   Tudo sob .ts-luxo-pg ou com prefixo lx-: nenhuma página existente muda.
   Tamanhos de letra com + var(--ts-fs,0px) (botão Aa). Contraste AA: texto de rótulo sobre escuro #A38C4B (5,49:1), sobre claro #6F5C2B (6,26:1).
   Alvos de toque de 44 px, foco visível, sem rolagem lateral em 390 e 1360 px. Alto contraste (html.ts-light) no fim.
   ============================================================ */

.ts-luxo-pg{--lx-rot:#A38C4B;--lx-papel:#2B241C;--lx-papel-rot:#6F5C2B}
.ts-luxo-pg .wrap.tc-narrow{max-width:860px}   /* .ts .wrap (trilion.css) vence .tc-narrow; aqui a coluna de leitura volta a 860 px */
.ts-luxo-pg a:focus-visible,.ts-luxo-pg summary:focus-visible{outline:2px solid var(--gold);outline-offset:3px}

/* ---- topo ---- */
.lx-hero{padding-bottom:clamp(44px,6vw,84px)}
.lx-crumb ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center}
.lx-crumb li{display:inline-flex;align-items:center;font-size:calc(11px + var(--ts-fs,0px));letter-spacing:.12em;text-transform:uppercase}
.lx-crumb li+li::before{content:"\203A";margin:0 4px;color:var(--muted)}
.lx-crumb a{display:inline-flex;align-items:center;min-height:44px;padding:0 6px}
.lx-crumb [aria-current]{color:var(--gold-light);padding:0 6px}
.lx-hgrid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(32px,5vw,72px);align-items:center}
.lx-hgrid-1{grid-template-columns:minmax(0,860px)}
.tc-htxt.lx-htxt h1{font-size:calc(clamp(30px,3.9vw,54px) + var(--ts-fs,0px));line-height:1.1;letter-spacing:-.012em}
.lx-hero .tc-lead{margin-top:28px;padding-left:22px;border-left:2px solid var(--gold);max-width:60ch}
.lx-meta{margin:22px 0 0;font-size:calc(12px + var(--ts-fs,0px));letter-spacing:.14em;text-transform:uppercase;color:var(--muted);line-height:1.6}
.lx-meta time{color:var(--gold-light)}
.lx-himg{margin:0;position:relative;aspect-ratio:3/2;width:100%;overflow:hidden;border:1px solid var(--hair);border-radius:3px;box-shadow:0 30px 70px -30px rgba(0,0,0,.7)}
.lx-himg::after{content:"";position:absolute;inset:10px;border:1px solid rgba(201,168,76,.28);pointer-events:none}
.lx-himg img{display:block;width:100%;height:100%;object-fit:cover}
.lx-himg figcaption{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:34px 22px 14px;font-size:calc(12px + var(--ts-fs,0px));letter-spacing:.08em;color:var(--cream);
  background:linear-gradient(0deg,rgba(26,22,18,.86),rgba(26,22,18,0))}

/* hub: índice dos segmentos ao lado do título */
.lx-index{display:grid;border:1px solid var(--hair);border-left:2px solid var(--gold);border-radius:0 3px 3px 0;padding:6px 0;
  background:linear-gradient(90deg,rgba(201,168,76,.075),rgba(201,168,76,.02) 70%)}
.lx-index a{display:flex;justify-content:space-between;align-items:baseline;gap:16px;min-height:44px;padding:20px clamp(20px,3vw,32px);border-top:1px solid var(--hair);
  font-family:var(--disp);font-weight:300;font-size:calc(clamp(22px,2.4vw,30px) + var(--ts-fs,0px));line-height:1.2;color:var(--cream);transition:color .25s}
.lx-index a:first-child{border-top:0}
.lx-index a:hover{color:var(--gold-light)}
.lx-index a i{flex:none;font-family:var(--body);font-style:normal;font-size:calc(12px + var(--ts-fs,0px));letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.lx-index small{display:block;padding:16px clamp(20px,3vw,32px) 12px;border-top:1px solid var(--hair);font-size:calc(14px + var(--ts-fs,0px));line-height:1.55;color:var(--muted)}

/* ---- seções de leitura ---- */
.lx-2col{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,6vw,88px);align-items:start}
.lx-2col-inv{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr)}
.lx-2col-inv .lx-txt{order:2}
.lx-2col-inv .lx-fig{order:1}
.lx-2col-1{grid-template-columns:minmax(0,860px)}
.lx-txt{min-width:0}
.lx-fig{margin:0;position:sticky;top:96px}
.lx-fig img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;border:1px solid var(--hair);border-radius:3px}
.lx-fig figcaption{margin-top:10px;font-size:calc(13px + var(--ts-fs,0px));font-style:italic;letter-spacing:.02em;color:var(--muted)}

/* critérios: lista informativa, sem numeração (não é ranking) */
.lx-crit{list-style:none;margin:26px 0 0;padding:0}
.lx-crit li{position:relative;padding:22px 0 22px 34px;border-top:1px solid var(--hair)}
.lx-crit li:last-child{border-bottom:1px solid var(--hair)}
.lx-crit li::before{content:"";position:absolute;left:4px;top:33px;width:8px;height:8px;background:var(--gold);transform:rotate(45deg)}
.lx-crit h3{margin:0 0 8px;font-weight:300;font-size:calc(clamp(21px,2.1vw,26px) + var(--ts-fs,0px));line-height:1.2;color:var(--tc-strong)}
.lx-crit p{margin:0;font-size:calc(17px + var(--ts-fs,0px));line-height:1.7;color:var(--tc-txt)}

/* perguntas para fazer: faixa em papel claro, lista numerada */
.lx-check{background:linear-gradient(160deg,#FAF2DC 0%,#F2E4BB 100%);border-top:1px solid var(--gold)}
.lx-check h2{color:var(--onyx)}
.lx-lista{list-style:none;counter-reset:lx;margin:28px 0 0;padding:0}
.lx-lista li{counter-increment:lx;display:grid;grid-template-columns:58px minmax(0,1fr);gap:0 14px;align-items:baseline;padding:18px 0;border-top:1px solid rgba(111,92,43,.38);
  font-size:calc(18px + var(--ts-fs,0px));line-height:1.55;color:var(--lx-papel)}
.lx-lista li:last-child{border-bottom:1px solid rgba(111,92,43,.38)}
.lx-lista li::before{content:counter(lx,decimal-leading-zero);font-family:var(--disp);font-weight:300;font-size:calc(30px + var(--ts-fs,0px));line-height:1;color:var(--lx-papel-rot)}

/* contexto local: rótulo, exemplos (lista informativa) e nota */
.lx-rot{margin:30px 0 8px;font-family:var(--body);font-weight:500;font-size:calc(11px + var(--ts-fs,0px));letter-spacing:.26em;text-transform:uppercase;color:var(--lx-rot)}
.lx-ex{list-style:none;margin:0 0 6px;padding:0;display:grid;gap:10px}
.lx-ex li{padding:12px 0 12px 18px;border-left:2px solid var(--gold)}
.lx-ex strong{display:block;font-family:var(--disp);font-weight:400;font-size:calc(19px + var(--ts-fs,0px));line-height:1.3;color:var(--tc-strong)}
.lx-ex span{display:block;margin-top:2px;font-size:calc(16px + var(--ts-fs,0px));line-height:1.6;color:var(--tc-txt)}
.lx-ex em{display:block;margin-top:4px;font-size:calc(13px + var(--ts-fs,0px));letter-spacing:.02em;color:var(--muted)}
.lx-nota{margin:22px 0 0;padding:14px 18px;border-left:2px solid var(--gold);border-radius:0 3px 3px 0;background:rgba(201,168,76,.07)}
.lx-nota p{margin:0;font-size:calc(15px + var(--ts-fs,0px));font-style:italic;line-height:1.6;color:var(--tc-soft)}

/* acompanhamento e convite */
.lx-acomp{background:radial-gradient(90% 120% at 50% 0%,rgba(201,168,76,.13),transparent 62%),var(--onyx)}
.lx-acomp h2{margin-top:0}
.lx-acomp .tc-cta{margin-top:30px}

/* fontes e aviso */
.lx-fl{list-style:none;margin:24px 0 0;padding:0}
.lx-fl li{display:flex;flex-wrap:wrap;align-items:center;gap:0 18px;min-height:44px;padding:6px 0;border-bottom:1px solid var(--hair)}
.lx-fl a{display:inline-flex;align-items:center;min-height:44px;font-size:calc(17px + var(--ts-fs,0px));color:var(--gold-light);text-decoration:underline;text-decoration-color:rgba(201,168,76,.45);text-underline-offset:.25em;overflow-wrap:anywhere}
.lx-fl a:hover{color:var(--gold);text-decoration-color:var(--gold)}
.lx-fl span{font-size:calc(14px + var(--ts-fs,0px));color:var(--muted)}
.lx-aviso{margin:34px 0 0;padding:16px 20px;border:1px solid var(--hair);border-radius:3px;background:rgba(255,255,255,.02)}
.lx-aviso p{margin:0;font-size:calc(14.5px + var(--ts-fs,0px));line-height:1.65;color:var(--tc-soft)}

/* continue lendo */
.lx-rel{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,2vw,22px)}
.lx-rel a{display:flex;flex-direction:column;gap:10px;height:100%;min-height:44px;padding:22px 22px 24px;border:1px solid var(--hair);border-radius:3px;background:var(--onyx-2);transition:border-color .3s,transform .35s cubic-bezier(.16,1,.3,1)}
.lx-rel a:hover{border-color:var(--gold);transform:translateY(-3px)}
.lx-rel-seg{font-size:calc(11px + var(--ts-fs,0px));letter-spacing:.26em;text-transform:uppercase;font-weight:500;color:var(--lx-rot)}
.lx-rel-q{font-weight:300;font-size:calc(clamp(19px,1.8vw,22px) + var(--ts-fs,0px));line-height:1.3;color:var(--tc-strong)}
.lx-links{display:flex;flex-wrap:wrap;gap:4px 30px;margin-top:26px}
.lx-links a{display:inline-flex;align-items:center;min-height:44px;font-size:calc(16px + var(--ts-fs,0px));color:var(--gold-light);text-decoration:underline;text-decoration-color:rgba(201,168,76,.45);text-underline-offset:.25em;transition:color .2s}
.lx-links a:hover{color:var(--gold);text-decoration-color:var(--gold)}
.lx-marcas{border-top:1px solid var(--hair)}
.lx-marcas-eyebrow{margin:0 0 14px;font-size:calc(12px + var(--ts-fs,0px));letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}
.lx-marcas .tc-cta{margin-top:26px}
.lx-marcas-nota{margin:22px 0 0;font-size:calc(14px + var(--ts-fs,0px));line-height:1.6;color:var(--muted)}
html.ts-light .lx-marcas-eyebrow{color:#6F5C2B}
html.ts-light .lx-marcas-nota{color:#5C5C5C}

/* ---- hub: cartões por segmento ---- */
.lx-seg-intro{max-width:62ch}
.lx-cards{list-style:none;margin:36px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.4vw,28px)}
.lx-card{position:relative;display:flex;flex-direction:column;border:1px solid var(--hair);border-radius:3px;background:var(--onyx-2);overflow:hidden;transition:border-color .3s,transform .35s cubic-bezier(.16,1,.3,1)}
.lx-card:hover{border-color:var(--gold);transform:translateY(-3px)}
.lx-card:focus-within{outline:2px solid var(--gold);outline-offset:3px}
.lx-card-im{margin:0;aspect-ratio:3/2;overflow:hidden;border-bottom:1px solid var(--hair);background:var(--onyx)}
.lx-card-im img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .9s cubic-bezier(.16,1,.3,1)}
.lx-card:hover .lx-card-im img{transform:scale(1.04)}
.lx-card-tx{display:flex;flex-direction:column;gap:10px;flex:1;padding:20px 22px 24px}
.lx-card h3{margin:0;font-weight:300;font-size:calc(clamp(19px,1.7vw,22px) + var(--ts-fs,0px));line-height:1.28;color:var(--tc-strong);text-wrap:balance}
.lx-card h3 a{display:block;min-height:44px}
.lx-card h3 a::after{content:"";position:absolute;inset:0;z-index:1}   /* o cartão inteiro é o alvo de toque */
.lx-card h3 a:focus-visible{outline:none}
.lx-card p{margin:0;font-size:calc(15.5px + var(--ts-fs,0px));line-height:1.6;color:var(--tc-txt)}
.lx-vazio{max-width:60ch}

/* ---- telas menores ---- */
@media(max-width:1000px){
  .lx-rel,.lx-cards{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:860px){
  .lx-hgrid,.lx-2col,.lx-2col-inv{grid-template-columns:minmax(0,1fr)}
  .lx-2col-inv .lx-txt,.lx-2col-inv .lx-fig{order:0}
  .lx-fig{position:relative;top:auto}
  .lx-check .lx-lista li{grid-template-columns:48px minmax(0,1fr)}
}
@media(max-width:620px){
  .lx-rel,.lx-cards{grid-template-columns:minmax(0,1fr)}
  .lx-hero .tc-lead{padding-left:16px}
  .lx-himg::after{inset:8px}
}

/* ---- aumento de letra (botão Aa): rótulos em caixa-alta perdem espaçamento ---- */
html.ts-fs-up .lx-meta,html.ts-fs-up .lx-rot,html.ts-fs-up .lx-rel-seg,html.ts-fs-up .lx-index a i,html.ts-fs-up .lx-crumb li{letter-spacing:.08em}

/* ---- movimento reduzido / pausar movimento ---- */
@media(prefers-reduced-motion:reduce){.lx-card,.lx-card-im img,.lx-rel a,.lx-index a{transition:none}.lx-card:hover,.lx-rel a:hover{transform:none}.lx-card:hover .lx-card-im img{transform:none}}
html.ts-still .lx-card,html.ts-still .lx-card-im img,html.ts-still .lx-rel a,html.ts-still .lx-index a{transition:none!important}
html.ts-still .lx-card:hover,html.ts-still .lx-rel a:hover{transform:none}
html.ts-still .lx-card:hover .lx-card-im img{transform:none}

/* ---- alto contraste (html.ts-light): fundo branco, cartões pastel, texto escuro ---- */
html.ts-light .lx-hero .tc-lead{border-left-color:#C9A84C}
html.ts-light .lx-meta time,html.ts-light .lx-crumb [aria-current]{color:#6F5C2B}
html.ts-light .lx-crit li,html.ts-light .lx-crit li:last-child,html.ts-light .lx-fl li{border-color:#D9C58E}
html.ts-light .lx-rot,html.ts-light .lx-rel-seg{color:#6F5C2B}
html.ts-light .lx-ex em,html.ts-light .lx-fl span,html.ts-light .lx-fig figcaption{color:#5E5546}
html.ts-light .lx-ex strong{color:#1A1612}
html.ts-light .lx-nota,html.ts-light .lx-aviso{background:#FBF5E6;border-color:#D9C58E}
html.ts-light .lx-fl a,html.ts-light .lx-links a{color:#6F5C2B}
html.ts-light .lx-rel a,html.ts-light .lx-card,html.ts-light .lx-index{background:#FBF5E6;border-color:#D9C58E}
html.ts-light .lx-card-im{background:#fff;border-bottom-color:#D9C58E}
html.ts-light .lx-index a{color:#1A1612;border-top-color:#D9C58E}
html.ts-light .lx-index a i{color:#6F5C2B}
html.ts-light .lx-index small{color:#5E5546;border-top-color:#D9C58E}
html.ts-light .lx-acomp{background:#fff}

/* ---- tema claro: padrão das páginas /signature/luxo (html[data-ts-luxo]); o escuro é a opção "Baixo contraste" ---- */
/* foto do topo: a legenda sai de cima da foto e vai para baixo dela (texto nunca sobre a foto) */
html.ts-light .lx-himg{aspect-ratio:auto;overflow:visible;border:0;border-radius:0;box-shadow:none}
html.ts-light .lx-himg::after{display:none}
html.ts-light .lx-himg img{height:auto;aspect-ratio:3/2;border:1px solid #D9C58E;border-radius:3px;box-shadow:0 24px 50px -28px rgba(26,22,18,.4)}
html.ts-light .lx-himg figcaption{position:static;padding:10px 0 0;background:none;color:#5E5546}
/* botão de ouro do menu: texto escuro com contraste AA (era 4,45:1); cor do botão mantida */
html.ts-light .ts-luxo-pg .ts-nav .btn:not(.ghost){color:#1A1612}
/* rodapé de CTA dos canais: o destaque em itálico do título não pode ficar bege sobre o branco */
html.ts-light .ts-luxo-pg .ts-sec--emp h2 em{color:#6F5C2B}

/* ---- CTA "este assunto em cada tema do guia" (artigos de marketing): oito cartões .lx-card, uma frase por tema ---- */
.lx-temas-ab{max-width:62ch}
.lx-temas-g{grid-template-columns:repeat(4,minmax(0,1fr))}
.lx-temas-g .lx-card-im{aspect-ratio:4/3}
.lx-temas-g .lx-card h3{font-size:calc(clamp(18px,1.5vw,20px) + var(--ts-fs,0px))}
.lx-temas-g .lx-card p{font-size:calc(14.5px + var(--ts-fs,0px));line-height:1.55}
@media(max-width:1100px){.lx-temas-g{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:620px){.lx-temas-g{grid-template-columns:minmax(0,1fr)}}
