/* ============ Privacy ============ */
.pv-hero { padding: 150px 0 80px; overflow: clip; }
.pv-top { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(0, .9fr); gap: clamp(30px, 5vw, 70px); align-items: center; }
.pv-title { font: 700 clamp(2.8rem, 4.9vw, 5.2rem)/1.3 var(--display); margin-bottom: 22px; }
.pv-title .accent { color: var(--ochre); }
.pv-date { display: inline-block; margin-top: 24px; padding: 6px 14px; border-radius: 99px; background: var(--card); border: 1px solid var(--line); font-size: .88rem; font-weight: 600; color: var(--muted); }

/* hero visual: your data goes in an envelope, and it gets sealed */
.env { position: relative; justify-self: center; width: min(360px, 100%); aspect-ratio: 3 / 2; margin-top: 60px; border-radius: 10px; background: #d8c69c; perspective: 900px; filter: drop-shadow(0 34px 34px rgba(27, 26, 23, .3)); }
.env-paper { position: absolute; z-index: 1; left: 8%; right: 8%; top: -42%; height: 90%; display: grid; align-content: start; gap: 10px; padding: 22px 20px; border-radius: 6px; background: #fffdf7; box-shadow: 0 0 0 1px var(--line); }
.env-paper i { display: block; height: 7px; border-radius: 4px; background: rgba(27, 26, 23, .1); }
.env-paper i:first-child { width: 50%; height: 10px; background: var(--ink); opacity: .8; }
.env-paper i:nth-child(3) { width: 85%; } .env-paper i:nth-child(4) { width: 65%; }
.env-body { position: absolute; z-index: 2; inset: 0; border-radius: 10px; background: var(--sand); clip-path: polygon(0 0, 50% 58%, 100% 0, 100% 100%, 0 100%); }
.env-flap { position: absolute; z-index: 0; inset: 0 0 auto; height: 62%; background: #cdb98c; clip-path: polygon(0 0, 100% 0, 50% 100%); transform-origin: 50% 0; transform: rotateX(180deg); backface-visibility: visible; }
.env-seal { position: absolute; z-index: 4; left: 50%; top: 62%; width: 74px; height: 74px; margin: -37px 0 0 -37px; display: grid; place-items: center; border-radius: 50%; background: var(--ochre); box-shadow: 0 0 0 6px rgba(181, 72, 42, .25), 0 10px 18px -6px rgba(0, 0, 0, .4); }
.env-seal .ic { width: 38px; height: 38px; stroke: #fff; stroke-width: 2.4; }
.env-seal .ic .d, .env-seal .ic .f { fill: #fff; }

/* the short version */
.pv-short { padding: 0 0 var(--sec); }
.short { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.short li { display: grid; gap: 8px; padding: 30px; border-radius: var(--radius); background: var(--ink); color: var(--paper); }
.short b { font: 700 clamp(1.7rem, 2.6vw, 2.2rem)/1.3 var(--display); }
.short span { color: rgba(243, 236, 220, .7); }

.pv-sec { padding: var(--sec) 0; border-top: 1px solid var(--line); overflow: clip; }
.pv-alt { background: var(--paper-2); }
.pv-two { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(30px, 6vw, 90px); align-items: start; }
.pv-text { display: grid; gap: 18px; font-size: 1.1rem; line-height: 2; color: #2b2925; max-width: 62ch; }

/* collect vs don't */
.collect { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .7fr); gap: 18px; margin-top: clamp(40px, 6vw, 60px); }
.col-yes, .col-no { padding: clamp(24px, 3vw, 36px); border-radius: var(--radius); background: var(--card); border: 1px solid var(--line); }
.col-t { font: 700 1.5rem var(--display); margin-bottom: 14px; }
.col-no .col-t { color: var(--ochre); }
.col-yes li { display: grid; grid-template-columns: 26px 1fr; gap: 12px; padding: 14px 0; border-top: 1px solid var(--line); }
.col-yes .tick { width: 22px; height: 22px; margin-top: 3px; stroke: #3d8b4f; stroke-width: 3.6; }
.col-yes b { display: block; }
.col-yes li span { color: var(--muted); }
.col-yes li b { color: var(--ink); }
.col-no li { position: relative; justify-self: start; padding: 14px 0; border-top: 1px solid var(--line); font: 700 1.25rem var(--display); color: var(--muted); }
.col-no ul { display: grid; }
.col-no li i { position: absolute; right: -4px; left: -4px; top: 52%; height: 2.5px; border-radius: 2px; background: var(--ochre); transform-origin: right; }

/* rights */
.rights { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; margin-top: clamp(40px, 6vw, 60px); }
.rights li { padding: 28px 24px; border-radius: var(--radius); background: var(--card); border: 1px solid var(--line); }
.rt-n { display: block; font: 700 2.6rem/1 var(--display); color: var(--ochre); margin-bottom: 16px; }
.rights h3 { font: 700 1.5rem var(--display); margin-bottom: 6px; }
.rights p { color: var(--muted); }
.pv-ask { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; margin-top: 30px; padding: 26px 30px; border-radius: var(--radius); background: var(--ink); color: var(--paper); font-weight: 600; }
.pv-ask .btn { direction: ltr; }
.pv-note { margin-top: 26px; max-width: 70ch; }

@media (max-width: 900px) {
	.pv-hero { padding: 120px 0 60px; }
	.pv-top, .pv-two, .collect, .short { grid-template-columns: minmax(0, 1fr); }
	.env { width: min(300px, 86%); margin-top: 110px; }
	.rights { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.pv-ask .btn { flex: 1 1 100%; }
}

.js .pv-title, .js .pv-hero .lead, .js .pv-date, .js .env { visibility: hidden; }