/*
 * ABC Czekolady — style szablonu (projekt: Claude Design, kierunek C „Karta technologiczna”; wdrożenie Invisio 2026-10).
 * Ładowane tylko na wpisie z meta _abc_layout = acf (abc/bootstrap.php). Wszystko pod klasą .abc.
 * Poprawki względem pliku Designu: reset marginesów i typografii motywu (specyficzność 0,0,2), siatki minmax(0,1fr),
 * listy a) b) w definicjach przez zagnieżdżenie (ol ol).
 */
/* ── Tokeny ABC ─────────────────────────────────────────────
   Legenda: --abc-gold / --abc-brown = baza marki; --abc-gold-ink = złoto przyciemnione do AA dla małego tekstu i przycisku;
   --abc-heading = brąz nagłówków z PDF-u; --abc-dark/milk/whitechoc = kolory 3 rodzajów czekolady (składy, krzywe);
   --abc-line / --abc-row = linie i tła tabel z PDF-u; --abc-sticky = odstęp kotwic od góry (przyklejony nagłówek witryny).
   ──────────────────────────────────────────────────────────── */
:root{
 --abc-gold:#A18F5F;--abc-gold-ink:#7D6C3A;--abc-gold-light:#CCB48D;
 --abc-brown:#442D25;--abc-heading:#693A23;--abc-text:#2C1A0E;--abc-muted:#695751;
 --abc-dark:#3A2419;--abc-milk:#8A5A3C;--abc-whitechoc:#DCC9A0;
 --abc-line:#E2D9D4;--abc-row:#F1EBE8;--abc-bg:#FCFCFC;--abc-bg-alt:#F4F3F3;--abc-white:#FFFFFF;
 --abc-font:'Lato',system-ui,sans-serif;
 --abc-fs-small:15px;--abc-fs-body:18px;--abc-fs-lead:20px;--abc-fs-h4:21px;--abc-fs-h3:26px;--abc-fs-h2:38px;--abc-fs-h1:68px;
 --abc-s1:8px;--abc-s2:16px;--abc-s3:24px;--abc-s4:40px;--abc-s5:64px;--abc-s6:104px;
 --abc-radius:10px;--abc-radius-pill:9999px;--abc-container:1128px;--abc-gutter:26px;--abc-sticky:90px;
}
@media (max-width:1064px){:root{--abc-fs-h1:52px;--abc-fs-h2:32px;--abc-fs-h3:24px;--abc-s6:80px}}
@media (max-width:767px){:root{--abc-fs-body:17px;--abc-fs-lead:18px;--abc-fs-h1:42px;--abc-fs-h2:28px;--abc-fs-h3:22px;--abc-fs-h4:19px;--abc-s5:44px;--abc-s6:64px}}
.abc{font-family:var(--abc-font);font-weight:300;font-size:var(--abc-fs-body);line-height:1.62;color:var(--abc-text);background:var(--abc-white);-webkit-font-smoothing:antialiased}
.abc *,.abc *::before,.abc *::after{box-sizing:border-box}
html :where(.abc) :is(h1,h2,h3,h4,h5,h6,p,li,a,span,strong,em,td,th,figcaption,summary,dt,dd,blockquote,caption){font-family:inherit;font-size:inherit;line-height:inherit;letter-spacing:inherit;color:inherit;text-transform:none;text-align:inherit;font-weight:inherit;font-style:inherit}
html :where(.abc) :is(h1,h2,h3,h4,h5,h6,p,ul,ol,figure,table,dl,blockquote){margin:0}
html :where(.abc) :is(ul,ol){padding:0}
html :where(.abc) :is(table,thead,tbody,tr,th,td){border:0;background:transparent}
/* Motyw: section:not(.hero-section){padding:0 156px|6%|36px|26px; max-width} — rozdziały ABC mają własną siatkę */
html .abc section.abc-section{max-width:none;margin:0;padding:var(--abc-s6) 0}
/* Motyw: overflow-x:hidden na body i #page tworzy kontener przewijania i wyłącza position:sticky — clip przycina bez tego efektu */
html body.abc-page,body.abc-page #page{overflow-x:clip;overflow-y:visible}
/* Motyw (Storefront): word-wrap:break-word łamał tytuły rozdziałów w środku słowa */
.abc h1,.abc h2,.abc h3,.abc h4{overflow-wrap:normal;word-wrap:normal}
/* Pasek administracyjny WP (zalogowani, >782 px) spycha przyklejone menu motywu o 32 px — przyklejone tytuły rozdziałów niżej.
   abc.js dodatkowo dopasowuje odstęp do rzeczywistej dolnej krawędzi menu. */
@media (min-width:783px){body.admin-bar .abc{--abc-sticky:122px}}
.abc img{display:block;max-width:100%;height:auto}
.abc strong{font-weight:700}
.abc a{color:var(--abc-gold-ink)}.abc a:hover{color:var(--abc-brown)}
.abc :focus-visible{outline:2px solid var(--abc-heading);outline-offset:3px;border-radius:2px}
.abc [id]{scroll-margin-top:var(--abc-sticky)}
.abc p{text-wrap:pretty}
.abc-sr{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.abc-wrap{max-width:calc(var(--abc-container) + 2*var(--abc-gutter));margin:0 auto;padding:0 var(--abc-gutter)}
.abc .abc-btn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:12px 28px;border-radius:var(--abc-radius-pill);background:var(--abc-gold-ink);color:#fff;text-decoration:none;font-weight:700;font-size:16px;letter-spacing:.04em;transition:background .2s}
.abc .abc-btn:hover{background:var(--abc-brown);color:#fff}
.abc-btn svg{width:18px;height:18px;flex:none}
.abc-meta{font-size:14px;color:var(--abc-muted);letter-spacing:.04em}
.abc-kicker{font-size:13px;line-height:1.4;letter-spacing:.22em;text-transform:uppercase;font-weight:700;color:var(--abc-gold-ink)}
.abc-chart__svg{width:100%;height:auto;display:block;overflow:visible}
.abc-chart__grid path{stroke:var(--abc-heading);stroke-width:1;stroke-dasharray:5 5;fill:none;opacity:.7}
.abc-chart__axis path{stroke:var(--abc-heading);stroke-width:1.6;fill:none}
.abc-chart__curve{stroke:var(--abc-heading);stroke-width:2.4;fill:none;stroke-linecap:round}
.abc-chart__text text{font-family:var(--abc-font);font-size:15px;font-weight:300;fill:var(--abc-text)}
@media (max-width:767px){.abc-chart{overflow-x:auto}.abc-chart__svg{min-width:520px}}
.abc-table{width:100%;border-collapse:collapse;font-size:16px;border:1px solid var(--abc-line)}
.abc-table th,.abc-table td{padding:14px 18px;text-align:left;font-weight:300;border-bottom:1px solid var(--abc-line)}
.abc-table td{text-align:right;white-space:nowrap;font-weight:400;color:var(--abc-brown)}
.abc-table tr:nth-child(odd){background:var(--abc-row)}
@media (prefers-reduced-motion:reduce){.abc *{transition:none!important;animation:none!important;scroll-behavior:auto!important}}
/* ── Kierunek ── */

.abc-hero{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:72px;align-items:end;padding:56px 0 var(--abc-s5)}
.abc-hero .abc-kicker{margin-bottom:18px}
.abc-hero__title{font-weight:300;text-transform:uppercase;font-size:calc(var(--abc-fs-h1) + 8px);line-height:1;letter-spacing:.01em;color:var(--abc-gold);margin-bottom:28px}
.abc-hero__lead{font-size:var(--abc-fs-lead);max-width:32em;margin-bottom:32px}
.abc-hero__actions{display:flex;flex-wrap:wrap;align-items:center;gap:14px 24px}
.abc-hero__media img{width:100%;aspect-ratio:4/5;object-fit:cover}
.abc-toc{border-block:2px solid var(--abc-brown);padding:8px 0 28px;margin-bottom:0}
.abc-toc summary{list-style:none;pointer-events:none;display:flex;align-items:center;min-height:52px;font-size:13px;letter-spacing:.22em;text-transform:uppercase;font-weight:700;color:var(--abc-brown)}
.abc-toc summary::-webkit-details-marker{display:none}
.abc-toc ol{list-style:none;padding:0;display:grid;grid-template-columns:1fr 1fr;grid-auto-flow:column;grid-template-rows:repeat(6,auto);column-gap:48px;counter-reset:toc}
.abc-toc li{counter-increment:toc;border-top:1px solid var(--abc-line)}
.abc .abc-toc a{display:grid;grid-template-columns:48px 1fr;align-items:baseline;min-height:48px;padding:12px 0;font-size:17px;line-height:1.35;font-weight:400;color:var(--abc-brown);text-decoration:none}
.abc-toc a::before{content:counter(toc,decimal-leading-zero);font-size:14px;font-weight:700;color:var(--abc-gold-ink)}
.abc .abc-toc a:hover{color:var(--abc-heading);text-decoration:underline;text-underline-offset:4px}
.abc .abc-toc a[aria-current]{color:var(--abc-heading)}
.abc-section{display:grid;grid-template-columns:270px minmax(0,1fr);gap:72px;padding:var(--abc-s6) 0;border-bottom:1px solid var(--abc-line)}
.abc-section__head{position:sticky;top:var(--abc-sticky);align-self:start}
.abc-section__head .abc-kicker{margin-bottom:14px}
.abc-section h2{font-weight:300;text-transform:uppercase;font-size:calc(var(--abc-fs-h2) - 4px);line-height:1.15;color:var(--abc-gold);letter-spacing:.01em;text-wrap:balance;hyphens:manual}
.abc-section--przechowywanie h2,.abc-section--formowanie h2{font-size:23px;line-height:1.3}
.abc-section__body>h3{font-weight:700;text-transform:uppercase;letter-spacing:.16em;font-size:14px;color:var(--abc-brown);padding-top:16px;border-top:1px solid var(--abc-brown);margin:var(--abc-s5) 0 24px}
.abc-section p+p{margin-top:16px}
.abc-intro{font-size:var(--abc-fs-lead)}
.abc-defs{display:grid;grid-template-columns:1fr 1fr;margin-top:40px;border:1px solid var(--abc-line)}
.abc-defs>div{padding:28px 30px}
.abc-defs>div+div{border-left:1px solid var(--abc-line);background:var(--abc-bg-alt)}
.abc-defs h3{font-size:var(--abc-fs-h4);font-weight:700;color:var(--abc-brown);margin-bottom:8px}
.abc-types{list-style:none;padding:0;display:flex;flex-wrap:wrap}
.abc-types li{display:flex;align-items:center;gap:10px;min-height:44px;padding:0 24px;font-size:15px;letter-spacing:.12em;text-transform:uppercase;font-weight:400;color:var(--abc-brown)}
.abc-types li:first-child{padding-left:0}
.abc-types li+li{border-left:1px solid var(--abc-line)}
.abc-types li::before{content:"";width:12px;height:12px;background:var(--abc-dark)}
.abc-types .is-milk::before{background:var(--abc-milk)}.abc-types .is-white::before{background:var(--abc-whitechoc)}
.abc-scroll{overflow-x:auto}
.abc-matrix{width:100%;min-width:680px;border-collapse:collapse;font-size:15px}
.abc-matrix th,.abc-matrix td{padding:12px 8px;border-bottom:1px solid var(--abc-line);text-align:center;vertical-align:middle}
.abc-matrix thead th{font-size:11px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--abc-brown);vertical-align:top;line-height:1.35;width:13%}
.abc-matrix thead img{width:72px;height:72px;border-radius:50%;object-fit:cover;margin:0 auto 12px}
.abc-matrix tbody th{text-align:left;font-weight:400;color:var(--abc-brown);white-space:nowrap;position:sticky;left:0;background:#fff;padding-right:16px}
.abc-matrix tbody th::before{content:"";display:inline-block;width:12px;height:12px;margin-right:10px;background:var(--abc-dark);vertical-align:-1px}
.abc-matrix tbody tr:nth-child(2) th::before{background:var(--abc-milk)}.abc-matrix tbody tr:nth-child(3) th::before{background:var(--abc-whitechoc)}
.abc-matrix td{font-size:18px;font-weight:700;color:var(--abc-heading)}
.abc-matrix td.abc-no{color:#BCB3B0;font-weight:300}
.abc-steps{list-style:none;padding:0;counter-reset:step;border-bottom:1px solid var(--abc-line)}
.abc-steps>li{counter-increment:step;display:grid;grid-template-columns:64px 200px minmax(0,1fr);grid-template-areas:"n m b";gap:28px;padding:28px 0;border-top:1px solid var(--abc-line);align-items:start}
.abc-steps>li::before{content:counter(step,decimal-leading-zero);grid-area:n;font-size:44px;font-weight:300;line-height:1;color:var(--abc-gold)}
.abc-steps figure{grid-area:m}
.abc-steps img{width:100%;aspect-ratio:4/3;object-fit:cover}
.abc-steps>li>div{grid-area:b}
.abc-steps h3{font-size:var(--abc-fs-h4);font-weight:700;color:var(--abc-brown);margin-bottom:8px}
.abc-steps p{font-size:17px}
.abc-params{list-style:none;padding:0 20px;display:flex;flex-wrap:wrap;gap:8px 48px;background:var(--abc-bg-alt)}
.abc-params li{display:flex;align-items:center;gap:12px;min-height:72px;font-size:19px;font-weight:400;color:var(--abc-heading)}
.abc-params svg{width:40px;height:40px}
.abc-temps{list-style:none;padding:0;counter-reset:t;border-top:2px solid var(--abc-brown)}
.abc-temps>li{counter-increment:t;display:grid;grid-template-columns:36px minmax(0,1.1fr) minmax(0,1fr) minmax(0,1.2fr);gap:20px;align-items:center;padding:20px 0;border-bottom:1px solid var(--abc-line)}
.abc-temps>li::before{content:counter(t);width:32px;height:32px;display:grid;place-items:center;border:1px solid var(--abc-heading);border-radius:50%;font-size:15px;color:var(--abc-heading)}
.abc-temps h4{font-size:var(--abc-fs-h4);font-weight:700;color:var(--abc-brown)}
.abc-temps__fig{display:flex;gap:18px;font-size:32px;font-weight:300;line-height:1;color:var(--abc-heading)}
.abc-temps__fig span{display:inline-flex;align-items:center;gap:4px}
.abc-temps__fig svg{width:20px;height:20px;color:var(--abc-gold-ink)}
.abc-temps>li>p:last-child{font-size:16px;color:var(--abc-muted)}
.abc-chart{margin-top:40px;padding:32px;border:1px solid var(--abc-line)}
.abc-data{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:start;margin-top:40px}
.abc-back{position:fixed;right:24px;bottom:24px;z-index:20;display:flex;flex-direction:column;justify-content:center;min-height:52px;max-width:300px;padding:10px 22px;border-radius:14px;background:#fff;border:1px solid var(--abc-line);box-shadow:0 6px 20px rgba(44,26,14,.10);font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--abc-brown);text-decoration:none;transition:opacity .2s,transform .2s}
.abc .abc-back{color:var(--abc-brown)}
.abc-back.is-hidden{opacity:0;transform:translateY(12px);pointer-events:none}
.abc-back__current{font-size:14px;font-weight:400;font-style:italic;letter-spacing:0;text-transform:none;color:var(--abc-heading)}
.abc-back__current:empty{display:none}
@media (max-width:1064px){
 .abc-hero{grid-template-columns:minmax(0,1fr) 300px;gap:40px}
 .abc-section{grid-template-columns:minmax(0,1fr);gap:28px}
 .abc-section__head{position:static}
 .abc-data{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:767px){
 .abc-hero{grid-template-columns:minmax(0,1fr);padding-top:28px}
 .abc-hero__media{order:-1}
 .abc-hero__media img{aspect-ratio:3/2}
 .abc-toc summary{pointer-events:auto;cursor:pointer;justify-content:space-between}
 .abc-toc summary::after{content:"";width:10px;height:10px;border-right:1.5px solid var(--abc-brown);border-bottom:1.5px solid var(--abc-brown);transform:rotate(45deg) translateY(-3px)}
 .abc-toc[open] summary::after{transform:rotate(-135deg)}
 .abc-toc{padding-bottom:8px}
 .abc-toc ol{grid-template-columns:minmax(0,1fr);grid-auto-flow:row;grid-template-rows:none}
 .abc-defs{grid-template-columns:minmax(0,1fr)}
 .abc-defs>div+div{border-left:0;border-top:1px solid var(--abc-line)}
 .abc-types{flex-direction:column}.abc-types li{padding:0}.abc-types li+li{border-left:0}
 .abc-steps>li{grid-template-columns:44px minmax(0,1fr);grid-template-areas:"n m" "n b";gap:14px 16px}
 .abc-steps>li::before{font-size:30px}
 .abc-temps>li{grid-template-columns:32px minmax(0,1fr);gap:8px 14px}
 .abc-temps>li>*:not(h4){grid-column:2}
 .abc-chart{padding:16px}
 .abc-back{left:16px;right:16px;bottom:16px;max-width:none}
}

/* ── Rozdziały 02, 03, 05, 07–11 i zakończenie ── */
.abc-section__body>h3.abc-first{margin-top:0}
.abc-fig{font-size:34px;font-weight:300;line-height:1;color:var(--abc-heading);margin-bottom:12px}
.abc-after{margin-top:40px}
.abc-sub{font-size:16px;color:var(--abc-muted);margin:-12px 0 20px}
.abc-varieties{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border-top:1px solid var(--abc-line)}
.abc-varieties>div{padding:24px 24px 8px 0}
.abc-varieties>div+div{padding-left:24px;border-left:1px solid var(--abc-line)}
.abc-varieties img{width:132px;height:132px;object-fit:contain;margin-bottom:16px}
.abc-varieties h4,.abc-rule h3,.abc-method h3,.abc-cocoa h3,.abc-melt h4,.abc-curve h4{font-size:var(--abc-fs-h4);font-weight:700;line-height:1.3;color:var(--abc-brown);margin-bottom:8px}
.abc-varieties p:last-child,.abc-rule p,.abc-method ul,.abc-cocoa p,.abc-melt p{font-size:16px}
.abc-wide{margin-top:40px}
.abc-wide img{width:100%;aspect-ratio:16/9;object-fit:cover}
.abc-rules{display:grid;grid-template-columns:1fr 1fr;border-top:2px solid var(--abc-brown)}
.abc-rule{display:grid;grid-template-columns:48px minmax(0,1fr);gap:20px;padding:28px 28px 28px 0;border-bottom:1px solid var(--abc-line)}
.abc-rule:nth-child(even){padding:28px 0 28px 28px;border-left:1px solid var(--abc-line)}
.abc-rule svg{width:48px;height:48px;color:var(--abc-heading)}
.abc-rule .abc-fig{font-size:28px;margin-bottom:10px}
.abc-product-shot{margin:40px auto 0;max-width:620px}
.abc-product-shot img{width:100%;mix-blend-mode:multiply}
.abc-methods{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 40px}
.abc-method img{width:100%;aspect-ratio:3/2;object-fit:cover}
.abc-method h3{margin:20px 0 12px}
.abc-method ul{padding-left:20px}
.abc-method li+li{margin-top:6px}
.abc-method li::marker{color:var(--abc-gold-ink)}
.abc-split{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:40px;align-items:start}
.abc-split img{width:100%;aspect-ratio:4/5;object-fit:cover}
.abc-split--small{grid-template-columns:minmax(0,1fr) 220px}
/* WP 6.7: obrazki lazy mają sizes="auto" (contain:size) — proporcja zapasowa zamiast samego auto */
.abc-split--small img{aspect-ratio:auto 1/1}
.abc-rings{list-style:none;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:56px;padding-top:40px;border-top:1px solid var(--abc-line)}
.abc-rings li{text-align:center}
.abc-rings li>p:last-child{font-size:16px;font-weight:400;color:var(--abc-brown)}
.abc-ring{position:relative;width:156px;aspect-ratio:1;margin:0 auto 16px;display:grid;place-items:center}
.abc-ring svg{position:absolute;inset:0;width:100%;height:100%;transform:rotate(-90deg);fill:none;stroke-width:5}
.abc-ring circle{stroke:#E2D9D4}
.abc-ring .abc-ring__arc{stroke:var(--abc-heading);stroke-linecap:round}
.abc-ring strong{font-size:26px;font-weight:300;color:var(--abc-heading)}
.abc-cocoa{display:grid;grid-template-columns:1fr 1fr;margin-top:40px;border:1px solid var(--abc-line)}
.abc-cocoa>div{padding:32px 30px;text-align:center}
.abc-cocoa>div+div{border-left:1px solid var(--abc-line)}
.abc-cocoa img{width:180px;height:180px;border-radius:50%;object-fit:cover;margin:0 auto 20px}
.abc-melt{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 28px}
.abc-melt>div{padding-top:20px;border-top:1px solid var(--abc-line)}
.abc-curves{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px}
.abc-curve{border-top:4px solid var(--abc-dark);padding-top:18px;display:flex;flex-direction:column}
.abc-curve.is-milk{border-top-color:var(--abc-milk)}.abc-curve.is-white{border-top-color:var(--abc-whitechoc)}
.abc-curve ol{list-style:none;padding:0;counter-reset:m;margin:6px 0 16px}
.abc-curve li{counter-increment:m;position:relative;padding:12px 0 12px 38px;border-bottom:1px solid var(--abc-line);font-size:16px;line-height:1.5}
.abc-curve li::before{content:counter(m);width:24px;height:24px;display:grid;place-items:center;border:1px solid var(--abc-heading);border-radius:50%;font-size:12px;color:var(--abc-heading);position:absolute;left:0;top:14px}
.abc-curve strong{font-size:19px;font-weight:700;color:var(--abc-heading);white-space:nowrap}
.abc-note{margin-top:auto;padding:14px 16px;background:var(--abc-bg-alt);font-size:15px;color:var(--abc-brown)}
.abc-accs{margin-top:48px;border-bottom:1px solid var(--abc-line)}
.abc-acc{border-top:1px solid var(--abc-line)}
.abc-acc summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:60px;padding:12px 0}
.abc-acc summary::-webkit-details-marker{display:none}
.abc-acc summary::after{content:"";flex:none;width:10px;height:10px;border-right:1.5px solid var(--abc-brown);border-bottom:1.5px solid var(--abc-brown);transform:rotate(45deg) translateY(-3px);transition:transform .2s}
.abc-acc[open] summary::after{transform:rotate(-135deg)}
.abc-acc summary:hover h3{color:var(--abc-heading)}
.abc-acc h3{font-size:var(--abc-fs-h4);font-weight:700;line-height:1.3;color:var(--abc-brown)}
.abc-acc__body{padding:0 0 28px;max-width:46em;font-size:17px}
.abc-acc__body ol{list-style:none;padding:0;counter-reset:d;margin-top:12px}
.abc-acc__body ol>li{counter-increment:d;position:relative;padding-left:34px;margin-top:8px}
.abc-acc__body ol>li::before{content:counter(d) ")";position:absolute;left:0;font-weight:700;color:var(--abc-gold-ink)}
.abc-acc__body ol ol{margin-top:6px}
.abc-acc__body ol ol>li{margin-top:4px}
.abc-acc__body ol ol>li::before{content:counter(d,lower-alpha) ")";font-weight:400}
.abc-acc__body ul{padding-left:20px;margin-top:12px}
.abc .abc-cat{display:inline-flex;align-items:center;min-height:44px;margin-top:12px;font-weight:700;font-size:15px;letter-spacing:.02em;text-underline-offset:4px}
.abc-end{background:var(--abc-bg-alt);border-top:2px solid var(--abc-brown)}
.abc-end__in{display:flex;flex-direction:column;align-items:center;gap:24px;padding-top:var(--abc-s5);padding-bottom:var(--abc-s5);text-align:center}
.abc-end__actions{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:14px 24px}
.abc .abc-end__back{display:inline-flex;align-items:center;min-height:44px;font-size:14px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--abc-brown)}
@media (max-width:1064px){
 .abc-melt,.abc-curves{grid-template-columns:minmax(0,1fr)}
 .abc-melt>div+div{margin-top:20px}
 .abc-split{grid-template-columns:minmax(0,1fr) 240px}
}
@media (max-width:767px){
 .abc-varieties{grid-template-columns:minmax(0,1fr)}
 .abc-varieties>div,.abc-varieties>div+div{padding:24px 0;border-left:0}
 .abc-varieties>div+div{border-top:1px solid var(--abc-line)}
 .abc-varieties img{width:112px;height:112px}
 .abc-rules{grid-template-columns:minmax(0,1fr)}
 .abc-rule,.abc-rule:nth-child(even){padding:24px 0;border-left:0;grid-template-columns:40px minmax(0,1fr);gap:16px}
 .abc-rule svg{width:40px;height:40px}
 .abc-methods{grid-template-columns:minmax(0,1fr)}
 .abc-split,.abc-split--small{grid-template-columns:minmax(0,1fr)}
 .abc-split figure{max-width:320px}
 .abc-split--small figure{max-width:220px}
 .abc-rings{grid-template-columns:minmax(0,1fr);gap:32px}
 .abc-cocoa{grid-template-columns:minmax(0,1fr)}
 .abc-cocoa>div+div{border-left:0;border-top:1px solid var(--abc-line)}
 .abc-cocoa img{width:150px;height:150px}
}