/* ==========================================================================
   Privacy- en cookieverklaring "Helder en eerlijk"
   ========================================================================== */

.as-legal { padding: clamp(40px, 6vw, 88px) 0 var(--section); background: var(--linnen); }
.as-legal__head { margin-bottom: clamp(24px, 3vw, 40px); }
.as-legal__title { margin: 0 0 .2em; font: 700 clamp(3.2rem, 6vw, 6rem)/.95 var(--f-h2); letter-spacing: .02em; color: var(--kop); }
.as-legal__updated { margin: 0 0 1.2rem; font: 400 1.05rem/1 var(--f-h1); letter-spacing: .1em; color: var(--taupe-diep); }
.as-legal__tools { display: flex; flex-wrap: wrap; gap: .6rem; }
.as-share { display: inline-flex; align-items: center; gap: .5rem; padding: .6rem 1.1rem; border: 0; border-radius: 30px; background: var(--wit); font: inherit; font-weight: 500; color: var(--kop); text-decoration: none; cursor: pointer; transition: background-color .3s, color .3s; }
.as-share .as-icon { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; }
.as-share:hover { background: var(--kop); color: var(--wit); }

/* In het kort */
.as-legal__summary { margin-bottom: clamp(40px, 5vw, 72px); }
.as-legal-kort { position: relative; padding: clamp(24px, 3.4vw, 48px); border-radius: 6px; background: var(--mint); color: var(--kop); overflow: hidden; }
.as-legal-kort__mono { position: absolute; right: -2%; bottom: -24%; width: min(36%, 300px); color: var(--wit); opacity: .45; pointer-events: none; }
.as-legal-kort__title { position: relative; margin: 0 0 1rem; font: 700 clamp(2.2rem, 3vw, 3rem)/1 var(--f-h2); color: var(--kop); }
.as-legal-kort__list { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .9rem 2rem; max-width: 980px; }
.as-legal-kort__list li { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: .8rem; align-items: start; font-size: 1.08rem; }
.as-legal-kort__check { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--wit); color: var(--kop); }
.as-legal-kort__check .as-icon { width: 16px; height: 16px; }

/* Inhoud met meelopende inhoudsopgave */
.as-legal__grid { display: grid; grid-template-columns: minmax(0, 3.2fr) minmax(0, 8fr); gap: clamp(32px, 5vw, 88px); align-items: start; }
.as-legal__toc { position: sticky; top: calc(var(--header-h) + 24px); }
.as-legal__toc-title { margin: 0 0 .8rem; font: 400 1.05rem/1 var(--f-h1); letter-spacing: .12em; color: var(--taupe-diep); }
.as-legal__toc ol { display: grid; gap: .2rem; }
.as-legal__toc a { display: grid; grid-template-columns: 1.8rem minmax(0, 1fr); gap: .3rem; padding: .45rem .7rem; border-radius: 4px; color: var(--tekst); text-decoration: none; font-size: .98rem; transition: background-color .3s, color .3s; }
.as-legal__toc a span { font: 400 1rem/1.4 var(--f-h1); color: var(--taupe); }
.as-legal__toc a:hover { background: rgba(255, 255, 255, .55); }
.as-legal__toc a.is-active { background: var(--wit); color: var(--kop); font-weight: 500; }
.as-legal__toc a.is-active span { color: var(--roze); }

.as-legal__body { max-width: 760px; font-size: 1.1rem; line-height: 1.7; }
.as-legal__body > * { max-width: none; }
.as-legal__body h2 { position: relative; display: flex; align-items: baseline; gap: .8rem; margin: 2.2em 0 .7em; font: 700 clamp(2.1rem, 2.8vw, 2.7rem)/1.05 var(--f-h2); color: var(--kop); scroll-margin-top: calc(var(--header-h) + 24px); }
.as-legal__body h2:first-of-type { margin-top: 1em; }
.as-legal__num { flex-shrink: 0; font: 400 1.6rem/1 var(--f-h1); color: var(--taupe); }
.as-legal__anchor { margin-left: .2rem; font: 400 1.2rem/1 var(--f-body); color: var(--kiezel); text-decoration: none; opacity: 0; transition: opacity .3s; }
.as-legal__body h2:hover .as-legal__anchor, .as-legal__anchor:focus { opacity: 1; }
.as-legal__body h3 { margin: 1.6em 0 .4em; font: 400 1.35rem/1.15 var(--f-h1); letter-spacing: .06em; color: var(--kop); }
.as-legal__body ul { padding-left: 1.2em; }
.as-legal__body li { margin-bottom: .45em; }
.as-legal__body li::marker { color: var(--taupe); }
.as-legal__body a { color: var(--kop); text-decoration-color: var(--roze); text-underline-offset: 3px; }

/* Bedrijfsgegevens */
.as-legal-card { display: grid; gap: .3rem; margin: 1rem 0 1.4rem; padding: 1.2rem 1.4rem; border-radius: 6px; background: var(--wit); }
.as-legal-card div { display: grid; grid-template-columns: 8rem minmax(0, 1fr); gap: 1rem; }
.as-legal-card dt { font-weight: 500; color: var(--kop); }
.as-legal-card dd { margin: 0; }

/* Bewaartermijnen */
.as-legal-table { margin: 1rem 0 1.4rem; overflow-x: auto; border-radius: 6px; background: var(--wit); }
.as-legal-table table { width: 100%; border-collapse: collapse; font-size: 1rem; }
.as-legal-table th { padding: .9rem 1.2rem; text-align: left; font: 400 1rem/1.2 var(--f-h1); letter-spacing: .1em; color: var(--taupe-diep); background: var(--kiezel); }
.as-legal-table td { padding: .85rem 1.2rem; vertical-align: top; }
.as-legal-table tbody tr:nth-child(even) td { background: #F7F3EE; }
.as-legal-table td:first-child { font-weight: 500; color: var(--kop); width: 52%; }

/* Live opslag */
.as-storage { display: grid; gap: .8rem; margin: 1rem 0 1.6rem; padding: 1.3rem 1.4rem; border-radius: 6px; background: var(--wit); box-shadow: 0 20px 40px -34px rgba(59, 52, 45, .8); }
.as-storage__row { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 1rem; align-items: center; }
.as-storage__icon { display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: var(--linnen); color: var(--kop); }
.as-storage__icon svg, .as-storage__icon .as-icon { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; }
.as-storage__title { margin: 0; font-weight: 500; color: var(--kop); }
.as-storage__value { margin: 0; font: 400 1.4rem/1.2 var(--f-h1); letter-spacing: .06em; color: #4E7D5C; }
.as-storage__value.is-some { color: var(--roze-diep); }
.as-storage__clear[hidden] { display: none; }
.as-storage__note { margin: .2rem 0 0; font-size: .92rem; color: var(--taupe-diep); }

/* Externe diensten */
.as-services { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .8rem; margin: 1rem 0 1.6rem; padding: 0 !important; list-style: none; }
.as-service { margin: 0 !important; padding: 1.2rem 1.3rem; border-radius: 6px; background: var(--wit); font-size: 1rem; }
.as-service::marker { content: none; }
.as-service__name { margin: 0; font: 700 1.7rem/1 var(--f-h2); color: var(--kop); }
.as-service__where { margin: .3rem 0 .6rem; font: 400 1rem/1.3 var(--f-h1); letter-spacing: .06em; color: var(--taupe-diep); }
.as-service p:last-of-type { margin-bottom: .6rem; }
.as-service--none { background: rgba(255, 255, 255, .5); }

/* Regel bij formulieren */
.as-privacy-note { margin: .8rem 0 0; font-size: .9rem; color: var(--taupe-diep); }
.as-privacy-note a { color: inherit; }

@media (max-width: 999px) {
	.as-legal__grid { grid-template-columns: minmax(0, 1fr); }
	.as-legal__toc { position: static; padding: 1rem; border-radius: 6px; background: rgba(255, 255, 255, .55); }
	.as-legal-kort__list, .as-services { grid-template-columns: minmax(0, 1fr); }
	.as-storage__row { grid-template-columns: auto minmax(0, 1fr); }
	.as-storage__clear { grid-column: 1 / -1; justify-self: start; }
}

/* Afdrukken: alleen de verklaring, rustig zwart op wit */
@media print {
	.as-header, .as-footer, .as-favbar, .as-wa-float, .as-legal__tools, .as-legal__toc, .as-legal-kort__mono, .as-storage__clear, .as-legal__anchor { display: none !important; }
	.as-legal { padding: 0; background: #fff; }
	.as-legal__grid { display: block; }
	.as-legal-kort { background: #fff; box-shadow: inset 0 0 0 1px #999; }
	.as-legal__body { max-width: none; font-size: 11pt; }
	.as-legal__body h2 { break-after: avoid; }
	.as-legal-table, .as-legal-card, .as-storage, .as-service { box-shadow: inset 0 0 0 1px #ccc; }
	a { text-decoration: none; color: #000; }
}