/* Циркониевые коронки — блоки, которых нет в общем art.css.
   Палитра и шрифты берутся из переменных art.css. */

/* ——— Шкала оттенков под первым экраном ——— */
.page-zirconia .zr-shade{padding:56px 0 36px}
.page-zirconia .zr-shade__paper{
  display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:clamp(20px,4vw,56px);align-items:center;
  padding:26px clamp(18px,4vw,48px);border-radius:var(--r-l);background:var(--paper);
}
.page-zirconia .zr-shade__text h2{font:700 clamp(19px,2vw,24px)/1.25 var(--body);letter-spacing:-.015em;max-width:none;margin-bottom:8px}
.page-zirconia .zr-shade__text p{font-size:15px;line-height:1.55}
.page-zirconia .zr-shade__paper ul{display:grid;grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;list-style:none;margin:0;padding:0}
.page-zirconia .zr-shade__paper li{min-width:0;text-align:center;color:var(--ink);font-weight:700;font-size:14px}
.page-zirconia .enamel-sample{
  position:relative;display:block;width:min(100%,96px);aspect-ratio:176/204;margin:0 auto 4px;isolation:isolate;
  background:var(--enamel-image) calc(var(--enamel-frame,0) * 12.5%) center/900% 100% no-repeat;
}
.page-zirconia .enamel-sample::after{
  content:"";position:absolute;inset:auto 25% 12% 25%;height:8%;z-index:-1;
  background:radial-gradient(ellipse,#59453243,transparent 72%);
}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
  .page-zirconia .enamel-sample{transition:--enamel-frame .42s ease-in-out}
  .page-zirconia .zr-shade__paper li:hover .enamel-sample{--enamel-frame:8}
}

/* ——— Схема в разрезе ——— */
.page-zirconia .xsec{margin:0 0 32px}
.page-zirconia .xsec svg{width:100%;height:auto;border-radius:20px;background:var(--paper)}
.page-zirconia .xsec figcaption{display:flex;gap:12px;align-items:baseline;margin:14px 0 12px;font-size:14px;color:var(--muted)}
.page-zirconia .xsec figcaption .fig{flex:none}
.page-zirconia .xsec__ceramic{fill:#fcf6e8;stroke:#9c8b70;stroke-width:1.4;stroke-linejoin:round}
.page-zirconia .xsec__tooth{fill:#ead8b2;stroke:#9c8b70;stroke-width:1.2;stroke-linejoin:round}
.page-zirconia .xsec__hatch{fill:url(#zr-hatch)}
.page-zirconia .xsec__frame,.page-zirconia .xsec__frame-edge{fill:none;stroke-linecap:butt;stroke-linejoin:round}
.page-zirconia .xsec__frame-edge{stroke-width:11}
.page-zirconia .xsec__frame{stroke-width:8.4}
.page-zirconia .xsec__frame-edge--zr{stroke:#a9b8c2}
.page-zirconia .xsec__frame--zr{stroke:#fff}
.page-zirconia .xsec__frame-edge--metal{stroke:#4d5761}
.page-zirconia .xsec__frame--metal{stroke:#8d98a3}
.page-zirconia .xsec__collar{fill:none;stroke:#4d5761;stroke-width:4.5;stroke-linecap:round}
.page-zirconia .xsec__gum{fill:#f1bbb4;stroke:#c98f88;stroke-width:1.2;stroke-linejoin:round}
.page-zirconia .xsec__gum-hatch{fill:url(#zr-hatch-gum)}
.page-zirconia .xsec__mark path{fill:none;stroke:var(--ink);stroke-width:1.1;opacity:.75}
.page-zirconia .xsec__mark circle{fill:var(--cream);stroke:var(--ink);stroke-width:1.2}
.page-zirconia .xsec__mark text{font:700 14px var(--body);fill:var(--ink);text-anchor:middle}
.page-zirconia .xsec__legend{
  list-style:none;margin:0;padding:0;counter-reset:xsec;display:grid;gap:8px;font-size:15px;line-height:1.45;color:var(--ink);
}
.page-zirconia .xsec__legend li{counter-increment:xsec;display:grid;grid-template-columns:26px 1fr;gap:10px;align-items:start}
.page-zirconia .xsec__legend li::before{
  content:counter(xsec);display:grid;place-items:center;width:24px;height:24px;border-radius:50%;
  box-shadow:inset 0 0 0 1.2px var(--ink);font:700 12px/1 var(--body);color:var(--ink);
}
.page-zirconia .materials .compare h3{margin-bottom:20px}
.page-zirconia .materials__after{margin-top:32px;max-width:70ch;font-size:17px}
.page-zirconia .materials__after .link-arrow{margin-left:6px}

/* ——— Плюсы и минусы ——— */
.page-zirconia .balance{padding:var(--sec) 0 calc(var(--sec)*.5)}
.page-zirconia .balance__grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,40px)}
.page-zirconia .balance__col{padding:clamp(26px,3.5vw,48px);border-radius:var(--r-l);background:var(--paper)}
.page-zirconia .balance__col--minus{background:transparent;box-shadow:inset 0 0 0 1.5px var(--line)}
.page-zirconia .balance__col h3{font-size:clamp(21px,1.9vw,26px);margin-bottom:22px}
.page-zirconia .balance__col ul{list-style:none;margin:0;padding:0;display:grid;gap:18px}
.page-zirconia .balance__col li{position:relative;padding-left:34px;font-size:16px;line-height:1.55}
.page-zirconia .balance__col li b{color:var(--ink)}
.page-zirconia .balance__col li::before{
  content:"";position:absolute;left:0;top:.28em;width:20px;height:20px;border-radius:50%;
}
.page-zirconia .balance__col--plus li::before{
  background:var(--dot) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.4l3 3 6-6.6' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/20px no-repeat;
}
.page-zirconia .balance__col--minus li::before{
  box-shadow:inset 0 0 0 1.5px var(--pencil);
  background:linear-gradient(var(--pencil),var(--pencil)) center/9px 1.5px no-repeat;
}

/* ——— Ситуации: образец переднего зуба и ссылки ——— */
.page-zirconia .case__more{
  display:inline-block;margin-top:12px;font-size:15px;font-weight:700;color:var(--accent);
  text-decoration:none;border-bottom:1px solid currentColor;padding-bottom:1px;
}
.page-zirconia .case__more:hover{color:var(--btn-hover)}

/* ——— Библиотека ——— */
.page-zirconia .reads{padding:0 0 var(--sec)}
.page-zirconia .reads .sec-head{margin-bottom:clamp(24px,3vw,40px)}
.page-zirconia .reads h2{font-size:clamp(26px,3vw,40px)}
.page-zirconia .reads__list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line);max-width:900px}
.page-zirconia .reads__list li{border-bottom:1px solid var(--line)}
.page-zirconia .reads__list a{
  display:flex;justify-content:space-between;align-items:baseline;gap:24px;padding:20px 0;
  font:600 18px/1.4 var(--body);color:var(--ink);text-decoration:none;
}
.page-zirconia .reads__list a::after{content:"→";flex:none;color:var(--accent);transition:transform .25s var(--ease)}
.page-zirconia .reads__list a:hover{color:var(--accent)}
.page-zirconia .reads__list a:hover::after{transform:translateX(4px)}

/* ——— Первый экран: вторая цена того же веса, что первая ——— */
@media(min-width:721px){
  body.page-zirconia.page-crowns.crowns-atlas .facts .unit{font:700 16px var(--body);color:var(--muted)}
}

@media(max-width:1024px){
  .page-zirconia .zr-shade__paper{grid-template-columns:minmax(0,1fr)}
}
@media(max-width:720px){
  .page-zirconia .zr-shade{padding:36px 0 20px}
  .page-zirconia .zr-shade__paper ul{grid-template-columns:repeat(4,minmax(0,1fr));row-gap:14px}
  .page-zirconia .balance__grid{grid-template-columns:minmax(0,1fr)}
  .page-zirconia .xsec{margin-bottom:24px}
  .page-zirconia .reads__list a{font-size:16px;padding:16px 0}
  .page-zirconia .materials__after .link-arrow{margin:10px 0 0}
}

/* ——— Яндекс Карта в блоке записи ——— */
.page-zirconia .route__map iframe{display:block;width:100%;height:clamp(265px,30vw,390px);border:0}
.page-zirconia .route .link-arrow{align-self:flex-start}