:root{--accent: var(--accent-primary, var(--f-accent));--accent-hover: var(--accent-primary-hover, var(--f-accent-hover));--bg: #ffffff;--bg-tint: #f4f6f9;--bg-soft: #fafafa;--bg-hover: #ebecef;--border-light: #eef0f3;--border: #e5e7eb;--border-strong: #d4d4d8;--border-dark: #71717a;--border-graphic: 5px solid;--text: #111827;--text-2: #525866;--text-muted: #9ca3af}.logo-grid{display:grid;grid-template-columns:1fr;gap:.85rem}@media(min-width:720px){.logo-grid{grid-template-columns:repeat(2,1fr)}}@media(min-width:1024px){.logo-grid{grid-template-columns:repeat(3,1fr)}}.logo-card{border:1px solid var(--border-strong);background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 12px 28px -16px #0f172a1a,0 2px 6px -3px #0f172a0a;display:flex;flex-direction:column}.logo-card-stage{height:240px;display:flex;align-items:center;justify-content:center;padding:2.25rem;position:relative;isolation:isolate;flex-shrink:0;background:linear-gradient(180deg,#e2e4e9 0%,transparent 100%)}.logo-card-stage:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle,rgba(15,23,42,.18) 1px,transparent 1.5px);background-size:7px 7px;pointer-events:none;-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 18%,transparent 55%);mask-image:linear-gradient(180deg,#000 0%,#000 18%,transparent 55%);z-index:-1}.logo-card-stage--dark{background:linear-gradient(180deg,#0a0a0a,#141414)}.logo-card-stage--dark:before{background-image:radial-gradient(circle,rgba(255,255,255,.1) 1px,transparent 1.5px);-webkit-mask-image:linear-gradient(180deg,#000 0%,#000 18%,transparent 55%);mask-image:linear-gradient(180deg,#000 0%,#000 18%,transparent 55%)}.logo-card-stage--accent{background:linear-gradient(180deg,var(--accent) 0%,var(--accent-hover) 100%)}.logo-card-stage--accent:before{background-image:radial-gradient(circle,rgba(255,255,255,.2) 1px,transparent 1.5px)}.logo-card-stage img{width:88px;height:88px;max-width:88px;max-height:88px;object-fit:contain}.logo-card-img--rounded{border-radius:18px}.logo-card-stage--pair{gap:1.5rem}.logo-card-body{flex:1;padding:1.2rem 1.4rem 1.4rem;border-top:1px solid var(--border-light);display:flex;flex-direction:column;align-items:flex-start;gap:.85rem}.logo-card-actions{margin-top:auto;width:100%;display:flex;gap:.45rem}.logo-card-actions .logo-card-download{flex:1}.logo-card-info h3{font-family:Mona Sans,Inter,sans-serif;font-size:1rem;font-weight:600;color:var(--text);letter-spacing:-.01em}.logo-card-info p{margin-top:.2rem;font-size:.84rem;color:var(--text-2);line-height:1.4}.logo-card-download{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;font-family:Mona Sans,Inter,sans-serif;font-size:.82rem;font-weight:600;color:#fff;background:linear-gradient(180deg,#1a1a1a,#050505);border:0;padding:.6rem 1.05rem;border-radius:.65rem;transition:background .2s;white-space:nowrap}.logo-card-download:hover{background:linear-gradient(180deg,#2a2a2a,#0a0a0a);color:#fff}.logo-card-download svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}.color-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.85rem}@media(min-width:720px){.color-grid{grid-template-columns:repeat(3,1fr)}}@media(min-width:1024px){.color-grid{grid-template-columns:repeat(4,1fr)}}.color-card{border:1px solid var(--border-strong);background:#fff;border-radius:22px;overflow:hidden;box-shadow:0 12px 28px -16px #0f172a1a,0 2px 6px -3px #0f172a0a}.color-swatch{height:140px;position:relative}.color-swatch:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:#0000000d}.color-info{padding:1rem 1.15rem 1.2rem}.color-info h3{font-family:Mona Sans,Inter,sans-serif;font-size:.92rem;font-weight:600;color:var(--text);letter-spacing:-.01em}.color-info code{display:inline-block;margin-top:.3rem;font-family:SF Mono,JetBrains Mono,ui-monospace,monospace;font-size:.78rem;color:var(--text-2);background:var(--bg-tint);padding:2px 7px;border-radius:6px;letter-spacing:0}.color-info p{margin-top:.6rem;font-size:.82rem;color:var(--text-2);line-height:1.45}.type-grid{display:grid;grid-template-columns:1fr;gap:.85rem}@media(min-width:880px){.type-grid{grid-template-columns:repeat(3,1fr)}}.type-card{border:1px solid var(--border-strong);background:#fff;border-radius:22px;padding:1.85rem 1.75rem;display:flex;flex-direction:column;gap:1rem;box-shadow:0 12px 28px -16px #0f172a1a,0 2px 6px -3px #0f172a0a}.type-sample{height:160px;display:flex;align-items:center;justify-content:center;text-align:center;font-size:clamp(2.6rem,5vw,3.4rem);line-height:1;letter-spacing:-.02em;color:var(--text)}.type-meta{flex:1}.type-sample-druk{font-family:Druk Wide,Mona Sans,sans-serif;font-weight:700;text-transform:uppercase;font-size:clamp(1.4rem,3vw,1.85rem);letter-spacing:0}.type-sample-mona{font-family:Mona Sans,Inter,sans-serif;font-weight:700;letter-spacing:-.025em}.type-sample-inter{font-family:Inter,sans-serif;font-weight:400;font-size:1.1rem;line-height:1.55;color:var(--text-2);letter-spacing:-.01em}.type-meta{border-top:1px solid var(--border-light);padding-top:1rem;display:flex;flex-direction:column;gap:.4rem}.type-meta h3{font-family:Mona Sans,Inter,sans-serif;font-size:1rem;font-weight:600;color:var(--text);letter-spacing:-.01em}.type-meta p{font-size:.86rem;color:var(--text-2);line-height:1.5}.type-tag{align-self:flex-start;font-family:Mona Sans,Inter,sans-serif;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--accent);background:#0000001a;border:1px solid rgba(0,0,0,.22);padding:3px 9px;border-radius:999px;margin-top:.35rem}.type-spec{margin-top:.45rem;padding-top:.85rem;border-top:1px dashed var(--border-light);display:flex;flex-direction:column;gap:.35rem}.type-spec>div{display:flex;justify-content:space-between;gap:.6rem;font-size:.78rem;line-height:1.4}.type-spec dt{font-family:Mona Sans,Inter,sans-serif;font-weight:600;color:var(--text-2);letter-spacing:.02em;text-transform:uppercase;font-size:.7rem;white-space:nowrap;align-self:center}.type-spec dd{margin:0;font-family:Mona Sans,Inter,sans-serif;font-feature-settings:"tnum" 1;color:var(--text);text-align:right}.usage-grid{display:grid;grid-template-columns:1fr;gap:.85rem}@media(min-width:720px){.usage-grid{grid-template-columns:repeat(2,1fr)}}.usage-card{border:1px solid var(--border-strong);background:#fff;border-radius:22px;padding:1.85rem 1.75rem;box-shadow:0 12px 28px -16px #0f172a1a,0 2px 6px -3px #0f172a0a}.usage-card-head{display:inline-flex;align-items:center;gap:.5rem;font-family:Mona Sans,Inter,sans-serif;font-size:.74rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;margin-bottom:.85rem}.usage-card--do .usage-card-head{color:#16a34a}.usage-card--dont .usage-card-head{color:#dc2626}.usage-card-head .usage-icon{width:22px;height:22px;border-radius:50%;display:grid;place-items:center}.usage-card--do .usage-icon{background:#16a34a1a;border:1px solid rgba(22,163,74,.22)}.usage-card--dont .usage-icon{background:#dc26261a;border:1px solid rgba(220,38,38,.22)}.usage-icon svg{width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}.usage-card ul{display:flex;flex-direction:column;gap:.6rem}.usage-card li{font-size:.95rem;color:var(--text-2);line-height:1.55;position:relative;padding-left:1.1rem}.usage-card li:before{content:"";position:absolute;left:0;top:.65rem;width:5px;height:5px;border-radius:50%;background:var(--border-strong)}.usage-card--do li:before{background:#16a34a}.usage-card--dont li:before{background:#dc2626}.end-cta{border:1px solid var(--border-strong);background:#fff;border-radius:22px;padding:2.4rem 2rem;display:flex;flex-direction:column;align-items:center;gap:1.4rem;text-align:center;box-shadow:0 12px 28px -16px #0f172a1a,0 2px 6px -3px #0f172a0a}@media(min-width:720px){.end-cta{flex-direction:row;justify-content:space-between;text-align:left;padding:3rem}}.end-cta-text{max-width:520px}.end-cta-text h2{font-family:Mona Sans,Inter,sans-serif;font-size:clamp(1.55rem,3vw,2rem);font-weight:600;color:var(--text);letter-spacing:-.02em;margin:0}.end-cta-text p{margin-top:.6rem;font-size:.98rem;color:var(--text-2);line-height:1.55}.end-cta a.btn-hero-black{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;background:linear-gradient(180deg,#1a1a1a,#050505);color:#fff;font-family:Mona Sans,Inter,sans-serif;font-size:.95rem;font-weight:600;padding:.85rem 1.6rem;border-radius:.85rem;white-space:nowrap;transition:background .2s}.end-cta a.btn-hero-black:hover{background:linear-gradient(180deg,#2a2a2a,#0a0a0a)}