/* Brand guidelines page (brand v2) */
.tile{border-radius:var(--r);padding:34px;display:grid;place-items:center;min-height:200px;position:relative;border:1px solid var(--line)}
.tile img{max-height:110px;width:auto}
.tile .cap{position:absolute;left:14px;bottom:10px;font:500 .85rem var(--font-body);color:var(--muted)}
.tile.bg-white{background:#fff}
.tile.bg-soft{background:var(--soft)}
.tile.bg-ink{background:var(--ink);border-color:var(--ink)}
.tile.bg-ink .cap{color:#AEB8C2}
.swatches{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px}
@media(max-width:900px){.swatches{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.swatches{grid-template-columns:1fr}}
.sw{border-radius:var(--r);overflow:hidden;border:1px solid var(--line);background:#fff;box-shadow:var(--shadow)}
.sw .chip{height:104px;display:flex;align-items:flex-end;padding:12px 14px;font:700 1.15rem var(--font-display)}
.sw dl{margin:0;padding:14px;font-size:.92rem;display:grid;grid-template-columns:auto 1fr;gap:2px 12px}
.sw dt{color:var(--muted)}.sw dd{margin:0;color:var(--ink);font-variant-numeric:tabular-nums}
.sw p{padding:0 14px 14px;margin:0;font-size:.92rem}
.ratio{height:34px;border-radius:8px;overflow:hidden;display:flex;margin-top:14px;border:1px solid var(--line)}
.ratio i{display:block;height:100%}
.bignote{border-left:4px solid var(--teal);padding:6px 0 6px 18px;margin:24px 0;color:var(--ink);font-size:1.12rem}
.dont{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:18px}
@media(max-width:760px){.dont{grid-template-columns:1fr 1fr}}
.dont figure{margin:0;border:1px solid var(--line);border-radius:12px;background:#fff;overflow:hidden}
.dont .pic{height:120px;display:grid;place-items:center;position:relative;overflow:hidden}
.dont .pic img{height:44px;width:auto}
.dont figcaption{background:var(--soft);padding:10px 12px;font-size:.9rem;display:flex;gap:8px}
.dont figcaption::before{content:"\00D7";color:#A3271A;font-weight:700}
.clear{position:relative;display:inline-block;padding:40px;background:repeating-linear-gradient(45deg,rgba(0,160,168,.14) 0 6px,transparent 6px 12px);border:1px dashed var(--teal)}
.clear img{height:72px;width:auto;background:#fff;display:block}
.type-sample{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:26px;box-shadow:var(--shadow)}
.type-sample .big{font:800 3.2rem/1 var(--font-display);color:var(--ink);letter-spacing:-.035em}
.type-sample .body{font:400 1.25rem/1.5 var(--font-body);color:var(--ink-2)}
.type-sample .numbers{font:700 2.6rem/1.1 var(--font-body);color:var(--ink);font-variant-numeric:tabular-nums;margin-top:10px}
.type-sample .meta{font-size:.92rem;color:var(--muted);margin-top:14px}
.say{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:18px}
@media(max-width:700px){.say{grid-template-columns:1fr}}
.say .yes,.say .no{border-radius:12px;padding:20px;border:1px solid var(--line);background:#fff}
.say .yes h3{color:var(--ahead-ink)}.say .no h3{color:#A3271A}
.say ul{margin:0;padding-left:1.1em}.say li{margin:.4em 0}
table.ct{width:100%;border-collapse:collapse;margin-top:18px;font-size:.96rem}
table.ct th,table.ct td{padding:11px 12px;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}
table.ct th{color:var(--ink);font-weight:600}
table.ct td.s{width:58px}
.pill{display:inline-block;width:46px;height:26px;border-radius:6px;vertical-align:middle;border:1px solid rgba(0,0,0,.08)}
.dl{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:20px}
@media(max-width:800px){.dl{grid-template-columns:1fr}}
.dl a{display:block;background:#fff;border:1px solid var(--line);border-radius:12px;padding:16px 18px;text-decoration:none;color:var(--ink)}
.dl a:hover{border-color:var(--teal-ink)}
.dl small{display:block;color:var(--muted);margin-top:4px}
.toc{display:flex;flex-wrap:wrap;gap:10px;margin-top:24px}
.toc a{border:1px solid var(--line);border-radius:99px;padding:6px 14px;text-decoration:none;font:500 .95rem var(--font-body);color:var(--ink-2);background:#fff}
.toc a:hover{border-color:var(--teal-ink);color:var(--teal-ink)}
.device{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:12px 18px 18px;box-shadow:var(--shadow)}
.device svg{width:100%;height:auto}
.mock{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:20px}
@media(max-width:800px){.mock{grid-template-columns:1fr}}
.mock .bar{display:grid;grid-template-columns:repeat(24,1fr);gap:3px;height:28px}
.mock .bar i{background:#1A1A1A;border-radius:2px}.mock .bar i.w{background:#fff}
.mock .bx{background:#000;border-radius:12px;padding:16px;border:6px solid #1E242C}
.mock .bx.border{box-shadow:inset 0 0 0 7px #E10600}
.mock .bx.full{background:#E10600}
.mock p{margin:10px 0 0;font-size:.92rem}
.label-art{background:var(--soft);border-radius:12px;padding:20px;border:1px solid var(--line)}
