.pub-hero{display:grid;grid-template-columns:1.4fr 1fr;align-items:center;gap:40px;padding:clamp(28px,4vw,56px);border-radius:22px;background:var(--hero);overflow:hidden}
.pub-eyebrow{font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--blue);margin:0 0 12px}
.pub-hero h1{font-family:var(--serif);font-size:clamp(46px,5.2vw,76px);line-height:1.02;font-weight:400;margin:0 0 22px;letter-spacing:-.02em;max-width:100%}
.pub-intro{font-size:16px;max-width:53ch;color:var(--muted);line-height:1.8}
.pub-actions{display:flex;align-items:center;flex-wrap:wrap;gap:16px 22px;margin:26px 0 16px}
.pub-small{font-size:13px;line-height:1.7;color:var(--muted)}
.pub-hero-art{position:relative;min-height:340px;margin:20px}
.pub-art-card{position:absolute;inset:10px 25px 20px;border-radius:18px}
.pub-art-back{background:#a6b6ef;transform:rotate(-11deg)}
.pub-art-front{background:#2d48bd;color:#fff;transform:rotate(5deg);display:flex;flex-direction:column;align-items:flex-start;padding:26px}
.pub-art-icon{border:1px solid #a6b6ef;border-radius:10px;display:grid;place-items:center;width:42px;height:42px;font-size:23px}
.pub-art-brand{font-weight:700;font-size:19px;margin-top:16px;letter-spacing:-.6px}
.pub-art-brand>span{color:#c9d3ff}
.pub-art-message{font-family:var(--serif);font-size:38px;line-height:1.04;margin-top:22px}
.pub-art-arrow{position:absolute;right:22px;bottom:22px;background:#f5ece1;color:#2d48bd;border-radius:50%;width:40px;height:40px;display:grid;place-items:center}
.pub-art-stamp{position:absolute;right:-14px;top:-10px;width:96px;height:96px;border-radius:50%;background:#f5ece1;color:#283b87;border:1px solid #d3c8b7;display:grid;place-content:center;text-align:center;font-size:11px;font-weight:700;transform:rotate(10deg)}
.pub-steps{list-style:none;padding:28px 0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px;border-bottom:1px solid var(--line);margin:12px 0 56px}
.pub-steps li{display:flex;gap:16px;align-items:flex-start}
.pub-steps li>span{font-family:var(--serif);font-size:32px;color:var(--blue);line-height:1}
.pub-steps strong{font-size:15px}
.pub-steps p{font-size:13px;line-height:1.7;color:var(--muted);margin:5px 0 0}
.pub-section{margin-bottom:64px;scroll-margin-top:24px}
.pub-section h2{font-size:clamp(32px,3.2vw,44px);line-height:1.1}
.pub-banners{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.pub-banner{border:1px solid var(--line);border-radius:16px;overflow:hidden;background:var(--surface);min-width:0}
.pub-banner-wide{grid-column:1/-1}
.pub-preview{height:280px;display:flex;align-items:center;justify-content:center;padding:24px;background:var(--soft);background-image:radial-gradient(var(--edge) .7px,transparent .7px);background-size:14px 14px}
.pub-banner-wide .pub-preview{height:172px}
.pub-preview a{display:flex;align-items:center;justify-content:center;max-width:100%;height:100%}
.pub-preview img{display:block;width:auto;height:auto;max-height:100%;max-width:100%;object-fit:contain;box-shadow:0 5px 20px #151d3418}
.pub-banner-content{padding:24px}
.pub-banner-heading{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap}
.pub-banner-heading h3{font-family:var(--sans);font-size:18px;font-weight:700;line-height:1.4;margin:0}
.pub-size{font-size:11px;font-weight:600;background:var(--soft);color:var(--muted);border:1px solid var(--line);border-radius:30px;padding:5px 10px;white-space:nowrap}
.pub-downloads{display:flex;align-items:center;flex-wrap:wrap;gap:8px 16px;margin:18px 0 22px;font-size:13px}
.pub-downloads>span{color:var(--muted)}
.pub-downloads a,.pub-questions a{color:var(--blue);text-decoration:underline;text-underline-offset:3px}
.pub-code label{display:block;font-size:12px;font-weight:600;margin-bottom:8px}
.pub-code textarea{display:block;width:100%;min-height:100px;resize:vertical;padding:12px;border:1px solid var(--edge);border-radius:7px;background:var(--paper);color:var(--ink);font:12px/1.65 Consolas,monospace;overflow-wrap:anywhere;word-break:break-all;margin-bottom:12px}
.pub-code .action{font-size:13px;min-height:42px}
.pub-code [hidden]{display:none}
.pub-copy-status{font-size:12px;line-height:1.5;min-height:18px;color:var(--blue);margin:8px 0 0}
.pub-formats-note{margin-top:20px;max-width:100ch}
.pub-text-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.pub-text-card{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:14px;padding:24px;background:var(--surface);min-width:0}
.pub-text-card>.pub-small{margin:0}
.pub-text-preview{font-size:17px;font-weight:600;line-height:1.6;color:var(--blue);margin:12px 0 24px}
.pub-text-preview a{text-decoration:underline;text-underline-offset:4px}
.pub-text-card .pub-code{margin-top:auto}
.pub-help{display:grid;grid-template-columns:1fr 1.3fr;gap:60px;border-top:1px solid var(--line);padding-top:44px}
.pub-help>div>p:not(.pub-eyebrow){font-size:14px;line-height:1.8;color:var(--muted)}
.pub-help .textlink{font-size:14px}
.pub-questions details{border-bottom:1px solid var(--line);padding:18px 0}
.pub-questions details:first-child{padding-top:0}
.pub-questions summary{font-size:15px;font-weight:600;line-height:1.6;cursor:pointer}
.pub-questions p{font-size:14px;line-height:1.8;color:var(--muted);margin:12px 0 0}
@media(max-width:1000px){
 .pub-hero{grid-template-columns:1.4fr 1fr;gap:10px}
 .pub-hero-art{margin:0;min-height:310px}
 .pub-art-card{inset:20px 14px}
 .pub-art-front{padding:20px}
 .pub-art-brand{font-size:16px}
 .pub-art-message{font-size:32px}
 .pub-art-stamp{right:-15px;top:0;width:80px;height:80px;font-size:10px}
 .pub-text-links{grid-template-columns:1fr}
 .pub-text-preview{margin-bottom:18px}
 .pub-help{gap:30px}
}
@media(max-width:700px){
 .pub-hero{grid-template-columns:1fr;padding:28px 24px}
 .pub-hero-art{display:none}
 .pub-hero h1{font-size:clamp(40px,10vw,49px)}
 .pub-intro{font-size:14px}
 .pub-steps{grid-template-columns:1fr;gap:22px;margin-bottom:36px}
 .pub-banners{grid-template-columns:1fr;gap:20px}
 .pub-banner-wide{grid-column:auto}
 .pub-preview{height:254px;padding:18px}
 .pub-banner-wide .pub-preview{height:110px}
 .pub-banner-content{padding:20px}
 .pub-help{grid-template-columns:1fr;gap:28px}
 .pub-section{margin-bottom:44px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}