/* =========================================================================
   Alvera: páginas legais (termos + política)
   Shortcodes [alv_termos] (#alv-termos) e [alv_politica] (#alv-politica).
   Portado de reformulacao-v2/termos-de-uso.html + politica-privacidade.html +
   styles.css. Tudo escopado a #alv-termos / #alv-politica. Depende de
   alv-base.css (tokens + primitivos .container/.section).
   ========================================================================= */

/* --- Hero (navy) --------------------------------------------------------- */
#alv-termos .alv-legal-hero,
#alv-politica .alv-legal-hero {
	background:
		radial-gradient(900px 500px at 80% -20%, rgba(226, 135, 41, .18), transparent 60%),
		linear-gradient(180deg, var(--alvera-navy-darker) 0%, var(--alvera-navy) 100%);
	color: #FFFFFF;
	padding-top: clamp(4rem, 7vw, 6rem);
	padding-bottom: clamp(3rem, 5vw, 4rem);
}
#alv-termos .alv-legal-hero h1,
#alv-politica .alv-legal-hero h1 {
	color: #FFFFFF;
	font-family: var(--font-display);
	font-weight: 800;
	font-size: clamp(2rem, 3.6vw, 3rem);
	letter-spacing: -0.025em;
	line-height: 1.06;
	margin-bottom: 1rem;
}
#alv-termos .alv-legal-hero h1 em,
#alv-politica .alv-legal-hero h1 em { font-style: normal; color: var(--alvera-orange); font-weight: 800; }
#alv-termos .alv-legal-hero .lead,
#alv-politica .alv-legal-hero .lead {
	color: var(--color-on-dark-muted);
	font-size: var(--fs-lead);
	max-width: 62ch;
	margin: 1.2rem 0 0;
}
#alv-termos .alv-legal-hero .lead strong,
#alv-politica .alv-legal-hero .lead strong { color: #FFFFFF; font-weight: 700; }

/* --- Breadcrumbs --------------------------------------------------------- */
#alv-termos .alv-breadcrumbs,
#alv-politica .alv-breadcrumbs {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: .5rem;
	font-size: .85rem;
	color: var(--color-on-dark-faint);
	margin-bottom: 1.4rem;
}
#alv-termos .alv-breadcrumbs a,
#alv-politica .alv-breadcrumbs a { color: var(--color-on-dark-muted); }
#alv-termos .alv-breadcrumbs a:hover,
#alv-politica .alv-breadcrumbs a:hover { color: var(--color-accent-on-dark); }
#alv-termos .alv-breadcrumbs .sep,
#alv-politica .alv-breadcrumbs .sep { color: var(--color-on-dark-faint); }
#alv-termos .alv-breadcrumbs .crumb-current,
#alv-politica .alv-breadcrumbs .crumb-current { color: #FFFFFF; font-weight: 600; }

/* --- Pílula de tag ------------------------------------------------------- */
#alv-termos .alv-tag-pill,
#alv-politica .alv-tag-pill {
	display: inline-flex;
	align-items: center;
	font-size: .74rem;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
	color: var(--color-accent-on-dark);
	background: rgba(255, 255, 255, .07);
	border: 1px solid rgba(255, 255, 255, .14);
	padding: .4rem .85rem;
	border-radius: var(--radius-pill);
	margin-bottom: 1.1rem;
}

/* --- Metadados do hero --------------------------------------------------- */
#alv-termos .alv-legal-meta,
#alv-politica .alv-legal-meta {
	display: flex;
	flex-wrap: wrap;
	gap: .6rem .9rem;
	font-size: .85rem;
	color: var(--color-on-dark-muted);
	padding-top: 1.4rem;
	margin-top: 1.4rem;
	border-top: 1px solid rgba(255, 255, 255, .12);
}
#alv-termos .alv-legal-meta .meta-item,
#alv-politica .alv-legal-meta .meta-item {
	display: inline-flex;
	align-items: center;
	gap: .45rem;
	padding: .35rem .8rem;
	background: rgba(255, 255, 255, .06);
	border: 1px solid rgba(255, 255, 255, .12);
	border-radius: var(--radius-pill);
}
#alv-termos .alv-legal-meta .meta-item strong,
#alv-politica .alv-legal-meta .meta-item strong { color: #FFFFFF; font-weight: 700; }
#alv-termos .alv-legal-meta time,
#alv-politica .alv-legal-meta time { font-variant-numeric: tabular-nums; color: var(--color-accent-on-dark); font-weight: 700; }

/* --- Layout: sumário + corpo --------------------------------------------- */
#alv-termos .alv-legal-layout,
#alv-politica .alv-legal-layout {
	display: grid;
	gap: 2.5rem;
	grid-template-columns: 1fr;
}
@media (min-width: 960px) {
	#alv-termos .alv-legal-layout,
	#alv-politica .alv-legal-layout { grid-template-columns: 260px 1fr; gap: 3.5rem; }
}
#alv-termos .alv-legal-layout > *,
#alv-politica .alv-legal-layout > * { min-width: 0; }

/* --- Sumário (TOC) ------------------------------------------------------- */
#alv-termos .alv-legal-toc,
#alv-politica .alv-legal-toc { align-self: start; }
@media (min-width: 960px) {
	#alv-termos .alv-legal-toc,
	#alv-politica .alv-legal-toc { position: sticky; top: 100px; }
}
#alv-termos .alv-legal-toc .toc-label,
#alv-politica .alv-legal-toc .toc-label {
	font-size: .72rem;
	font-weight: 800;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--color-text-muted);
	margin: 0 0 .9rem;
}
#alv-termos .alv-legal-toc .toc-list,
#alv-politica .alv-legal-toc .toc-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: grid;
	gap: .15rem;
	counter-reset: none;
	border-left: 2px solid var(--color-border);
}
#alv-termos .alv-legal-toc .toc-list a,
#alv-politica .alv-legal-toc .toc-list a {
	display: flex;
	gap: .6rem;
	align-items: baseline;
	padding: .4rem .9rem;
	margin-left: -2px;
	border-left: 2px solid transparent;
	font-size: .9rem;
	line-height: 1.35;
	color: var(--color-text-muted);
}
#alv-termos .alv-legal-toc .toc-list a:hover,
#alv-politica .alv-legal-toc .toc-list a:hover {
	color: var(--alvera-navy-darker);
	border-left-color: var(--alvera-orange);
}
#alv-termos .alv-legal-toc .toc-list a .num,
#alv-politica .alv-legal-toc .toc-list a .num {
	font-size: .72rem;
	font-weight: 800;
	color: var(--alvera-orange-dark);
	font-variant-numeric: tabular-nums;
	flex-shrink: 0;
}

/* --- Corpo do documento -------------------------------------------------- */
#alv-termos .alv-legal-body,
#alv-politica .alv-legal-body { max-width: 760px; }
#alv-termos .alv-legal-body p,
#alv-politica .alv-legal-body p {
	color: var(--color-text-body);
	font-size: 1rem;
	line-height: 1.7;
	margin: 0 0 1.1rem;
}
#alv-termos .alv-legal-body strong,
#alv-politica .alv-legal-body strong { color: var(--alvera-navy-darker); font-weight: 700; }
#alv-termos .alv-legal-body a,
#alv-politica .alv-legal-body a {
	color: var(--alvera-orange-dark);
	font-weight: 600;
	text-decoration: underline;
	text-underline-offset: 2px;
}
#alv-termos .alv-legal-body a:hover,
#alv-politica .alv-legal-body a:hover { color: var(--alvera-orange); }
#alv-termos .alv-legal-body h3,
#alv-politica .alv-legal-body h3 {
	font-size: 1.1rem;
	font-weight: 700;
	color: var(--alvera-navy-darker);
	margin: 1.75rem 0 .6rem;
}
#alv-termos .alv-legal-body ul,
#alv-politica .alv-legal-body ul {
	margin: 0 0 1.4rem;
	padding-left: 1.2rem;
}
#alv-termos .alv-legal-body ul li,
#alv-politica .alv-legal-body ul li {
	color: var(--color-text-body);
	font-size: 1rem;
	line-height: 1.6;
	margin-bottom: .5rem;
}

/* --- Títulos numerados (h2) ---------------------------------------------- */
#alv-termos .alv-legal-body h2.alv-h2,
#alv-politica .alv-legal-body h2.alv-h2 {
	display: grid;
	grid-template-columns: max-content 1fr;
	gap: .9rem;
	align-items: baseline;
	margin: 2.5rem 0 1rem;
	font-size: 1.45rem;
	scroll-margin-top: 100px;
}
#alv-termos .alv-legal-body h2.alv-h2 .num,
#alv-politica .alv-legal-body h2.alv-h2 .num {
	font-family: var(--font-sans);
	font-size: .78rem;
	font-weight: 800;
	letter-spacing: .12em;
	color: var(--alvera-orange-dark);
	background: var(--alvera-orange-soft);
	padding: .25rem .6rem;
	border-radius: var(--radius-pill);
	line-height: 1;
	align-self: center;
	white-space: nowrap;
}

/* --- Callout (aviso) ----------------------------------------------------- */
#alv-termos .alv-callout,
#alv-politica .alv-callout {
	display: flex;
	gap: 1rem;
	align-items: flex-start;
	padding: 1.25rem 1.4rem;
	background: var(--color-bg-alt);
	border: 1px solid var(--color-border);
	border-left: 4px solid var(--alvera-orange);
	border-radius: var(--radius-md);
	margin: 1.5rem 0 2rem;
}
#alv-termos .alv-callout .ic,
#alv-politica .alv-callout .ic {
	flex-shrink: 0;
	width: 36px;
	height: 36px;
	border-radius: 50%;
	background: var(--alvera-orange);
	display: grid;
	place-items: center;
}
#alv-termos .alv-callout strong,
#alv-politica .alv-callout strong {
	display: block;
	color: var(--alvera-navy-darker);
	font-weight: 800;
	margin-bottom: .25rem;
}
#alv-termos .alv-callout p,
#alv-politica .alv-callout p { margin: 0; font-size: .95rem; line-height: 1.55; }

/* --- Listas sim/não (Termos: uso permitido/proibido) --------------------- */
#alv-termos .alv-tu-list {
	list-style: none;
	padding: 0;
	margin: 1rem 0 1.75rem;
	display: grid;
	gap: .65rem;
}
#alv-termos .alv-tu-list li {
	display: flex;
	gap: .8rem;
	align-items: flex-start;
	padding: .8rem 1rem;
	background: var(--color-bg-alt);
	border-radius: var(--radius-sm);
	font-size: .95rem;
	line-height: 1.45;
	color: var(--alvera-navy-darker);
	margin-bottom: 0;
}
#alv-termos .alv-tu-list li::before {
	content: "";
	flex-shrink: 0;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	display: block;
	background-repeat: no-repeat;
	background-position: center;
	background-size: 13px;
	margin-top: 1px;
}
#alv-termos .alv-tu-list.is-yes li::before {
	background-color: var(--alvera-green-soft);
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%2334513F' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>");
}
#alv-termos .alv-tu-list.is-no li::before {
	background-color: rgba(179, 38, 30, .12);
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B3261E' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><line x1='18' y1='6' x2='6' y2='18'/><line x1='6' y1='6' x2='18' y2='18'/></svg>");
}

/* --- Cartões de direitos (Política: seus direitos) ----------------------- */
#alv-politica .alv-pp-rights {
	list-style: none;
	padding: 0;
	margin: 1rem 0 1.75rem;
	display: grid;
	gap: .65rem;
}
@media (min-width: 600px) {
	#alv-politica .alv-pp-rights { grid-template-columns: 1fr 1fr; }
}
#alv-politica .alv-pp-rights li {
	display: flex;
	gap: .8rem;
	align-items: flex-start;
	padding: .9rem 1rem;
	background: var(--color-bg-alt);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	font-size: .92rem;
	line-height: 1.45;
	color: var(--alvera-navy-darker);
	margin-bottom: 0;
}
#alv-politica .alv-pp-rights li::before {
	content: "";
	flex-shrink: 0;
	width: 22px;
	height: 22px;
	border-radius: 50%;
	background-color: var(--alvera-orange-soft);
	background-repeat: no-repeat;
	background-position: center;
	background-size: 13px;
	margin-top: 1px;
	background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23B86713' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'><polyline points='20 6 9 17 4 12'/></svg>");
}
#alv-politica .alv-pp-rights li strong {
	display: block;
	color: var(--alvera-navy-darker);
	font-weight: 800;
	margin-bottom: 1px;
}

/* --- Cartão de contato (navy) -------------------------------------------- */
#alv-termos .alv-legal-card,
#alv-politica .alv-legal-card {
	background: var(--alvera-navy-darker);
	color: #FFFFFF;
	border-radius: var(--radius-lg);
	padding: clamp(1.75rem, 3vw, 2.25rem);
	margin: 2rem 0 1rem;
}
#alv-termos .alv-legal-card h3,
#alv-politica .alv-legal-card h3 { color: #FFFFFF; margin: 0 0 .8rem; }
#alv-termos .alv-legal-card > p,
#alv-politica .alv-legal-card > p {
	color: var(--color-on-dark-muted);
	margin: 0 0 1rem;
	font-size: .98rem;
	line-height: 1.55;
}
#alv-termos .alv-legal-card a,
#alv-politica .alv-legal-card a {
	color: var(--color-accent-on-dark);
	font-weight: 700;
	text-decoration: underline;
	text-underline-offset: 3px;
}
#alv-termos .alv-legal-card a:hover,
#alv-politica .alv-legal-card a:hover { color: #FFFFFF; }
#alv-termos .alv-legal-card-grid,
#alv-politica .alv-legal-card-grid {
	display: grid;
	gap: .85rem;
	grid-template-columns: 1fr;
	margin-top: 1.25rem;
}
@media (min-width: 640px) {
	#alv-termos .alv-legal-card-grid,
	#alv-politica .alv-legal-card-grid { grid-template-columns: 1fr 1fr; }
}
#alv-termos .alv-legal-card-grid .card-line,
#alv-politica .alv-legal-card-grid .card-line {
	padding: .85rem 1rem;
	background: rgba(255, 255, 255, .05);
	border: 1px solid rgba(255, 255, 255, .1);
	border-radius: var(--radius-sm);
	font-size: .92rem;
}
#alv-termos .alv-legal-card-grid .card-line.col-span-full,
#alv-politica .alv-legal-card-grid .card-line.col-span-full { grid-column: 1 / -1; }
#alv-termos .alv-legal-card-grid .lbl,
#alv-politica .alv-legal-card-grid .lbl {
	display: block;
	font-size: .7rem;
	font-weight: 800;
	letter-spacing: .12em;
	text-transform: uppercase;
	color: var(--color-on-dark-faint);
	margin-bottom: 3px;
}
#alv-termos .alv-legal-card-grid .val,
#alv-politica .alv-legal-card-grid .val { color: #FFFFFF; font-weight: 700; }
#alv-termos .alv-legal-card-grid .val a,
#alv-politica .alv-legal-card-grid .val a { color: #FFFFFF; }

/* --- Nota legal (rodapé do documento) ------------------------------------ */
#alv-termos .alv-legal-note,
#alv-politica .alv-legal-note {
	font-size: .82rem;
	color: var(--color-text-muted);
	line-height: 1.6;
	padding: 1rem 1.2rem;
	background: var(--color-bg-alt);
	border-radius: var(--radius-sm);
	border-left: 3px solid var(--color-border-strong);
	margin: 1.5rem 0 0;
}
#alv-termos .alv-legal-note strong,
#alv-politica .alv-legal-note strong { color: var(--alvera-navy-darker); font-weight: 800; }
