/* Buildner Books: the legal pages /terms, /privacy and /withdraw (additions/legal_page.py, 30 Sep 2026).
   The shop's own tokens and parts: the book pages' breadcrumb bar, the checkout's heading and width
   (1250 px, the page gutter), the eyebrow, the italic accent, the filter pills, the checkout's fields,
   notice and summary panel. Five type styles only: H1 66/42, H2 30/24, lead 20/18, text 16, and one
   small grey support style 13 (clause numbers, contents, meta line, table labels). */
.legal-view[hidden]{display:none}
.lg{--lg-top:110px;background:var(--paper,#fff);color:var(--ink)}
.lg a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.lg a:hover{text-decoration-thickness:2px}

/* The bar under the header, as on a book page */
.lg-crumbs{display:flex;align-items:center;gap:22px;padding:20px var(--pad);font-size:12px;border-bottom:1px solid var(--line)}
.lg .lg-crumbs a{display:flex;align-items:center;gap:6px;min-height:28px;text-decoration:none}
.lg .lg-crumbs a:hover{text-decoration:underline}
.lg-crumbs>span:nth-child(2){color:var(--muted)}
.lg-crumbs-doc{margin-left:auto;text-transform:uppercase;letter-spacing:.07em}

/* The heading, as on the checkout page */
.lg-head,.lg-body{max-width:1250px;margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
/* the line under the heading runs with the text, inside the page gutter */
.lg-head{padding-top:56px;padding-bottom:48px;background:linear-gradient(var(--line),var(--line)) center bottom/calc(100% - 2 * var(--pad)) 1px no-repeat}
.lg-head h1{font-size:clamp(42px,4.6vw,66px);line-height:1.02;letter-spacing:-.065em;font-weight:400;margin:19px 0 26px;max-width:15ch;text-wrap:balance}
.lg-lead{font-size:20px;line-height:1.55;max-width:760px;margin:0;text-wrap:pretty}
.lg-meta{display:flex;flex-wrap:wrap;gap:6px 26px;margin:22px 0 0;font-size:13px;line-height:1.5;color:var(--muted)}
.lg-docs{display:flex;flex-wrap:wrap;gap:8px;margin-top:30px}
.lg .lg-docs a{display:inline-flex;align-items:center;min-height:40px;padding:0 17px;border:1px solid var(--line);border-radius:30px;font-size:13px;text-decoration:none;transition:background .18s,border-color .18s}
.lg .lg-docs a:hover{background:var(--surface);border-color:#c7c7c0}
.lg .lg-docs a[aria-current="page"]{background:var(--ink);border-color:var(--ink);color:#fff}

/* Contents and text: a sticky list on the left, the text in a reading column */
.lg-body{display:grid;grid-template-columns:240px minmax(0,720px);gap:0 88px;padding-top:56px;padding-bottom:110px}
.lg-toc{position:sticky;top:var(--lg-top);align-self:start;max-height:calc(100vh - var(--lg-top) - 24px);overflow:auto}
.lg-toc-title{font-size:12px;letter-spacing:.095em;text-transform:uppercase;font-weight:700;margin:4px 0 14px}
.lg-toc ol,.lg-toc-phone ol{list-style:none;margin:0;padding:0}
.lg .lg-toc a{display:grid;grid-template-columns:28px minmax(0,1fr);gap:4px;padding:7px 0 7px 12px;border-left:2px solid var(--line);font-size:13px;line-height:1.4;color:var(--muted);text-decoration:none}
.lg .lg-toc a:hover{color:var(--ink)}
.lg .lg-toc a[aria-current="location"]{color:var(--ink);border-left-color:var(--ink)}
.lg-toc a span,.lg-toc-phone a span{font-variant-numeric:tabular-nums}
.lg-toc-phone{display:none}
.lg-text{min-width:0}
.lg-section{scroll-margin-top:24px}
.lg-section+.lg-section{margin-top:56px;padding-top:48px;border-top:1px solid var(--line)}
.lg-section h2{display:flex;align-items:baseline;gap:14px;font-size:30px;line-height:1.15;letter-spacing:-.035em;font-weight:400;margin:0 0 26px;text-wrap:balance}
.lg-sn{flex:none;min-width:42px;font-size:13px;letter-spacing:0;color:var(--muted);font-variant-numeric:tabular-nums}
.lg-clause{display:grid;grid-template-columns:44px minmax(0,1fr);gap:0 12px;scroll-margin-top:24px}
.lg-clause+.lg-clause{margin-top:16px}
.lg-cn{font-size:13px;line-height:26px;color:var(--muted);font-variant-numeric:tabular-nums}
.lg-ct>*,.lg-section>p,.lg-section>ul{margin:0}
.lg-ct>*+*,.lg-section>*+p,.lg-section>*+ul,.lg-section>*+.lg-box{margin-top:12px}
.lg-section>h2+*{margin-top:0}
/* a section's own paragraphs (before its clauses) start where the clause text starts */
.lg-section>p,.lg-section>ul,.lg-section>.lg-box{margin-left:56px}
.lg-text p,.lg-text li{font-size:16px;line-height:1.65;text-wrap:pretty}
.lg-text ul{list-style:none;padding:0}
.lg-text li{position:relative;padding-left:24px}
.lg-text li+li{margin-top:8px}
.lg-text li::before{content:'';position:absolute;left:2px;top:.62em;width:8px;height:8px;background:var(--yellow);border:1px solid var(--ink)}
.lg-address{padding:14px 18px;background:var(--surface);border-left:4px solid var(--yellow)}
/* A clause reached by a link (clause 7.8, #c7-8) shows where it starts */
.lg-clause:target{background:#fbfbef;box-shadow:0 0 0 10px #fbfbef}
.lg-clause:target .lg-cn{color:var(--ink)}

/* The cookie list */
.lg-table{margin-top:14px;overflow-x:auto}
.lg-table table{width:100%;border-collapse:collapse;font-size:16px;line-height:1.5}
.lg-table th,.lg-table td{text-align:left;vertical-align:top;padding:12px 16px 12px 0;border-bottom:1px solid var(--line)}
.lg-table thead th{font-size:13px;font-weight:400;color:var(--muted);border-bottom-color:var(--ink);padding-top:0}
.lg-table tbody th{font-weight:400;overflow-wrap:anywhere;min-width:10em}
.lg-sub{display:block;margin-top:2px;font-size:13px;line-height:1.45;color:var(--muted);overflow-wrap:normal}
.lg-table td:last-child,.lg-table th:last-child{padding-right:0}

/* The model withdrawal form */
.lg-box{padding:26px 28px 28px;border:1px solid var(--ink)}
.lg-box>p,.lg-box>ul{margin:0}
.lg-box>*+p,.lg-box>*+ul{margin-top:12px}
.lg .lg-box li{padding:12px 0;border-bottom:1px solid var(--line)}
.lg .lg-box li+li{margin-top:0}
.lg .lg-box li::before{display:none}

/* /withdraw: the form on the left, how it works on the right, as the checkout page */
.lg-body-form{grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:70px;align-items:start}
.lg-form{display:grid;gap:22px}
.lg-field{font-size:14px}
.lg-field label{display:block}
.lg-optional{margin-left:6px;font-size:13px;color:var(--muted)}
.lg-field textarea{display:block;width:100%;min-height:104px;margin-top:7px;padding:12px;border:1px solid #c7c7c0;border-radius:0;background:#fff;font:inherit;font-size:16px;line-height:1.5;color:var(--ink);resize:vertical}
.lg-field textarea:focus{outline:2px solid var(--ink);outline-offset:-2px}
.lg-field .field-hint{font-size:13px;line-height:1.5;margin-top:8px}
.lg-field input[aria-invalid="true"],.lg-field textarea[aria-invalid="true"]{border-color:#b3261e;box-shadow:0 0 0 1px #b3261e}
.lg-field-error{margin:8px 0 0;font-size:13px;line-height:1.5;color:#8c1d18}
.lg-field-error[hidden],.lg-form-error[hidden]{display:none}
.lg-form .checkout-error{margin:0}
.lg-trap{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.lg-form .button{margin-top:4px}
.lg-form .button[disabled]{opacity:.7;cursor:progress}
.lg-steps{position:sticky;top:120px;padding:30px;background:var(--surface)}
.lg-steps h2{font-size:30px;line-height:1.15;letter-spacing:-.035em;font-weight:400;margin:0 0 20px}
.lg-steps .checkout-next{margin-bottom:22px}
.lg-notes p{margin:0;font-size:13px;line-height:1.55;color:var(--muted)}
.lg-notes p+p{margin-top:10px}
.lg-done{padding:26px 28px;background:var(--surface);border-left:4px solid var(--yellow);outline:0}
.lg-done[hidden]{display:none}
.lg-done h2{font-size:30px;line-height:1.15;letter-spacing:-.035em;font-weight:400;margin:0 0 14px}
.lg-done p{margin:0;font-size:16px;line-height:1.6}
.lg-done p+p{margin-top:12px}
.lg-done .lg-ref{font-size:13px;color:var(--muted)}

@media(max-width:1000px){
  .lg-body{grid-template-columns:200px minmax(0,1fr);gap:0 48px}
  .lg-body-form{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px}
}
@media(max-width:700px){
  .lg{--lg-top:84px}
  .lg-crumbs{padding:9px var(--pad);gap:16px}
  .lg .lg-crumbs a{min-height:36px}
  .lg-crumbs-doc{display:none}
  .lg-head{padding-top:28px;padding-bottom:32px}
  .lg-head h1{margin:14px 0 18px;max-width:none}
  .lg-lead{font-size:18px}
  .lg-meta{gap:4px 18px}
  .lg-docs{margin-top:24px}
  .lg .lg-docs a{min-height:44px;padding:0 15px}
  .lg-body{display:block;padding-top:0;padding-bottom:64px}
  .lg-toc{display:none}
  .lg-toc-phone{display:block;margin:0 0 36px;border-bottom:1px solid var(--line)}
  .lg-toc-phone summary{font-size:16px}
  .lg-toc-phone summary span{margin-left:8px;font-size:13px;color:var(--muted)}
  .lg-toc-phone ol{padding-bottom:12px}
  .lg .lg-toc-phone a{display:grid;grid-template-columns:32px minmax(0,1fr);align-items:center;min-height:44px;padding:4px 0;font-size:16px;line-height:1.35;text-decoration:none}
  .lg-toc-phone a span{font-size:13px;color:var(--muted)}
  .lg-section+.lg-section{margin-top:40px;padding-top:36px}
  .lg-section h2{font-size:24px;gap:10px;margin-bottom:20px}
  .lg-sn{min-width:36px}
  .lg-section>p,.lg-section>ul,.lg-section>.lg-box{margin-left:0}
  .lg-clause{grid-template-columns:38px minmax(0,1fr);gap:0 8px}
  .lg-address{padding:12px 14px}
  .lg-table{overflow:visible}
  .lg-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  .lg-table table,.lg-table tbody,.lg-table tr,.lg-table th,.lg-table td{display:block}
  .lg-table tr{padding:14px 0;border-bottom:1px solid var(--line)}
  .lg-table tr:first-child{border-top:1px solid var(--ink)}
  .lg-table th,.lg-table td{padding:0;border:0}
  .lg-table tbody th{min-width:0}
  .lg-table td{margin-top:6px}
  .lg-table td::before{content:attr(data-label);display:block;font-size:13px;line-height:1.4;color:var(--muted)}
  .lg-box{padding:20px 18px 22px}
  .lg-body-form{display:flex;flex-direction:column;gap:36px;padding-top:32px}
  .lg-form-col,.lg-steps{width:100%}
  .lg-steps{position:static;padding:22px}
  .lg-steps h2,.lg-done h2{font-size:24px}
  .lg-done{padding:22px}
}
@media print{
  .announcement,.header,.footer,.lg-crumbs,.lg-docs,.lg-toc,.lg-toc-phone,.bb-cookies,.skip-link,.toast{display:none!important}
  .lg-head,.lg-body{max-width:none;padding-left:0;padding-right:0}
  .lg-body{display:block;padding-top:24px}
  .lg-head{padding-top:0}
  .lg-head h1{font-size:32px}
  .lg-lead{font-size:14px}
  .lg-text p,.lg-text li,.lg-table table{font-size:11pt;line-height:1.5}
  .lg-section{break-inside:auto}
  .lg-section h2{font-size:18px;break-after:avoid}
  .lg-clause{break-inside:avoid}
  .lg-address{background:none;border-left:2px solid #000}
  .lg a{color:inherit}
}
