/* Legal pages (/terms/, /privacy/, /refunds/, /data-processing/) in the website design: the
   reading column of the guides (site.css .article-body), the numbered clauses, tables and notes
   of the former website.css. The markup inside <main class="legal-page"> is unchanged. */
.legal-page{max-width:836px;margin:0 auto;padding:66px 38px 112px}
.legal-page .eyebrow{font-size:11px;line-height:1.65;color:#657b52;margin:0 0 23px}
.legal-page h1{font-size:clamp(42px,4.8vw,65px);margin:0 0 22px}
.legal-page h2{font-size:27px;line-height:1.2;letter-spacing:-.03em;margin:62px 0 0}
.legal-page h3{font-size:20px;line-height:1.3;letter-spacing:-.02em;margin:32px 0 0}
.legal-page p{font-size:16px;line-height:1.85;color:#66765a;margin:16px 0 0}
.legal-page .legal-meta{font-size:13px;color:#64745b;margin-top:0}
.legal-page h2+.legal-meta{margin-top:10px}
.legal-page .legal-lead{font-size:19px;line-height:1.65;color:#1c2922;margin-top:30px}
.legal-page strong{font-weight:550;color:#1c2922}
.legal-page a{color:#344d24}
.legal-page p a,.legal-page li a,.legal-page td a,.legal-page dd a{text-decoration:underline;text-decoration-color:#a8b998;text-underline-offset:4px}
.legal-page p a:hover,.legal-page li a:hover,.legal-page td a:hover,.legal-page dd a:hover{text-decoration-color:currentColor}
.legal-page ul,.legal-page ol{margin:14px 0 0;padding-left:22px;font-size:16px;line-height:1.85;color:#66765a}
.legal-page li{margin-top:6px}
.legal-page li::marker{color:#8fa47a}

/* numbered clauses: 1.1, 1.2 ... hang in the margin of the text */
.legal-page .cl{position:relative;padding-left:48px}
.legal-page .cl>.n{position:absolute;left:0;top:0;color:#1c2922;font-weight:550;font-variant-numeric:tabular-nums}
.legal-page ol.alpha{list-style:none;counter-reset:alpha;padding-left:82px}
.legal-page ol.alpha>li{counter-increment:alpha;position:relative}
.legal-page ol.alpha>li::before{content:"(" counter(alpha,lower-alpha) ")";position:absolute;left:-34px;color:#1c2922}
.legal-page dl{margin:14px 0 0 48px;font-size:16px;line-height:1.85;color:#66765a}
.legal-page dt{display:inline;color:#1c2922;font-weight:550}
.legal-page dd{display:inline;margin:0}
.legal-page dd::after{content:"";display:block;margin-bottom:8px}

/* contents */
.legal-toc{margin-top:38px;padding:24px 28px;background:#fff;border:1px solid #e0e5d8;border-radius:18px}
.legal-page .legal-toc ol{margin:0;padding-left:24px;font-size:14px;line-height:1.6}
.legal-page .legal-toc li{margin:0;padding:4px 0;break-inside:avoid}
.legal-page .legal-toc a{text-decoration:none;color:#3b4f31}
.legal-page .legal-toc a:hover{color:#1c2922;text-decoration:underline;text-underline-offset:4px}
@media(min-width:801px){.legal-page .legal-toc ol{columns:2;column-gap:44px}}

/* tables (Privacy Notice: data and legal bases; Data Processing Terms: sub-processors) */
.legal-table-wrap{margin-top:22px;overflow-x:auto;border:1px solid #e0e5d8;border-radius:14px;background:#fff}
.legal-page table.legal-table{width:100%;min-width:0;border-collapse:collapse;font-size:14px;line-height:1.65;text-align:left}
.legal-table thead{background:#edf2e5}
.legal-table th{font-weight:550;color:#1c2922;font-size:13px}
.legal-table th,.legal-table td{padding:16px 20px;border-bottom:1px solid #e2e8da;vertical-align:top}
.legal-table td{color:#66765a}
.legal-table tr:last-child td{border-bottom:0}

/* the contact box, placeholders still to fill in, the way back */
.legal-contact{margin-top:44px;padding:26px 28px;border-radius:18px;background:#eef2e7}
.legal-contact strong{font-size:17px}
.legal-page .legal-contact p{margin-top:6px}
.fill{background:#eef9d9;color:#1c2922;padding:1px 6px;border-radius:5px;outline:1px dashed #9cc55a}
.legal-page a.button{display:inline-flex;align-items:center;justify-content:center;margin-top:36px;padding:15px 25px;border-radius:100px;border:1px solid #ccd5c1;background:transparent;color:#1c2922;font-size:14px;font-weight:550;line-height:1.5;text-decoration:none;transition:background .2s,transform .2s}
.legal-page a.button:hover{background:#eef2e7;transform:translateY(-2px)}

@media(max-width:1050px){.legal-page{padding-left:28px;padding-right:28px}}
@media(max-width:800px){.legal-page{padding-top:45px;padding-bottom:80px}.legal-page h2{font-size:25px;margin-top:52px}}
@media(max-width:540px){
 .legal-page{padding:36px 22px 64px}
 .legal-page h1{font-size:42px}
 .legal-page h2{font-size:23px;margin-top:44px}
 .legal-page p,.legal-page ul,.legal-page ol,.legal-page dl{font-size:15px}
 .legal-page .legal-lead{font-size:17px}
 .legal-page .cl{padding-left:40px}
 .legal-page dl{margin-left:0}
 .legal-page ol.alpha{padding-left:62px}
 .legal-toc{padding:20px 20px}
 .legal-contact{padding:22px 20px}
}
/* phones: each table row becomes a card, the column names come from data-label */
@media(max-width:600px){
 .legal-table-wrap{border:0;background:transparent;border-radius:0;overflow:visible}
 .legal-table thead{display:none}
 .legal-table,.legal-table tbody,.legal-table tr,.legal-table td{display:block}
 .legal-table tr{background:#fff;border:1px solid #e0e5d8;border-radius:14px;padding:16px 18px;margin-bottom:12px}
 .legal-table td{padding:3px 0;border:0}
 .legal-table td:first-child{color:#1c2922}
 .legal-table td+td::before{content:attr(data-label);display:block;margin-top:10px;font-size:10px;font-weight:650;letter-spacing:.12em;text-transform:uppercase;color:#657b52}
}
@media print{.header,.footer,.scroll-progress,.skip,.legal-page a.button{display:none}.legal-page{padding:0;max-width:none}}
