/* ==========================================================================
   Document pages (template-parts/page-doc.php)
   ========================================================================== */

.doc-meta{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.doc-meta li{display:inline-flex;align-items:center;gap:8px;padding:8px 14px;border-radius:14px;background:rgba(255,255,255,.06);border:1px solid var(--hair);font-size:13.5px;color:var(--on-ink-2)}
.doc-meta .rt-icon{color:var(--gold)}
.doc-meta b{color:#fff;font-weight:800}

.doc-hero__art{display:flex;justify-content:center}
.doc-hero__img{margin:0}
.doc-hero__img img{display:block;max-height:340px;width:auto;margin-inline:auto}

/* Hero art: lines write themselves on a sheet; a seal turns. */
.doc-art{width:100%;max-width:400px;height:auto;overflow:visible}
.doc-art__sheet{fill:#fff}
.doc-art__sheet--b{fill:rgba(255,255,255,.07);stroke:var(--hair)}
.doc-art__title{fill:#0A1430}
.doc-art__line{fill:#DCE2EC;transform-box:fill-box;transform-origin:right center}
.doc-art__seal circle{fill:#F3BC00}
.doc-art__seal .doc-art__seal-in{fill:none;stroke:#0A1430;stroke-width:2.5;stroke-dasharray:4 5;transform-box:fill-box;transform-origin:center}
.doc-art__seal path{fill:none;stroke:#0A1430;stroke-width:6;stroke-linecap:round;stroke-linejoin:round}
.doc-art__toc rect{fill:#2A4A9A}
.doc-art__toc path{fill:none;stroke:#fff;stroke-width:5;stroke-linecap:round;opacity:.85}
.doc-art__toc circle{fill:#F3BC00}
.has-motion .doc-art__line{animation:doc-write .6s var(--d,0ms) cubic-bezier(.65,0,.35,1) both}
.has-motion .doc-art__seal-in{animation:doc-spin 16s linear infinite}
.has-motion .doc-art__toc{animation:doc-float 4.5s ease-in-out infinite}
@keyframes doc-write{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes doc-spin{to{transform:rotate(360deg)}}
@keyframes doc-float{50%{transform:translateY(-8px)}}

/* Reading layout: contents and help on the side, text in the middle. */
.doc-layout{display:grid;grid-template-columns:300px minmax(0,820px);justify-content:center;gap:40px;align-items:start;padding-block:48px 80px}
.doc-side{position:sticky;top:100px;display:flex;flex-direction:column;gap:16px;max-height:calc(100vh - 120px)}
.doc-toc{margin:0;display:flex;flex-direction:column;min-height:0}
.doc-toc .post-toc__list{overflow-y:auto;overscroll-behavior:contain;scrollbar-width:thin;max-height:calc(100vh - 420px);padding:10px 12px 14px}
.doc-toc .post-toc__list a{font-size:14px;line-height:1.7;padding:6px 10px}
.doc-toc .doc-toc__l3{counter-increment:none}
.doc-toc .doc-toc__l3 a{padding-inline-start:30px;font-size:13px;color:var(--muted)}
.doc-toc .doc-toc__l3 a::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--line-2);align-self:center}
.doc-toc .doc-toc__l3 a.is-active::before{background:var(--gold)}
.doc-toc .doc-toc__l2 a{font-weight:800}

.doc-help{flex:none;position:relative;padding:22px;border-radius:22px;background:var(--ink);color:var(--on-ink);overflow:hidden}
.doc-help::after{content:"";position:absolute;inset-inline-start:-50px;bottom:-60px;width:160px;height:160px;border-radius:50%;background:radial-gradient(circle,rgba(243,188,0,.22),transparent 70%);pointer-events:none}
.doc-help__icon{display:flex;width:46px;height:46px;border-radius:14px;align-items:center;justify-content:center;background:var(--gold);color:#0A1430;margin-bottom:10px}
.doc-help__icon .d{fill:rgba(10,20,48,.25)}
.doc-help__title{margin:0;font-weight:900;font-size:17px;color:#fff}
.doc-help__text{margin:4px 0 12px;font-size:14px;color:var(--on-ink-2)}
.doc-help__phone{position:relative;z-index:1;font-size:20px;font-weight:900;color:#fff}
.doc-help__phone:hover{color:var(--gold-2)}
.doc-help__link{position:relative;z-index:1;display:inline-block;margin-top:10px;font-size:14px;font-weight:800;color:var(--gold-2)}
.doc-help__link::after{content:" ←"}

.doc-main{min-width:0;display:flex;flex-direction:column;gap:28px}
.doc-body{padding:36px 40px;border-radius:28px;background:var(--card);border:1px solid var(--line)}
.doc-body>:first-child{margin-top:0}
.doc-body h2{margin:1.8em 0 .6em;font-size:24px;line-height:1.6;font-weight:900;color:var(--ink-text)}
.doc-body h2:first-child{margin-top:0}
.doc-body h3{margin:1.5em 0 .4em;font-size:18px;line-height:1.7;font-weight:900;color:var(--navy)}
.doc-body h2+h3{margin-top:.6em}
.doc-body p{margin:0 0 1em}
.doc-body ol{counter-reset:doc;list-style:none;padding:0;margin:0 0 1em;display:grid;gap:10px}
.doc-body ol>li{counter-increment:doc;position:relative;padding:12px 16px;padding-inline-start:56px;border-radius:16px;background:var(--paper);line-height:2}
.doc-body ol>li::before{content:counter(doc);position:absolute;inset-inline-start:14px;top:12px;width:30px;height:30px;border-radius:10px;display:flex;align-items:center;justify-content:center;background:var(--ink);color:var(--gold);font-weight:900;font-size:14px;line-height:1}
.doc-body .ed-faq{margin:0 0 1.2em;max-width:none}
.doc-body .ed-faq .faq__item summary{font-size:16.5px;line-height:1.8}
.doc-body .ed-faq .faq__a a{font-weight:800}
.doc-body .ed-list{margin:0 0 1.2em}
.doc-body .ed-list li{font-size:15.5px}

.doc-call{margin:0 0 1em}
.doc-call a{display:inline-flex;align-items:center;gap:14px;padding:14px 22px;border-radius:20px;background:var(--ink);color:#fff;text-decoration:none}
.doc-call a:hover{color:var(--gold-2)}
.doc-call small{display:block;font-size:13px;color:var(--on-ink-2);line-height:1.5}
.doc-call .rt-phone{font-size:22px;font-weight:900}

.doc-btns{display:flex;flex-wrap:wrap;gap:12px;margin:0}
.doc-btns .btn-line{color:var(--ink-text)}

.doc-form{padding:30px 32px;border-radius:28px}
.doc-form__title{display:flex;align-items:center;gap:10px;margin:0 0 6px;font-size:22px;font-weight:900;color:var(--ink-text)}
.doc-form__title svg{color:var(--gold-ink)}
.doc-form__lead{margin:0 0 20px;color:var(--muted)}
.doc-form .ed-form{box-shadow:none;border:0;padding:0;background:transparent}

.doc-more h2{margin:0 0 14px;font-size:20px;font-weight:900;color:var(--ink-text)}
.doc-channels{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.doc-channel{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:20px;background:var(--card);border:1px solid var(--line);color:var(--text);text-decoration:none;transition:transform .2s,box-shadow .2s,border-color .2s}
.doc-channel:hover{color:var(--text);transform:translateY(-3px);box-shadow:0 16px 36px var(--shadow);border-color:rgba(243,188,0,.6)}
.doc-channel__icon{flex:none;width:46px;height:46px;border-radius:14px;display:flex;align-items:center;justify-content:center;background:var(--ink);color:#fff}
.doc-channel__icon .d{fill:rgba(243,188,0,.9);stroke:#F3BC00}
.doc-channel b{display:block;font-size:16px;color:var(--ink-text);line-height:1.6}
.doc-channel small{display:block;font-size:13px;color:var(--muted);line-height:1.8}
.doc-body .doc-channels{margin-top:12px}
.doc-body .doc-channel{background:var(--paper);text-decoration:none;color:var(--text)}
.doc-body .doc-call a{text-decoration:none}

@media (max-width:1100px){
	.doc-layout{grid-template-columns:260px minmax(0,1fr);gap:28px}
}
@media (max-width:960px){
	.doc-layout{grid-template-columns:minmax(0,1fr);padding-block:28px 56px;gap:20px}
	.doc-side{position:static;max-height:none;display:contents}
	.doc-toc{order:-1}
	.doc-toc .post-toc__list{max-height:60vh}
	.doc-help{order:5}
	.doc-main{order:0}
}
@media (max-width:640px){
	.doc-hero .page-hero__title{font-size:30px}
	.doc-hero__art{max-width:220px;margin-inline:auto}
	.doc-meta li{padding:6px 12px;font-size:13px}
	.doc-body{padding:22px 18px;border-radius:22px;font-size:16px}
	.doc-body h2{font-size:20px}
	.doc-body h3{font-size:17px}
	.doc-body ol>li{padding-inline-start:50px}
	.doc-form{padding:22px 18px}
	.doc-channels{grid-template-columns:minmax(0,1fr)}
	.doc-call a{width:100%}
	.doc-btns .btn{flex:1 1 100%}
}
@media (prefers-reduced-motion:reduce){
	.doc-art *{animation:none!important}
}
