{"id":11,"date":"2026-04-22T13:21:18","date_gmt":"2026-04-22T13:21:18","guid":{"rendered":"https:\/\/azstaging2.wpenginepowered.com\/?page_id=11"},"modified":"2026-04-22T13:40:44","modified_gmt":"2026-04-22T13:40:44","slug":"brand-guidelines","status":"publish","type":"page","link":"https:\/\/azuriyapharma.co\/?page_id=11","title":{"rendered":"Brand Guidelines"},"content":{"rendered":"\t\t
\n\t\t\t\t
\n\t\t\t\t\t
\n\t\t\t\t
\n\t\t\t\t\t\n\n\n\n\n\nBrand Guidelines \u2014 Azuriya Pharma<\/title>\n<meta name=\"description\" content=\"The working reference for Azuriya Pharma identity: logo, color, typography, voice, and applications.\">\n<link rel=\"icon\" href=\"https:\/\/azuriyapharma.co\/wp-content\/uploads\/2026\/04\/Azuryia-Logo-No-Background-e1776863837551.png\">\n<style>\n\/* ============================================================\n Azuriya Pharma \u2014 Website Design System\n Derived from the Azuriya logo: indigo \/ emerald \/ violet gradient\n ============================================================ *\/\n\n@import url('https:\/\/fonts.googleapis.com\/css2?family=Fraunces:ital,opsz,wght@0,9..144,300..900;1,9..144,300..900&family=Manrope:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap');\n\n:root {\n \/* === BRAND CORE (from logo) === *\/\n --indigo: #1C1691; \/* Primary \u2014 \"Azuriya\" wordmark *\/\n --indigo-deep: #14107A; \/* Hover \/ pressed *\/\n --ink: #0B0A4E; \/* Deep background for hero \/ footer *\/\n --emerald: #00A03C; \/* Secondary \u2014 green arc *\/\n --emerald-bright:#14BE54; \/* Hover highlight *\/\n --violet: #8B4FD8; \/* Accent \u2014 gradient start *\/\n --magenta: #C850DC; \/* Accent \u2014 gradient end *\/\n\n \/* === TINTS & SURFACES === *\/\n --cloud: #F7F8FC;\n --lavender: #F0EBFA;\n --mint: #E6F7EC;\n --white: #FFFFFF;\n\n \/* === TEXT === *\/\n --ink-body: #1A1A2E; \/* body text \u2014 indigo-tinted charcoal *\/\n --ink-muted: #555566;\n --ink-subtle: #8A8A9C;\n\n \/* === LINES === *\/\n --line: #E4E4F0;\n --line-strong: #C8C8DC;\n\n \/* === EFFECTS === *\/\n --gradient-accent: linear-gradient(90deg, var(--violet) 0%, var(--magenta) 100%);\n --gradient-brand: linear-gradient(135deg, var(--indigo) 0%, var(--violet) 100%);\n --gradient-hero: linear-gradient(135deg, #0B0A4E 0%, #1C1691 60%, #2E1E8C 100%);\n\n --shadow-sm: 0 1px 2px rgba(11,10,78,0.04), 0 1px 3px rgba(11,10,78,0.06);\n --shadow-md: 0 4px 12px rgba(11,10,78,0.06), 0 8px 24px rgba(11,10,78,0.04);\n --shadow-lg: 0 12px 32px rgba(11,10,78,0.08), 0 24px 64px rgba(11,10,78,0.06);\n\n \/* === RADII === *\/\n --r-sm: 4px;\n --r-md: 8px;\n --r-lg: 14px;\n --r-xl: 22px;\n\n \/* === TYPE SCALE === *\/\n --f-display: 'Fraunces', 'Georgia', serif;\n --f-sans: 'Manrope', -apple-system, BlinkMacSystemFont, sans-serif;\n --f-mono: 'JetBrains Mono', 'SF Mono', Menlo, monospace;\n}\n\n\/* ========== RESET ========== *\/\n*, *::before, *::after { box-sizing: border-box; }\nhtml { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }\nbody {\n margin: 0;\n font-family: var(--f-sans);\n font-size: 17px;\n line-height: 1.65;\n color: var(--ink-body);\n background: var(--white);\n font-feature-settings: 'ss01', 'cv11';\n -webkit-font-smoothing: antialiased;\n -moz-osx-font-smoothing: grayscale;\n}\n@media (min-width: 1600px) {\n body { font-size: 18px; }\n}\n@media (max-width: 640px) {\n body { font-size: 16px; line-height: 1.6; }\n}\nimg { max-width: 100%; display: block; }\na { color: var(--indigo); text-decoration: none; transition: color .15s ease; }\na:hover { color: var(--violet); }\nbutton { font-family: inherit; cursor: pointer; }\n\n\/* ========== TYPOGRAPHY ========== *\/\nh1, h2, h3, h4 {\n font-family: var(--f-display);\n font-weight: 500;\n line-height: 1.12;\n letter-spacing: -0.02em;\n color: var(--ink);\n margin: 0 0 .5em;\n font-variation-settings: 'opsz' 144;\n}\nh1 { font-size: clamp(2.6rem, 5.5vw, 5rem); line-height: 1.06; }\nh2 { font-size: clamp(2rem, 4vw, 3.2rem); line-height: 1.12; }\nh3 { font-size: clamp(1.4rem, 2.4vw, 1.75rem); font-family: var(--f-sans); font-weight: 700; letter-spacing: -0.01em; line-height: 1.25; }\nh4 { font-size: 1.15rem; font-family: var(--f-sans); font-weight: 600; letter-spacing: 0; }\n\n.eyebrow {\n font-family: var(--f-sans);\n font-size: .88rem;\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: .18em;\n color: var(--emerald);\n display: inline-flex;\n align-items: center;\n gap: .55rem;\n}\n.eyebrow::before {\n content: '';\n display: inline-block;\n width: 22px;\n height: 1px;\n background: var(--emerald);\n}\n\n.lead { font-size: clamp(1.15rem, 1.4vw, 1.4rem); line-height: 1.55; color: var(--ink-muted); max-width: 62ch; }\n.mono { font-family: var(--f-mono); font-size: .92em; letter-spacing: -.01em; }\n\n\/* Italic emphasis in serif headlines gets a violet tint *\/\nh1 em, h2 em, .serif em {\n font-style: italic;\n font-weight: 400;\n background: var(--gradient-accent);\n -webkit-background-clip: text;\n background-clip: text;\n -webkit-text-fill-color: transparent;\n}\n\n\/* ========== LAYOUT ========== *\/\n.wrap { max-width: 1320px; margin: 0 auto; padding: 0 32px; }\n.narrow { max-width: 960px; margin: 0 auto; padding: 0 32px; }\n.section { padding: clamp(4rem, 8vw, 8rem) 0; }\n.section-sm { padding: clamp(2.5rem, 5vw, 4.5rem) 0; }\n@media (max-width: 640px) {\n .wrap, .narrow { padding: 0 20px; }\n}\n\n\/* ========== NAV ========== *\/\n.nav {\n position: sticky; top: 0; z-index: 50;\n background: rgba(255,255,255,.88);\n backdrop-filter: saturate(180%) blur(12px);\n -webkit-backdrop-filter: saturate(180%) blur(12px);\n border-bottom: 1px solid var(--line);\n}\n.nav-inner {\n max-width: 1320px; margin: 0 auto;\n padding: 20px 32px;\n display: flex; align-items: center; justify-content: space-between;\n gap: 32px;\n}\n.nav-brand {\n display: flex; align-items: center; gap: 10px;\n text-decoration: none;\n}\n.nav-brand img { height: 44px; width: auto; }\n.nav-links {\n display: flex; gap: 32px; align-items: center;\n list-style: none; margin: 0; padding: 0;\n}\n.nav-links a {\n font-size: 1.02rem;\n font-weight: 500;\n color: var(--ink-body);\n position: relative;\n padding: 4px 0;\n}\n.nav-links a:hover { color: var(--indigo); }\n.nav-links a.is-active { color: var(--indigo); }\n.nav-links a.is-active::after {\n content: ''; position: absolute; left: 0; right: 0; bottom: -4px;\n height: 2px;\n background: var(--gradient-accent);\n border-radius: 2px;\n}\n.nav-cta {\n padding: 12px 22px;\n border-radius: 999px;\n background: var(--indigo);\n color: var(--white) !important;\n font-weight: 600;\n font-size: .98rem;\n transition: all .15s ease;\n}\n.nav-cta:hover { background: var(--indigo-deep); transform: translateY(-1px); }\n\n.nav-toggle { display: none; background: none; border: 0; padding: 6px; cursor: pointer; }\n.nav-toggle svg { width: 28px; height: 28px; color: var(--indigo); }\n\n\/* Mobile drawer: revealed when .nav has .is-open *\/\n.nav-mobile {\n display: none;\n border-top: 1px solid var(--line);\n background: var(--white);\n padding: 16px 32px 24px;\n}\n.nav-mobile ul { list-style: none; margin: 0; padding: 0; }\n.nav-mobile li { border-bottom: 1px solid var(--line); }\n.nav-mobile li:last-child { border-bottom: 0; }\n.nav-mobile a {\n display: block;\n padding: 16px 0;\n font-size: 1.12rem;\n font-weight: 500;\n color: var(--ink);\n}\n.nav-mobile a:hover, .nav-mobile a.is-active { color: var(--indigo); }\n.nav-mobile .nav-cta {\n display: inline-block;\n margin-top: 20px;\n color: var(--white) !important;\n}\n.nav.is-open .nav-mobile { display: block; }\n\n@media (max-width: 1024px) {\n .nav-links { display: none; }\n .nav-toggle { display: block; }\n .nav-inner > .nav-cta { display: none; } \/* Contact CTA moves into drawer *\/\n}\n@media (max-width: 640px) {\n .nav-inner { padding: 16px 20px; }\n .nav-brand img { height: 38px; }\n .nav-mobile { padding: 16px 20px 24px; }\n}\n\n\/* ========== BUTTONS ========== *\/\n.btn {\n display: inline-flex; align-items: center; gap: 8px;\n padding: 16px 28px;\n border-radius: 999px;\n font-weight: 600;\n font-size: 1rem;\n text-decoration: none;\n transition: all .18s ease;\n border: 0;\n}\n.btn-primary { background: var(--indigo); color: var(--white); }\n.btn-primary:hover { background: var(--indigo-deep); color: var(--white); transform: translateY(-1px); box-shadow: var(--shadow-md); }\n\n.btn-emerald { background: var(--emerald); color: var(--white); }\n.btn-emerald:hover { background: var(--emerald-bright); color: var(--white); transform: translateY(-1px); }\n\n.btn-ghost {\n background: transparent;\n color: var(--indigo);\n border: 1.5px solid var(--line-strong);\n}\n.btn-ghost:hover { border-color: var(--indigo); background: var(--lavender); color: var(--indigo); }\n\n.btn-light {\n background: rgba(255,255,255,0.1);\n color: var(--white);\n border: 1.5px solid rgba(255,255,255,0.25);\n backdrop-filter: blur(8px);\n}\n.btn-light:hover { background: rgba(255,255,255,0.18); color: var(--white); border-color: rgba(255,255,255,0.5); }\n\n\/* ========== HERO ========== *\/\n.hero {\n position: relative;\n background: var(--gradient-hero);\n color: var(--white);\n padding: clamp(5rem, 10vw, 8rem) 0 clamp(4rem, 8vw, 6rem);\n overflow: hidden;\n}\n.hero::before {\n \/* subtle molecular network texture *\/\n content: '';\n position: absolute; inset: 0;\n background-image:\n radial-gradient(circle at 20% 30%, rgba(139,79,216,0.18) 0%, transparent 40%),\n radial-gradient(circle at 80% 70%, rgba(0,160,60,0.12) 0%, transparent 45%),\n radial-gradient(circle at 50% 100%, rgba(200,80,220,0.10) 0%, transparent 50%);\n pointer-events: none;\n}\n.hero::after {\n content: '';\n position: absolute; inset: 0;\n background-image: url(\"data:image\/svg+xml;utf8,<svg xmlns='http:\/\/www.w3.org\/2000\/svg' width='160' height='160' viewBox='0 0 160 160'><g fill='none' stroke='white' stroke-opacity='0.05' stroke-width='1'><circle cx='80' cy='80' r='3'\/><circle cx='20' cy='40' r='2'\/><circle cx='140' cy='120' r='2'\/><circle cx='40' cy='130' r='2.5'\/><circle cx='120' cy='30' r='2.5'\/><path d='M80 80 L20 40 M80 80 L140 120 M80 80 L40 130 M80 80 L120 30'\/><\/g><\/svg>\");\n background-size: 320px 320px;\n opacity: .5;\n pointer-events: none;\n}\n.hero > .wrap { position: relative; z-index: 1; }\n.hero h1 { color: var(--white); }\n.hero .eyebrow { color: #6FE5A1; }\n.hero .eyebrow::before { background: #6FE5A1; }\n.hero .lead { color: rgba(255,255,255,.85); font-size: clamp(1.2rem, 1.5vw, 1.45rem); max-width: 58ch; }\n\n\/* ========== CARD \/ PANEL ========== *\/\n.card {\n background: var(--white);\n border: 1px solid var(--line);\n border-radius: var(--r-lg);\n padding: 28px;\n transition: all .2s ease;\n}\n.card:hover { border-color: var(--line-strong); box-shadow: var(--shadow-md); transform: translateY(-2px); }\n.card-tint-lav { background: var(--lavender); border-color: transparent; }\n.card-tint-mint { background: var(--mint); border-color: transparent; }\n\n\/* ========== STAT STRIP ========== *\/\n.stats {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));\n gap: 0;\n border: 1px solid var(--line);\n border-radius: var(--r-lg);\n overflow: hidden;\n background: var(--white);\n}\n.stat {\n padding: 40px 32px;\n border-right: 1px solid var(--line);\n position: relative;\n}\n.stat:last-child { border-right: 0; }\n.stat-value {\n font-family: var(--f-display);\n font-size: clamp(2.4rem, 4.5vw, 3.6rem);\n font-weight: 500;\n line-height: 1;\n color: var(--indigo);\n letter-spacing: -0.03em;\n margin-bottom: 10px;\n}\n.stat-label {\n font-size: .88rem;\n text-transform: uppercase;\n letter-spacing: .12em;\n color: var(--ink-muted);\n font-weight: 600;\n}\n.stat-note { font-size: .95rem; color: var(--ink-muted); margin-top: 6px; }\n@media (max-width: 720px) {\n .stat { padding: 28px 24px; border-right: 0; border-bottom: 1px solid var(--line); }\n .stat:last-child { border-bottom: 0; }\n}\n\n\/* ========== PILLAR GRID ========== *\/\n.pillars {\n display: grid;\n grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));\n gap: 24px;\n}\n.pillar {\n background: var(--white);\n border: 1px solid var(--line);\n border-radius: var(--r-lg);\n padding: 32px;\n position: relative;\n transition: all .2s ease;\n}\n.pillar:hover { border-color: var(--indigo); transform: translateY(-3px); box-shadow: var(--shadow-md); }\n.pillar-num {\n font-family: var(--f-mono);\n font-size: .88rem;\n color: var(--violet);\n font-weight: 600;\n margin-bottom: 12px;\n letter-spacing: .02em;\n}\n.pillar-title {\n font-family: var(--f-display);\n font-size: clamp(1.4rem, 1.8vw, 1.65rem);\n font-weight: 500;\n letter-spacing: -0.015em;\n color: var(--ink);\n margin: 0 0 14px;\n line-height: 1.15;\n}\n.pillar-body { font-size: 1rem; color: var(--ink-muted); line-height: 1.6; }\n@media (max-width: 640px) {\n .pillars { grid-template-columns: 1fr; gap: 16px; }\n .pillar { padding: 24px; }\n}\n\n\/* ========== TABLE ========== *\/\n.tbl-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 0 -4px; padding: 0 4px; }\n.tbl {\n width: 100%;\n border-collapse: collapse;\n font-size: 1rem;\n background: var(--white);\n border: 1px solid var(--line);\n border-radius: var(--r-md);\n overflow: hidden;\n}\n.tbl th {\n text-align: left;\n padding: 16px 20px;\n background: var(--cloud);\n border-bottom: 1px solid var(--line);\n font-size: .82rem;\n text-transform: uppercase;\n letter-spacing: .1em;\n color: var(--ink-muted);\n font-weight: 700;\n}\n.tbl td {\n padding: 16px 20px;\n border-bottom: 1px solid var(--line);\n vertical-align: top;\n}\n.tbl tr:last-child td { border-bottom: 0; }\n.tbl tr:hover td { background: var(--cloud); }\n@media (max-width: 640px) {\n .tbl { font-size: .95rem; min-width: 560px; }\n .tbl th, .tbl td { padding: 12px 14px; }\n}\n\n\/* ========== BADGES & CHIPS ========== *\/\n.badge {\n display: inline-flex; align-items: center; gap: 5px;\n padding: 4px 11px;\n font-size: .78rem;\n font-weight: 700;\n letter-spacing: .08em;\n text-transform: uppercase;\n border-radius: 4px;\n}\n.badge-new { background: var(--emerald); color: var(--white); }\n.badge-indigo { background: var(--lavender); color: var(--indigo); }\n.badge-violet { background: linear-gradient(90deg, rgba(139,79,216,.15), rgba(200,80,220,.15)); color: var(--violet); }\n.badge-outline{ background: transparent; color: var(--ink-muted); border: 1px solid var(--line-strong); }\n\n.chip {\n display: inline-flex; align-items: center; gap: 5px;\n padding: 6px 14px;\n font-size: .88rem;\n font-weight: 500;\n border-radius: 999px;\n background: var(--cloud);\n border: 1px solid var(--line);\n color: var(--ink-body);\n}\n.chip.is-active { background: var(--indigo); color: var(--white); border-color: var(--indigo); }\n.chip:hover:not(.is-active) { background: var(--lavender); border-color: var(--violet); color: var(--indigo); cursor: pointer; }\n\n\/* ========== SECTION DIVIDER ========== *\/\n.divider {\n height: 2px;\n background: var(--gradient-accent);\n border-radius: 2px;\n width: 60px;\n margin: 0 0 24px;\n}\n\n\/* ========== FOOTER ========== *\/\n.foot {\n background: var(--ink);\n color: rgba(255,255,255,.78);\n padding: 72px 0 32px;\n margin-top: 72px;\n}\n.foot a { color: rgba(255,255,255,.78); }\n.foot a:hover { color: var(--white); }\n.foot-grid {\n display: grid;\n grid-template-columns: 2fr 1fr 1fr 1fr;\n gap: 56px;\n margin-bottom: 56px;\n}\n.foot h4 {\n color: var(--white);\n font-size: .85rem;\n text-transform: uppercase;\n letter-spacing: .15em;\n margin: 0 0 18px;\n font-weight: 700;\n}\n.foot ul { list-style: none; padding: 0; margin: 0; }\n.foot ul li { margin-bottom: 12px; font-size: 1rem; }\n.foot-brand img { height: 54px; margin-bottom: 20px; filter: brightness(0) invert(1) opacity(.88); }\n.foot-copy {\n padding-top: 32px;\n border-top: 1px solid rgba(255,255,255,.12);\n font-size: .9rem;\n display: flex;\n justify-content: space-between;\n flex-wrap: wrap;\n gap: 16px;\n}\n@media (max-width: 900px) {\n .foot-grid { grid-template-columns: 1fr 1fr; gap: 36px; }\n}\n@media (max-width: 520px) {\n .foot-grid { grid-template-columns: 1fr; gap: 32px; }\n .foot { padding: 56px 0 24px; }\n}\n\n\/* ========== UTILS ========== *\/\n.grid-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; }\n.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }\n.grid-4 { display: grid; grid-template-columns: repeat(4, 1fr); gap: 24px; }\n@media (max-width: 1024px) {\n .grid-4 { grid-template-columns: repeat(2, 1fr); }\n}\n@media (max-width: 800px) {\n .grid-2, .grid-3 { grid-template-columns: 1fr; gap: 32px; }\n}\n@media (max-width: 640px) {\n .grid-4 { grid-template-columns: 1fr; gap: 16px; }\n}\n\n.text-center { text-align: center; }\n.mt-1 { margin-top: 8px; } .mt-2 { margin-top: 16px; } .mt-3 { margin-top: 24px; } .mt-4 { margin-top: 40px; } .mt-5 { margin-top: 64px; }\n.mb-1 { margin-bottom: 8px; } .mb-2 { margin-bottom: 16px; } .mb-3 { margin-bottom: 24px; } .mb-4 { margin-bottom: 40px; }\n\n\/* Tint backgrounds for sections *\/\n.bg-cloud { background: var(--cloud); }\n.bg-lavender { background: var(--lavender); }\n.bg-mint { background: var(--mint); }\n.bg-ink { background: var(--ink); color: var(--white); }\n.bg-ink h1, .bg-ink h2, .bg-ink h3 { color: var(--white); }\n\n\/* Checkmark list *\/\n.checklist { list-style: none; padding: 0; margin: 0; }\n.checklist li {\n padding: 10px 0 10px 34px;\n position: relative;\n line-height: 1.55;\n font-size: 1rem;\n}\n.checklist li::before {\n content: '';\n position: absolute; left: 0; top: 14px;\n width: 20px; height: 20px;\n background: var(--emerald);\n border-radius: 50%;\n background-image: url(\"data:image\/svg+xml;utf8,<svg xmlns='http:\/\/www.w3.org\/2000\/svg' viewBox='0 0 12 12'><path fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M2.5 6.5 L5 9 L9.5 3.5'\/><\/svg>\");\n background-size: 13px 13px;\n background-position: center;\n background-repeat: no-repeat;\n}\n\n\/* Forms *\/\n.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-bottom: 20px; }\n@media (max-width: 600px) { .form-row { grid-template-columns: 1fr; gap: 16px; margin-bottom: 16px; } }\n\n.field {\n display: block;\n width: 100%;\n padding: 15px 17px;\n font-family: inherit;\n font-size: 1.02rem;\n color: var(--ink-body);\n background: var(--white);\n border: 1.5px solid var(--line-strong);\n border-radius: var(--r-md);\n transition: border-color .15s ease;\n}\n.field:focus { outline: 0; border-color: var(--indigo); box-shadow: 0 0 0 3px rgba(28,22,145,.12); }\n.label {\n display: block;\n font-size: .92rem;\n font-weight: 600;\n color: var(--ink-body);\n margin-bottom: 8px;\n letter-spacing: .01em;\n}\ntextarea.field { min-height: 160px; resize: vertical; }\n\n\/* Scientific accent \u2014 small molecule chip *\/\n.mol-chip {\n display: inline-flex; align-items: baseline; gap: 6px;\n padding: 4px 11px;\n background: var(--ink);\n color: var(--white);\n border-radius: 4px;\n font-family: var(--f-mono);\n font-size: .85rem;\n font-weight: 500;\n letter-spacing: .02em;\n}\n\n\/* Accordion \/ expandable *\/\n.timeline {\n position: relative;\n padding-left: 32px;\n}\n.timeline::before {\n content: ''; position: absolute;\n left: 7px; top: 6px; bottom: 6px;\n width: 2px;\n background: linear-gradient(180deg, var(--indigo) 0%, var(--violet) 50%, var(--magenta) 100%);\n border-radius: 2px;\n}\n.timeline-item { position: relative; padding-bottom: 32px; }\n.timeline-item::before {\n content: ''; position: absolute;\n left: -32px; top: 6px;\n width: 16px; height: 16px;\n background: var(--white);\n border: 3px solid var(--indigo);\n border-radius: 50%;\n}\n.timeline-item:last-child { padding-bottom: 0; }\n.timeline-date {\n font-family: var(--f-mono);\n font-size: .88rem;\n color: var(--violet);\n font-weight: 600;\n text-transform: uppercase;\n letter-spacing: .06em;\n margin-bottom: 6px;\n}\n.timeline-title { font-weight: 700; font-size: 1.15rem; color: var(--ink); margin-bottom: 6px; }\n.timeline-body { color: var(--ink-muted); font-size: 1rem; line-height: 1.6; }\n\n\/* Legal\/disclaimer microcopy *\/\n.fine { font-size: .88rem; color: var(--ink-muted); line-height: 1.6; }\n\n\/* ========== RESPONSIVE FINE-TUNING ========== *\/\n\n\/* Tablet tuning *\/\n@media (max-width: 1024px) {\n .hero { padding: clamp(4rem, 8vw, 6rem) 0 clamp(3rem, 6vw, 5rem); }\n}\n\n\/* Mobile tuning \u2014 < 640px *\/\n@media (max-width: 640px) {\n h1 { font-size: clamp(2.1rem, 9vw, 3rem); }\n h2 { font-size: clamp(1.65rem, 6.5vw, 2.2rem); }\n h3 { font-size: 1.25rem; }\n .lead { font-size: 1.08rem; }\n .hero { padding: 3.5rem 0 3rem; }\n .hero .lead { font-size: 1.08rem; }\n .section { padding: 3.5rem 0; }\n .section-sm { padding: 2.5rem 0; }\n .card, .pillar { padding: 24px; }\n .btn { padding: 14px 22px; font-size: .95rem; }\n .stat-value { font-size: clamp(2.2rem, 10vw, 2.8rem); }\n}\n\n\/* Small mobile \u2014 < 380px *\/\n@media (max-width: 380px) {\n body { font-size: 15px; }\n h1 { font-size: 2rem; }\n .wrap, .narrow { padding: 0 16px; }\n .hero { padding: 3rem 0 2.5rem; }\n}\n\n\/* Safety: horizontal overflow prevention *\/\nhtml, body { overflow-x: hidden; max-width: 100%; }\nimg, svg, video { max-width: 100%; height: auto; }\ntable { max-width: 100%; }\n\n<\/style>\n<style>\n \/* ---- brand page\u2013specific additions ---- *\/\n .brand-hero {\n background: var(--gradient-hero);\n color: var(--white);\n padding: clamp(5rem, 10vw, 8rem) 0 clamp(4rem, 8vw, 6rem);\n position: relative;\n overflow: hidden;\n }\n .brand-hero::before {\n content: \"\";\n position: absolute; inset: 0;\n background:\n radial-gradient(circle at 15% 20%, rgba(139,79,216,.25), transparent 45%),\n radial-gradient(circle at 85% 80%, rgba(200,80,220,.18), transparent 45%);\n pointer-events: none;\n }\n .brand-hero > .wrap { position: relative; z-index: 1; }\n .brand-hero h1 { color: var(--white); font-size: clamp(2.6rem, 5.5vw, 4.4rem); line-height: 1.05; }\n .brand-hero h1 em { background: var(--gradient-accent); -webkit-background-clip: text; background-clip: text; color: transparent; font-style: italic; }\n .brand-hero .lead { color: rgba(255,255,255,.78); font-size: 1.2rem; max-width: 58ch; }\n\n \/* layout with side nav *\/\n .brand-layout {\n display: grid;\n grid-template-columns: 220px minmax(0, 1fr);\n gap: 72px;\n padding: clamp(3rem, 6vw, 5rem) 0;\n align-items: start;\n }\n .brand-sidenav {\n position: sticky; top: 100px;\n border-left: 1px solid var(--line);\n padding-left: 20px;\n font-size: .85rem;\n }\n .brand-sidenav .label {\n display: block;\n font-size: .7rem;\n font-weight: 700;\n text-transform: uppercase;\n letter-spacing: .14em;\n color: var(--violet);\n margin-bottom: 12px;\n }\n .brand-sidenav a {\n display: block;\n padding: 8px 0;\n color: var(--ink-muted);\n border-bottom: 1px solid transparent;\n transition: color .15s;\n font-weight: 500;\n }\n .brand-sidenav a:hover { color: var(--indigo); }\n .brand-sidenav a.active { color: var(--indigo); font-weight: 600; }\n\n .brand-section {\n margin-bottom: 96px;\n scroll-margin-top: 96px;\n }\n .brand-section:last-child { margin-bottom: 0; }\n .brand-section .eyebrow { margin-bottom: 16px; }\n .brand-section h2 {\n font-size: clamp(2rem, 3.8vw, 2.8rem);\n letter-spacing: -.01em;\n margin-bottom: 18px;\n color: var(--ink);\n }\n .brand-section > .intro {\n font-size: 1.12rem;\n line-height: 1.65;\n color: var(--ink-muted);\n max-width: 65ch;\n margin-bottom: 36px;\n }\n .brand-section h3 {\n font-size: 1.25rem;\n font-weight: 700;\n color: var(--ink);\n margin: 40px 0 14px;\n letter-spacing: -.005em;\n }\n\n \/* logo showcase *\/\n .logo-frame {\n background: var(--white);\n border: 1px solid var(--line);\n border-radius: var(--r-lg);\n padding: 80px 32px;\n display: flex; align-items: center; justify-content: center;\n margin-bottom: 20px;\n }\n .logo-frame img { max-height: 120px; width: auto; }\n .logo-frame.is-ink { background: var(--ink); border-color: var(--ink); }\n .logo-frame.is-ink img { filter: brightness(0) invert(1); }\n .logo-frame.is-lav { background: var(--lavender); border-color: transparent; }\n .logo-grid {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 16px;\n margin-top: 16px;\n }\n .logo-grid .cap {\n font-family: var(--f-mono);\n font-size: .78rem;\n color: var(--ink-muted);\n text-align: center;\n margin-top: 6px;\n }\n .logo-frame-sm { padding: 40px 20px; }\n .logo-frame-sm img { max-height: 64px; }\n\n \/* do\/don't cards *\/\n .rules-grid {\n display: grid;\n grid-template-columns: repeat(2, 1fr);\n gap: 20px;\n margin-top: 24px;\n }\n .rule-card {\n border-radius: var(--r-lg);\n padding: 24px 26px;\n border: 1px solid var(--line);\n }\n .rule-card h4 {\n display: flex; align-items: center; gap: 10px;\n margin: 0 0 14px;\n font-size: 1rem;\n font-weight: 700;\n letter-spacing: .02em;\n }\n .rule-card.do { background: var(--mint); border-color: transparent; }\n .rule-card.do h4 { color: var(--emerald); }\n .rule-card.dont { background: #FDECEC; border-color: transparent; }\n .rule-card.dont h4 { color: #C8102E; }\n .rule-card ul {\n margin: 0; padding: 0; list-style: none;\n font-size: .95rem;\n line-height: 1.55;\n color: var(--ink-body);\n }\n .rule-card li {\n padding-left: 22px;\n position: relative;\n margin-bottom: 10px;\n }\n .rule-card li:last-child { margin-bottom: 0; }\n .rule-card.do li::before {\n content: \"\u2713\";\n position: absolute; left: 0; top: -1px;\n color: var(--emerald);\n font-weight: 700;\n }\n .rule-card.dont li::before {\n content: \"\u2715\";\n position: absolute; left: 0; top: -1px;\n color: #C8102E;\n font-weight: 700;\n }\n\n \/* color system *\/\n .swatch-grid {\n display: grid;\n grid-template-columns: repeat(4, 1fr);\n gap: 16px;\n margin-top: 20px;\n }\n .swatch {\n border-radius: var(--r-lg);\n padding: 24px;\n min-height: 200px;\n display: flex; flex-direction: column; justify-content: flex-end;\n position: relative;\n overflow: hidden;\n box-shadow: var(--shadow-sm);\n }\n .swatch.on-dark { color: var(--white); }\n .swatch.on-dark .swatch-sub { color: rgba(255,255,255,.75); }\n .swatch.on-light { color: var(--ink); border: 1px solid var(--line); }\n .swatch.on-light .swatch-sub { color: var(--ink-muted); }\n .swatch-name { font-size: 1.15rem; font-weight: 700; letter-spacing: -.01em; }\n .swatch-role {\n font-size: .78rem;\n text-transform: uppercase;\n letter-spacing: .1em;\n margin-top: 4px;\n opacity: .85;\n }\n .swatch-meta {\n font-family: var(--f-mono);\n font-size: .8rem;\n margin-top: 14px;\n line-height: 1.55;\n }\n .swatch-sub { font-size: .78rem; }\n\n \/* gradient band *\/\n .gradient-band {\n height: 72px;\n border-radius: var(--r-lg);\n background: linear-gradient(90deg, var(--violet) 0%, var(--magenta) 100%);\n margin: 16px 0 8px;\n position: relative;\n box-shadow: var(--shadow-sm);\n }\n .gradient-band::before, .gradient-band::after {\n position: absolute;\n bottom: -24px;\n font-family: var(--f-mono);\n font-size: .78rem;\n color: var(--ink-muted);\n }\n .gradient-band::before { content: \"0% \u00b7 #8B4FD8\"; left: 0; }\n .gradient-band::after { content: \"100% \u00b7 #C850DC\"; right: 0; }\n\n \/* contrast table *\/\n .contrast-tbl { width: 100%; border-collapse: separate; border-spacing: 0; border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; }\n .contrast-tbl th {\n background: var(--indigo);\n color: var(--white);\n text-align: left;\n padding: 14px 20px;\n font-size: .82rem;\n text-transform: uppercase;\n letter-spacing: .08em;\n }\n .contrast-tbl td { padding: 14px 20px; border-bottom: 1px solid var(--line); font-size: .95rem; }\n .contrast-tbl tr:last-child td { border-bottom: 0; }\n .contrast-tbl .sample {\n display: inline-block;\n padding: 6px 14px;\n border-radius: 6px;\n font-weight: 600;\n }\n .contrast-tbl .ratio { font-family: var(--f-mono); }\n .contrast-tbl .pass { color: var(--emerald); font-weight: 700; }\n .contrast-tbl .warn { color: #B07A00; font-weight: 600; }\n\n \/* type specimens *\/\n .type-specimen {\n border: 1px solid var(--line);\n border-radius: var(--r-lg);\n padding: 40px 36px;\n margin-bottom: 16px;\n background: var(--white);\n }\n .type-specimen .meta {\n font-family: var(--f-mono);\n font-size: .75rem;\n color: var(--ink-muted);\n letter-spacing: .04em;\n margin-bottom: 12px;\n display: flex; gap: 16px;\n }\n .type-specimen .meta span::before { content: \"\u00b7 \"; color: var(--line-strong); }\n .type-specimen .meta span:first-child::before { content: \"\"; }\n\n .type-display-xl { font-family: var(--f-display); font-size: 64px; line-height: 1.05; font-weight: 700; color: var(--ink); margin: 0; letter-spacing: -.015em; }\n .type-display-lg { font-family: var(--f-display); font-size: 48px; line-height: 1.1; font-weight: 700; color: var(--ink); margin: 0; letter-spacing: -.01em; }\n .type-display-md { font-family: var(--f-display); font-size: 36px; line-height: 1.15; font-weight: 600; color: var(--ink); margin: 0; }\n .type-heading { font-family: var(--f-sans); font-size: 24px; line-height: 1.3; font-weight: 600; color: var(--ink); margin: 0; }\n .type-subhead { font-family: var(--f-sans); font-size: 20px; line-height: 1.35; font-weight: 600; color: var(--ink); margin: 0; }\n .type-body-lg { font-family: var(--f-sans); font-size: 18px; line-height: 1.55; color: var(--ink-body); margin: 0; }\n .type-body { font-family: var(--f-sans); font-size: 16px; line-height: 1.6; color: var(--ink-body); margin: 0; }\n .type-label { font-family: var(--f-sans); font-size: 13px; line-height: 1.4; font-weight: 700; color: var(--violet); text-transform: uppercase; letter-spacing: .08em; margin: 0; }\n .type-mono { font-family: var(--f-mono); font-size: 14px; line-height: 1.5; font-weight: 500; color: var(--ink-body); margin: 0; }\n\n .family-grid {\n display: grid;\n grid-template-columns: repeat(3, 1fr);\n gap: 20px;\n margin-top: 24px;\n }\n .family-card {\n border: 1px solid var(--line);\n border-radius: var(--r-lg);\n padding: 32px 28px;\n background: var(--white);\n }\n .family-card .family-name {\n font-family: var(--f-display);\n font-size: 44px;\n line-height: 1;\n color: var(--indigo);\n margin: 0 0 8px;\n font-weight: 700;\n }\n .family-card.mono .family-name { font-family: var(--f-mono); font-size: 28px; letter-spacing: -.02em; }\n .family-card.body .family-name { font-family: var(--f-sans); }\n .family-card .family-role { font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--violet); margin-bottom: 18px; }\n .family-card .family-desc { font-size: .92rem; line-height: 1.55; color: var(--ink-muted); }\n\n \/* voice: approved vs avoid *\/\n .voice-grid {\n display: grid;\n grid-template-columns: repeat(2, 1fr);\n gap: 20px;\n margin-top: 20px;\n }\n .voice-card {\n border-radius: var(--r-lg);\n padding: 28px 30px;\n }\n .voice-card.approved {\n background: var(--mint);\n border-left: 4px solid var(--emerald);\n }\n .voice-card.avoid {\n background: #FDECEC;\n border-left: 4px solid #C8102E;\n }\n .voice-card h4 {\n margin: 0 0 14px;\n font-size: .75rem;\n font-weight: 800;\n letter-spacing: .12em;\n text-transform: uppercase;\n }\n .voice-card.approved h4 { color: var(--emerald); }\n .voice-card.avoid h4 { color: #C8102E; }\n .voice-card p {\n margin: 0 0 14px;\n font-size: 1rem;\n line-height: 1.55;\n color: var(--ink-body);\n }\n .voice-card p:last-child { margin-bottom: 0; }\n .voice-card em { font-style: italic; color: var(--ink); font-weight: 500; }\n\n \/* callout *\/\n .callout {\n padding: 24px 28px;\n border-radius: var(--r-lg);\n border-left: 6px solid var(--violet);\n background: var(--lavender);\n margin: 24px 0;\n }\n .callout.mint { background: var(--mint); border-left-color: var(--emerald); }\n .callout-title {\n font-size: .72rem;\n font-weight: 800;\n letter-spacing: .14em;\n text-transform: uppercase;\n color: var(--violet);\n margin-bottom: 10px;\n }\n .callout.mint .callout-title { color: var(--emerald); }\n .callout p { margin: 0; font-size: 1rem; line-height: 1.6; color: var(--ink-body); }\n .callout p + p { margin-top: 12px; }\n\n \/* design tokens table *\/\n .tokens-tbl { width: 100%; border-collapse: separate; border-spacing: 0; border: 1px solid var(--line); border-radius: var(--r-lg); overflow: hidden; }\n .tokens-tbl th {\n background: var(--ink);\n color: var(--white);\n text-align: left;\n padding: 14px 20px;\n font-size: .78rem;\n text-transform: uppercase;\n letter-spacing: .08em;\n font-family: var(--f-mono);\n }\n .tokens-tbl td { padding: 12px 20px; border-bottom: 1px solid var(--line); font-family: var(--f-mono); font-size: .85rem; }\n .tokens-tbl td:first-child { color: var(--violet); }\n .tokens-tbl td:nth-child(2) { color: var(--ink); font-weight: 500; }\n .tokens-tbl td:nth-child(3) { color: var(--ink-muted); font-family: var(--f-sans); }\n .tokens-tbl tr:last-child td { border-bottom: 0; }\n .tokens-tbl .swatch-dot {\n display: inline-block;\n width: 14px; height: 14px;\n border-radius: 4px;\n margin-right: 10px;\n vertical-align: -3px;\n border: 1px solid rgba(0,0,0,.08);\n }\n\n \/* applications *\/\n .app-grid {\n display: grid;\n grid-template-columns: repeat(2, 1fr);\n gap: 20px;\n margin-top: 24px;\n }\n .app-card {\n border: 1px solid var(--line);\n border-radius: var(--r-lg);\n padding: 28px 30px;\n background: var(--white);\n }\n .app-card h4 {\n margin: 0 0 12px;\n font-size: 1.1rem;\n font-weight: 700;\n color: var(--indigo);\n }\n .app-card p { margin: 0 0 10px; font-size: .95rem; line-height: 1.55; color: var(--ink-body); }\n .app-card ul { margin: 0; padding-left: 20px; color: var(--ink-body); font-size: .92rem; line-height: 1.6; }\n .app-card li { margin-bottom: 6px; }\n\n \/* email signature mock *\/\n .sig-mock {\n background: var(--cloud);\n border: 1px solid var(--line);\n border-radius: var(--r-md);\n padding: 22px 24px;\n font-family: Arial, sans-serif;\n margin-top: 14px;\n }\n .sig-mock .n { font-size: 15px; font-weight: 700; color: var(--ink); }\n .sig-mock .t { font-size: 14px; color: var(--ink-muted); margin-top: 2px; }\n .sig-mock .c { font-size: 14px; color: var(--indigo); margin-top: 2px; }\n .sig-mock .b { font-size: 12px; color: var(--ink-muted); font-style: italic; margin-top: 8px; }\n\n \/* responsive *\/\n @media (max-width: 960px) {\n .brand-layout { grid-template-columns: 1fr; gap: 40px; }\n .brand-sidenav { position: static; border-left: 0; border-top: 1px solid var(--line); padding-left: 0; padding-top: 16px; display: none; }\n .swatch-grid { grid-template-columns: repeat(2, 1fr); }\n .family-grid { grid-template-columns: 1fr; }\n .rules-grid, .voice-grid, .app-grid { grid-template-columns: 1fr; }\n .logo-grid { grid-template-columns: 1fr; }\n }\n<\/style>\n<\/head>\n<body>\n\n<!-- =================== NAV =================== -->\n<header class=\"nav\">\n <div class=\"nav-inner\">\n <a class=\"nav-brand\" href=\"index.html\" aria-label=\"Azuriya Pharma home\">\n <img decoding=\"async\" src=\"https:\/\/azuriyapharma.co\/wp-content\/uploads\/2026\/04\/Azuryia-Logo-No-Background-e1776863837551.png\" alt=\"Azuriya Pharma\">\n <\/a>\n <nav><ul class=\"nav-links\">\n <li><a href=\"index.html\">Home<\/a><\/li>\n <li><a href=\"science.html\">Science & Pipeline<\/a><\/li>\n <li><a href=\"publications.html\">Publications<\/a><\/li>\n <li><a href=\"about.html\">About<\/a><\/li>\n <li><a href=\"investors.html\">Investors<\/a><\/li>\n <\/ul><\/nav>\n <a class=\"nav-cta\" href=\"contact.html\">Contact<\/a>\n <\/div>\n<\/header>\n\n<!-- =================== HERO =================== -->\n<section class=\"brand-hero\">\n <div class=\"wrap\">\n <span class=\"eyebrow\" style=\"color:#D6C3F5;\">Brand Guidelines \u00b7 Version 1.0<\/span>\n <h1 style=\"margin-top:22px;\">\n A working reference for<br>\n <em>identity, color, type,<\/em><br>\n and voice.\n <\/h1>\n <p class=\"lead\" style=\"margin-top:22px;\">\n Azuriya is a clinical-stage biopharmaceutical company developing\n APX3330 \u2014 a first-in-class oral APE1\/Ref-1 inhibitor for IBD. This page\n codifies how the company looks and sounds, so that every deck, page,\n and poster lands with the same precision.\n <\/p>\n <\/div>\n<\/section>\n\n<!-- =================== MAIN =================== -->\n<section class=\"section\" style=\"padding-top:0;\">\n <div class=\"wrap\">\n <div class=\"brand-layout\">\n\n <!-- ===== sidebar ===== -->\n <aside class=\"brand-sidenav\">\n <span class=\"label\">On this page<\/span>\n <a href=\"#intro\">Introduction<\/a>\n <a href=\"#logo\">The Logo<\/a>\n <a href=\"#color\">Color<\/a>\n <a href=\"#typography\">Typography<\/a>\n <a href=\"#voice\">Voice & Messaging<\/a>\n <a href=\"#applications\">Applications<\/a>\n <a href=\"#tokens\">Design Tokens<\/a>\n <\/aside>\n\n <!-- ===== content ===== -->\n <main>\n\n <!-- ============ INTRO ============ -->\n <section class=\"brand-section\" id=\"intro\">\n <span class=\"eyebrow\">00 \u00b7 Introduction<\/span>\n <h2>The Azuriya identity<\/h2>\n <p class=\"intro\">\n The brand has to communicate two things at once: the precision of a\n serious clinical team, and the ambition of a company that thinks\n inflammation can be reset at its molecular thermostat. This page is\n the working reference for doing that consistently.\n <\/p>\n\n <div class=\"callout\">\n <div class=\"callout-title\">Who this is for<\/div>\n <p>\n Anyone producing externally-facing Azuriya materials \u2014 slide decks,\n the website, investor one-pagers, scientific posters, contract\n collateral, social, and press. Follow these rules by default;\n deviations require CEO sign-off.\n <\/p>\n <\/div>\n\n <h3>Brand pillars<\/h3>\n <ul style=\"line-height:1.7; color:var(--ink-body); padding-left:22px;\">\n <li><strong style=\"color:var(--indigo);\">Precise.<\/strong> Name the mechanism, cite the number, reference the trial. Avoid adjectives where a datum will do.<\/li>\n <li><strong style=\"color:var(--indigo);\">Reserved.<\/strong> We describe what has been observed in the data we have. We do not extrapolate. Hedge language \u2014 observed, supports, suggests \u2014 is appropriate in preclinical and early-clinical contexts.<\/li>\n <li><strong style=\"color:var(--indigo);\">Ambitious.<\/strong> A small flourish \u2014 the gradient, a single italic phrase \u2014 signals that this is not a me-too program. Used sparingly.<\/li>\n <\/ul>\n <\/section>\n\n <!-- ============ LOGO ============ -->\n <section class=\"brand-section\" id=\"logo\">\n <span class=\"eyebrow\">01 \u00b7 Identity<\/span>\n <h2>The logo<\/h2>\n <p class=\"intro\">\n The Azuriya mark is composed of three elements: the indigo wordmark,\n the emerald arc, and the violet\u2192magenta gradient underline. The three\n are designed to be seen together. The arc reads as forward motion;\n the gradient underline as a pulse of signal. The wordmark carries the\n institutional weight.\n <\/p>\n\n <div class=\"logo-frame\">\n <img decoding=\"async\" src=\"https:\/\/azuriyapharma.co\/wp-content\/uploads\/2026\/04\/Azuryia-Logo-No-Background-e1776863837551.png\" alt=\"Azuriya Pharma logo\">\n <\/div>\n\n <h3>Backgrounds<\/h3>\n <div class=\"logo-grid\">\n <div>\n <div class=\"logo-frame logo-frame-sm\">\n <img decoding=\"async\" src=\"https:\/\/azuriyapharma.co\/wp-content\/uploads\/2026\/04\/Azuryia-Logo-No-Background-e1776863837551.png\" alt=\"logo on white\">\n <\/div>\n <div class=\"cap\">Preferred \u2014 White<\/div>\n <\/div>\n <div>\n <div class=\"logo-frame logo-frame-sm is-lav\">\n <img decoding=\"async\" src=\"https:\/\/azuriyapharma.co\/wp-content\/uploads\/2026\/04\/Azuryia-Logo-No-Background-e1776863837551.png\" alt=\"logo on lavender\">\n <\/div>\n <div class=\"cap\">Preferred \u2014 Lavender #F0EBFA<\/div>\n <\/div>\n <div>\n <div class=\"logo-frame logo-frame-sm is-ink\">\n <img decoding=\"async\" src=\"https:\/\/azuriyapharma.co\/wp-content\/uploads\/2026\/04\/Azuryia-Logo-No-Background-e1776863837551.png\" alt=\"logo reversed on ink\">\n <\/div>\n <div class=\"cap\">Acceptable \u2014 Ink (reversed)<\/div>\n <\/div>\n <\/div>\n\n <h3>Clear space & minimum size<\/h3>\n <p style=\"font-size:.98rem; line-height:1.6; color:var(--ink-body);\">\n Maintain clear space on all four sides of the mark equal to the\n cap-height of the letter <em>A<\/em> in \"Azuriya\". Never allow other\n content \u2014 images, text, graphic elements, page edges \u2014 to enter\n this zone.\n <\/p>\n <ul style=\"line-height:1.7; color:var(--ink-body); padding-left:22px; margin-top:10px;\">\n <li><strong>Digital:<\/strong> minimum <span class=\"mono\">120 px<\/span> wide. Below this the gradient underline becomes indistinct.<\/li>\n <li><strong>Print:<\/strong> minimum <span class=\"mono\">1.0 in<\/span> \/ <span class=\"mono\">25 mm<\/span> wide.<\/li>\n <li><strong>Favicon \/ app icons:<\/strong> use the isolated emerald arc on an indigo square. Full wordmark is not used below <span class=\"mono\">64 px<\/span>.<\/li>\n <\/ul>\n\n <h3>Usage rules<\/h3>\n <div class=\"rules-grid\">\n <div class=\"rule-card do\">\n <h4>\u2713 Do<\/h4>\n <ul>\n <li>Keep the three elements together and in their specified proportions.<\/li>\n <li>Use the reversed (white wordmark) version on ink and indigo backgrounds only.<\/li>\n <li>Ensure at least <span class=\"mono\">3:1<\/span> contrast between the wordmark and its background.<\/li>\n <li>Preserve clear space equal to the \"A\" cap-height.<\/li>\n <\/ul>\n <\/div>\n <div class=\"rule-card dont\">\n <h4>\u2715 Don't<\/h4>\n <ul>\n <li>Stretch, skew, rotate, or outline the mark.<\/li>\n <li>Change the color of the wordmark, arc, or gradient.<\/li>\n <li>Separate the three elements or recompose them.<\/li>\n <li>Apply drop shadows, glows, bevels, or filters.<\/li>\n <li>Pair the wordmark with a second logotype in a different typeface.<\/li>\n <\/ul>\n <\/div>\n <\/div>\n <\/section>\n\n <!-- ============ COLOR ============ -->\n <section class=\"brand-section\" id=\"color\">\n <span class=\"eyebrow\">02 \u00b7 Palette<\/span>\n <h2>Color<\/h2>\n <p class=\"intro\">\n The palette is pulled directly from the logo. Three families: brand\n core (indigo, emerald, violet\/magenta) for identity; surfaces (cloud,\n lavender, mint) for backgrounds; neutrals for text and lines. The\n color balance across any page should skew indigo-first, with emerald\n and the gradient used as accents rather than fields.\n <\/p>\n\n <h3>Brand core<\/h3>\n <div class=\"swatch-grid\">\n <div class=\"swatch on-dark\" style=\"background:#1C1691;\">\n <div>\n <div class=\"swatch-name\">Indigo<\/div>\n <div class=\"swatch-role\">Primary<\/div>\n <div class=\"swatch-meta\">\n #1C1691<br>\n <span class=\"swatch-sub\">Pantone 2735 C<\/span>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"swatch on-dark\" style=\"background:#14107A;\">\n <div>\n <div class=\"swatch-name\">Indigo Deep<\/div>\n <div class=\"swatch-role\">Hover<\/div>\n <div class=\"swatch-meta\">\n #14107A<br>\n <span class=\"swatch-sub\">Pantone 2736 C<\/span>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"swatch on-dark\" style=\"background:#0B0A4E;\">\n <div>\n <div class=\"swatch-name\">Ink<\/div>\n <div class=\"swatch-role\">Dark background<\/div>\n <div class=\"swatch-meta\">\n #0B0A4E<br>\n <span class=\"swatch-sub\">Pantone 2765 C<\/span>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"swatch on-dark\" style=\"background:#00A03C;\">\n <div>\n <div class=\"swatch-name\">Emerald<\/div>\n <div class=\"swatch-role\">Secondary<\/div>\n <div class=\"swatch-meta\">\n #00A03C<br>\n <span class=\"swatch-sub\">Pantone 355 C<\/span>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"swatch on-dark\" style=\"background:#14BE54;\">\n <div>\n <div class=\"swatch-name\">Emerald Bright<\/div>\n <div class=\"swatch-role\">Hover<\/div>\n <div class=\"swatch-meta\">\n #14BE54<br>\n <span class=\"swatch-sub\">Pantone 354 C<\/span>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"swatch on-dark\" style=\"background:#8B4FD8;\">\n <div>\n <div class=\"swatch-name\">Violet<\/div>\n <div class=\"swatch-role\">Gradient 0%<\/div>\n <div class=\"swatch-meta\">\n #8B4FD8<br>\n <span class=\"swatch-sub\">Pantone 2592 C<\/span>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"swatch on-dark\" style=\"background:#C850DC;\">\n <div>\n <div class=\"swatch-name\">Magenta<\/div>\n <div class=\"swatch-role\">Gradient 100%<\/div>\n <div class=\"swatch-meta\">\n #C850DC<br>\n <span class=\"swatch-sub\">Pantone 247 C<\/span>\n <\/div>\n <\/div>\n <\/div>\n <div class=\"swatch on-light\" style=\"background:#FFFFFF;\">\n <div>\n <div class=\"swatch-name\">White<\/div>\n <div class=\"swatch-role\">Base<\/div>\n <div class=\"swatch-meta\">\n #FFFFFF<br>\n <span class=\"swatch-sub\">\u2014<\/span>\n <\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <h3>Surfaces & neutrals<\/h3>\n <div class=\"swatch-grid\">\n <div class=\"swatch on-light\" style=\"background:#F7F8FC;\">\n <div>\n <div class=\"swatch-name\">Cloud<\/div>\n <div class=\"swatch-role\">Neutral surface<\/div>\n <div class=\"swatch-meta\">#F7F8FC<\/div>\n <\/div>\n <\/div>\n <div class=\"swatch on-light\" style=\"background:#F0EBFA;\">\n <div>\n <div class=\"swatch-name\">Lavender<\/div>\n <div class=\"swatch-role\">Corporate tint<\/div>\n <div class=\"swatch-meta\">#F0EBFA<\/div>\n <\/div>\n <\/div>\n <div class=\"swatch on-light\" style=\"background:#E6F7EC;\">\n <div>\n <div class=\"swatch-name\">Mint<\/div>\n <div class=\"swatch-role\">Science tint<\/div>\n <div class=\"swatch-meta\">#E6F7EC<\/div>\n <\/div>\n <\/div>\n <div class=\"swatch on-light\" style=\"background:#E4E4F0;\">\n <div>\n <div class=\"swatch-name\">Line<\/div>\n <div class=\"swatch-role\">Dividers<\/div>\n <div class=\"swatch-meta\">#E4E4F0<\/div>\n <\/div>\n <\/div>\n <\/div>\n\n <h3>Signature gradient<\/h3>\n <p style=\"font-size:.98rem; line-height:1.6; color:var(--ink-body); max-width:65ch;\">\n Linear, 90\u00b0 (left to right): <span class=\"mono\">#8B4FD8<\/span> at 0% \u2192\n <span class=\"mono\">#C850DC<\/span> at 100%. Used exclusively for the italic\n highlight phrase in hero H1s, the active-page underline in navigation,\n the left-border accent on featured callouts, and a single divider\n element between major sections.\n <\/p>\n <div class=\"gradient-band\"><\/div>\n <div style=\"height:34px;\"><\/div>\n\n <h3>Contrast & accessibility<\/h3>\n <table class=\"contrast-tbl\">\n <thead>\n <tr><th>Pairing<\/th><th>Sample<\/th><th>Ratio<\/th><th>WCAG<\/th><\/tr>\n <\/thead>\n <tbody>\n <tr>\n <td>Indigo on White<\/td>\n <td><span class=\"sample\" style=\"background:#FFF; color:#1C1691; border:1px solid var(--line);\">Aa<\/span><\/td>\n <td class=\"ratio\">13.4 : 1<\/td>\n <td class=\"pass\">AAA (all sizes)<\/td>\n <\/tr>\n <tr>\n <td>White on Indigo<\/td>\n <td><span class=\"sample\" style=\"background:#1C1691; color:#FFF;\">Aa<\/span><\/td>\n <td class=\"ratio\">13.4 : 1<\/td>\n <td class=\"pass\">AAA (all sizes)<\/td>\n <\/tr>\n <tr>\n <td>Ink (body) on White<\/td>\n <td><span class=\"sample\" style=\"background:#FFF; color:#1A1A2E; border:1px solid var(--line);\">Aa<\/span><\/td>\n <td class=\"ratio\">16.7 : 1<\/td>\n <td class=\"pass\">AAA (all sizes)<\/td>\n <\/tr>\n <tr>\n <td>Emerald on White<\/td>\n <td><span class=\"sample\" style=\"background:#FFF; color:#00A03C; border:1px solid var(--line);\">Aa<\/span><\/td>\n <td class=\"ratio\">4.5 : 1<\/td>\n <td class=\"pass\">AA (normal text)<\/td>\n <\/tr>\n <tr>\n <td>Violet on White<\/td>\n <td><span class=\"sample\" style=\"background:#FFF; color:#8B4FD8; border:1px solid var(--line);\">Aa<\/span><\/td>\n <td class=\"ratio\">4.8 : 1<\/td>\n <td class=\"warn\">Display only (\u2265 24 px)<\/td>\n <\/tr>\n <tr>\n <td>Magenta on White<\/td>\n <td><span class=\"sample\" style=\"background:#FFF; color:#C850DC; border:1px solid var(--line);\">Aa<\/span><\/td>\n <td class=\"ratio\">3.6 : 1<\/td>\n <td class=\"warn\">Large-text only<\/td>\n <\/tr>\n <\/tbody>\n <\/table>\n <\/section>\n\n <!-- ============ TYPOGRAPHY ============ -->\n <section class=\"brand-section\" id=\"typography\">\n <span class=\"eyebrow\">03 \u00b7 Type<\/span>\n <h2>Typography<\/h2>\n <p class=\"intro\">\n Two faces carry most of the identity. <em>Fraunces<\/em>, a variable\n serif with an optical-size axis, handles display. <em>Manrope<\/em>,\n a modern geometric sans, handles body. A monospace \u2014 <em>JetBrains\n Mono<\/em> \u2014 handles the technical spine: compound names, gene\n symbols, DOI \/ PMID, NCT numbers.\n <\/p>\n\n <div class=\"family-grid\">\n <div class=\"family-card\">\n <div class=\"family-name\">Fraunces<\/div>\n <div class=\"family-role\">Display<\/div>\n <div class=\"family-desc\">Variable serif. Page H1 and hero H1 at 48\u201364 px with opsz axis set to 144, weight 600\u2013700. Italic reserved for the gradient-highlighted phrase.<\/div>\n <\/div>\n <div class=\"family-card body\">\n <div class=\"family-name\" style=\"font-family:var(--f-sans);\">Manrope<\/div>\n <div class=\"family-role\">Body<\/div>\n <div class=\"family-desc\">All running copy, navigation, labels, buttons, forms, tables. Weight 400 for prose, 600 for UI labels, 700 for eyebrows.<\/div>\n <\/div>\n <div class=\"family-card mono\">\n <div class=\"family-name\">APX3330<\/div>\n <div class=\"family-role\">Mono \u2014 JetBrains Mono<\/div>\n <div class=\"family-desc\">Compound and target names, gene\/protein symbols (NF-\u03baB, HIF-1\u03b1), DOIs, PMIDs, NCT trial IDs, code-like sub-labels.<\/div>\n <\/div>\n <\/div>\n\n <h3>Type scale (desktop)<\/h3>\n\n <div class=\"type-specimen\">\n <div class=\"meta\"><span>display-xl<\/span><span>Fraunces<\/span><span>64 px<\/span><span>700<\/span><span>line-height 1.05<\/span><\/div>\n <p class=\"type-display-xl\">Targeting the upstream cause.<\/p>\n <\/div>\n <div class=\"type-specimen\">\n <div class=\"meta\"><span>display-lg<\/span><span>Fraunces<\/span><span>48 px<\/span><span>700<\/span><span>line-height 1.1<\/span><\/div>\n <p class=\"type-display-lg\">A thermostat for inflammation.<\/p>\n <\/div>\n <div class=\"type-specimen\">\n <div class=\"meta\"><span>display-md<\/span><span>Fraunces<\/span><span>36 px<\/span><span>600<\/span><span>line-height 1.15<\/span><\/div>\n <p class=\"type-display-md\">Mechanism, not a moment.<\/p>\n <\/div>\n <div class=\"type-specimen\">\n <div class=\"meta\"><span>heading<\/span><span>Manrope<\/span><span>24 px<\/span><span>600<\/span><span>line-height 1.3<\/span><\/div>\n <p class=\"type-heading\">Pipeline & patents through 2044+<\/p>\n <\/div>\n <div class=\"type-specimen\">\n <div class=\"meta\"><span>subhead<\/span><span>Manrope<\/span><span>20 px<\/span><span>600<\/span><span>line-height 1.35<\/span><\/div>\n <p class=\"type-subhead\">Four master transcription factors<\/p>\n <\/div>\n <div class=\"type-specimen\">\n <div class=\"meta\"><span>body-lg<\/span><span>Manrope<\/span><span>18 px<\/span><span>400<\/span><span>line-height 1.55<\/span><\/div>\n <p class=\"type-body-lg\">APX3330 is a late-stage, first-in-class oral small-molecule therapy that modulates APE1\/Ref-1 \u2014 the master transcription-factor regulator controlling NF-\u03baB, HIF-1\u03b1, STAT3, and AP-1.<\/p>\n <\/div>\n <div class=\"type-specimen\">\n <div class=\"meta\"><span>body<\/span><span>Manrope<\/span><span>16 px<\/span><span>400<\/span><span>line-height 1.6<\/span><\/div>\n <p class=\"type-body\">Safety across four trials in ~400 patients, 600 mg RP2D, zero treatment-related SAEs observed. Composition-of-matter and method-of-use protection through 2044+ across seven patent families.<\/p>\n <\/div>\n <div class=\"type-specimen\">\n <div class=\"meta\"><span>label<\/span><span>Manrope<\/span><span>13 px<\/span><span>700<\/span><span>uppercase \u00b7 track 0.08em<\/span><\/div>\n <p class=\"type-label\">Phase 2a \u00b7 Australia \u00b7 2026<\/p>\n <\/div>\n <div class=\"type-specimen\">\n <div class=\"meta\"><span>mono<\/span><span>JetBrains Mono<\/span><span>14 px<\/span><span>500<\/span><span>line-height 1.5<\/span><\/div>\n <p class=\"type-mono\">APX3330 \u00b7 APE1\/Ref-1 \u00b7 NCT03375086 \u00b7 DOI 10.1038\/s42003-026-09860-z<\/p>\n <\/div>\n\n <h3>Mobile & fallbacks<\/h3>\n <p style=\"font-size:.98rem; line-height:1.65; color:var(--ink-body); max-width:65ch;\">\n On mobile, display sizes scale down: display-xl \u2192 40 px, display-lg \u2192 32 px, display-md \u2192 26 px; body stays at 15 px with line-heights loosened by +0.05.\n Web-safe fallbacks if the primary family fails to load:\n <span class=\"mono\">Fraunces \u2192 Georgia \u2192 serif<\/span>,\n <span class=\"mono\">Manrope \u2192 system-ui \u2192 sans-serif<\/span>,\n <span class=\"mono\">JetBrains Mono \u2192 SF Mono \u2192 Menlo \u2192 monospace<\/span>.\n <\/p>\n <\/section>\n\n <!-- ============ VOICE ============ -->\n <section class=\"brand-section\" id=\"voice\">\n <span class=\"eyebrow\">04 \u00b7 Tone<\/span>\n <h2>Voice & messaging<\/h2>\n <p class=\"intro\">\n The Azuriya voice is that of a clinical team that respects its\n audience. It does not oversell. It does not hedge when it has data.\n It uses the specific word (mechanism, pathway, master regulator)\n rather than the comforting one (approach, target, key factor).\n <\/p>\n\n <h3>Write this way<\/h3>\n <ul style=\"line-height:1.7; color:var(--ink-body); padding-left:22px;\">\n <li><strong style=\"color:var(--indigo);\">Specific numbers beat adjectives.<\/strong> \"~400 patients dosed across four trials\" is better than \"extensively studied.\" \"2044+ patent life\" is better than \"long patent runway.\"<\/li>\n <li><strong style=\"color:var(--indigo);\">Mechanism first.<\/strong> Lead with APE1\/Ref-1 inhibition and the four master transcription factors (NF-\u03baB, HIF-1\u03b1, STAT3, AP-1). Don't lead with \"novel\" or \"first-in-class\" as abstract claims.<\/li>\n <li><strong style=\"color:var(--indigo);\">Active voice, short clauses.<\/strong> \"APX3330 inhibits APE1\/Ref-1\" \u2014 not \"APE1\/Ref-1 is inhibited by APX3330 via a redox-regulatory mechanism involving\u2026\"<\/li>\n <li><strong style=\"color:var(--indigo);\">Name the trial.<\/strong> <span class=\"mono\">NCT03375086<\/span>, <span class=\"mono\">ZETA-1<\/span>, Phase 1 HV (Eisai). Numbers and identifiers are citable.<\/li>\n <\/ul>\n\n <h3>Approved positioning vs. avoid<\/h3>\n <div class=\"voice-grid\">\n <div class=\"voice-card approved\">\n <h4>\u2713 Approved positioning<\/h4>\n <p>First-in-class oral APE1\/Ref-1 inhibitor for inflammatory bowel disease.<\/p>\n <p>Upstream of the four master transcription factors that drive IBD inflammation.<\/p>\n <p><em>~400 patients dosed across prior clinical studies; 600 mg RP2D; no treatment-related SAEs observed.<\/em><\/p>\n <p>Composition-of-matter and method-of-use protection through 2044+ across seven patent families.<\/p>\n <\/div>\n <div class=\"voice-card avoid\">\n <h4>\u2715 Avoid in external copy<\/h4>\n <p>\"Cure for IBD\" \u00b7 \"Guaranteed safety profile\" \u00b7 \"Revolutionary\" \u00b7 \"Game-changing\"<\/p>\n <p>\"Better than [branded competitor]\" without a direct head-to-head or a clear denominator.<\/p>\n <p>\"Platform\" applied to a single compound.<\/p>\n <p>Any efficacy claim in UC patients prior to Phase 2a data. Specific deal-value figures for comparables pulled from non-public sources.<\/p>\n <\/div>\n <\/div>\n <\/section>\n\n <!-- ============ APPLICATIONS ============ -->\n <section class=\"brand-section\" id=\"applications\">\n <span class=\"eyebrow\">05 \u00b7 Digital & Print<\/span>\n <h2>Applications<\/h2>\n <p class=\"intro\">\n A small set of canonical applications. The reference HTML templates\n on this site are the source of truth for any digital application \u2014\n when in doubt, match the page.\n <\/p>\n\n <div class=\"app-grid\">\n <div class=\"app-card\">\n <h4>Website<\/h4>\n <p>Primary application; reference HTML templates are the source of truth for tokens and components.<\/p>\n <ul>\n <li>Hero sections use the ink\u2192indigo gradient background.<\/li>\n <li>All other sections use white or cloud.<\/li>\n <li>Navigation is sticky with a blurred backdrop; active-page indicator is a 2-px gradient underline.<\/li>\n <\/ul>\n <\/div>\n\n <div class=\"app-card\">\n <h4>Slide decks<\/h4>\n <p>Deck template follows the same tokens as the site.<\/p>\n <ul>\n <li>Title slides: ink background with knockout logo.<\/li>\n <li>Body slides: white background, indigo H1 in Fraunces 36 pt, Manrope body 18 pt.<\/li>\n <li>Data slides: tables use indigo header rows; body rows alternate white and cloud.<\/li>\n <\/ul>\n <\/div>\n\n <div class=\"app-card\">\n <h4>Investor materials<\/h4>\n <ul>\n <li>One-pagers use the lavender-tinted card layout with indigo H1 and emerald accent numerics.<\/li>\n <li>Financials and market sizing shown as mono-typeset values in JetBrains Mono for typographic distinction.<\/li>\n <li>Safe-harbor \/ forward-looking disclaimer set in Manrope 9 pt at the foot of every page.<\/li>\n <\/ul>\n <\/div>\n\n <div class=\"app-card\">\n <h4>Print & social<\/h4>\n <ul>\n <li>Business cards: 3.5 \u00d7 2 in, indigo reverse with knockout logo on front; white with full-color logo on back.<\/li>\n <li>Letterhead: logo top-left with 1 in margin; footer with a single indigo 1-pt rule above the address.<\/li>\n <li>Social avatars: isolated emerald arc on indigo square, 400 \u00d7 400 px.<\/li>\n <\/ul>\n <\/div>\n <\/div>\n\n <h3>Email signature<\/h3>\n <p style=\"font-size:.98rem; line-height:1.6; color:var(--ink-body);\">\n Standardized signature block for all <span class=\"mono\">@azuriyapharma.com<\/span> addresses:\n <\/p>\n <div class=\"sig-mock\">\n <div class=\"n\">Firstname Lastname<\/div>\n <div class=\"t\">Title \u00b7 Azuriya Pharma<\/div>\n <div class=\"c\">name@azuriyapharma.com \u00b7 azuriyapharma.com<\/div>\n <div class=\"b\">Developing APX3330 \u2014 a first-in-class oral APE1\/Ref-1 inhibitor for IBD.<\/div>\n <\/div>\n <\/section>\n\n <!-- ============ TOKENS ============ -->\n <section class=\"brand-section\" id=\"tokens\">\n <span class=\"eyebrow\">06 \u00b7 Reference<\/span>\n <h2>Design tokens<\/h2>\n <p class=\"intro\">\n CSS custom properties published in <span class=\"mono\">styles.css<\/span>.\n These are the canonical values \u2014 anything produced for Azuriya should match.\n <\/p>\n\n <table class=\"tokens-tbl\">\n <thead>\n <tr><th>Token<\/th><th>Value<\/th><th>Notes<\/th><\/tr>\n <\/thead>\n <tbody>\n <tr><td>--indigo<\/td><td><span class=\"swatch-dot\" style=\"background:#1C1691;\"><\/span>#1C1691<\/td><td>Primary<\/td><\/tr>\n <tr><td>--indigo-deep<\/td><td><span class=\"swatch-dot\" style=\"background:#14107A;\"><\/span>#14107A<\/td><td>Hover \/ pressed<\/td><\/tr>\n <tr><td>--ink<\/td><td><span class=\"swatch-dot\" style=\"background:#0B0A4E;\"><\/span>#0B0A4E<\/td><td>Dark backgrounds<\/td><\/tr>\n <tr><td>--emerald<\/td><td><span class=\"swatch-dot\" style=\"background:#00A03C;\"><\/span>#00A03C<\/td><td>Secondary accent<\/td><\/tr>\n <tr><td>--emerald-bright<\/td><td><span class=\"swatch-dot\" style=\"background:#14BE54;\"><\/span>#14BE54<\/td><td>Hover highlight<\/td><\/tr>\n <tr><td>--violet<\/td><td><span class=\"swatch-dot\" style=\"background:#8B4FD8;\"><\/span>#8B4FD8<\/td><td>Gradient start<\/td><\/tr>\n <tr><td>--magenta<\/td><td><span class=\"swatch-dot\" style=\"background:#C850DC;\"><\/span>#C850DC<\/td><td>Gradient end<\/td><\/tr>\n <tr><td>--cloud<\/td><td><span class=\"swatch-dot\" style=\"background:#F7F8FC;\"><\/span>#F7F8FC<\/td><td>Neutral surface<\/td><\/tr>\n <tr><td>--lavender<\/td><td><span class=\"swatch-dot\" style=\"background:#F0EBFA;\"><\/span>#F0EBFA<\/td><td>Corporate tint<\/td><\/tr>\n <tr><td>--mint<\/td><td><span class=\"swatch-dot\" style=\"background:#E6F7EC;\"><\/span>#E6F7EC<\/td><td>Science tint<\/td><\/tr>\n <tr><td>--ink-body<\/td><td><span class=\"swatch-dot\" style=\"background:#1A1A2E;\"><\/span>#1A1A2E<\/td><td>Body text<\/td><\/tr>\n <tr><td>--ink-muted<\/td><td><span class=\"swatch-dot\" style=\"background:#555566;\"><\/span>#555566<\/td><td>Secondary text<\/td><\/tr>\n <tr><td>--line<\/td><td><span class=\"swatch-dot\" style=\"background:#E4E4F0;\"><\/span>#E4E4F0<\/td><td>Dividers \/ borders<\/td><\/tr>\n <tr><td>--f-display<\/td><td>Fraunces, Georgia, serif<\/td><td>Display face<\/td><\/tr>\n <tr><td>--f-sans<\/td><td>Manrope, system-ui, sans-serif<\/td><td>Body face<\/td><\/tr>\n <tr><td>--f-mono<\/td><td>JetBrains Mono, SF Mono, monospace<\/td><td>Technical face<\/td><\/tr>\n <tr><td>--gradient-accent<\/td><td>linear-gradient(90deg, #8B4FD8, #C850DC)<\/td><td>Signature gradient<\/td><\/tr>\n <\/tbody>\n <\/table>\n\n <div class=\"callout mint\" style=\"margin-top:32px;\">\n <div class=\"callout-title\">Questions, requests, deviations<\/div>\n <p>\n Contact <span class=\"mono\">ir@azuriyapharma.com<\/span> for approvals on any application outside this guide.\n Brand updates to this document are logged with version number and date.\n <\/p>\n <\/div>\n <\/section>\n\n <\/main>\n <\/div>\n <\/div>\n<\/section>\n\n<!-- =================== FOOTER =================== -->\n<footer class=\"foot\">\n <div class=\"wrap\">\n <div class=\"foot-grid\">\n <div class=\"foot-brand\">\n <img decoding=\"async\" src=\"https:\/\/azuriyapharma.co\/wp-content\/uploads\/2026\/04\/Azuryia-Logo-No-Background-e1776863837551.png\" alt=\"Azuriya Pharma\">\n <p style=\"max-width:340px; font-size:.95rem; line-height:1.6;\">\n A late-stage, first-in-class oral small-molecule therapy targeting\n root causes of Inflammatory Bowel Disease through upstream modulation.\n <\/p>\n <\/div>\n <div>\n <h4>Science<\/h4>\n <ul>\n <li><a href=\"science.html\">Mechanism of Action<\/a><\/li>\n <li><a href=\"science.html#pipeline\">Pipeline<\/a><\/li>\n <li><a href=\"publications.html\">Publications<\/a><\/li>\n <\/ul>\n <\/div>\n <div>\n <h4>Company<\/h4>\n <ul>\n <li><a href=\"about.html\">About<\/a><\/li>\n <li><a href=\"about.html#team\">Team<\/a><\/li>\n <li><a href=\"investors.html\">Investors<\/a><\/li>\n <\/ul>\n <\/div>\n <div>\n <h4>Contact<\/h4>\n <ul>\n <li><a href=\"contact.html\">General Inquiries<\/a><\/li>\n <li><a href=\"contact.html#partnership\">Partnerships<\/a><\/li>\n <li><a href=\"contact.html#investors\">Investor Relations<\/a><\/li>\n <\/ul>\n <\/div>\n <\/div>\n <div class=\"foot-copy\">\n <span>\u00a9 2026 Azuriya Pharma. All rights reserved.<\/span>\n <span>Brand Guidelines v1.0 \u00b7 Internal Reference<\/span>\n <\/div>\n <\/div>\n<\/footer>\n\n<script>\n \/\/ highlight current section in sidebar on scroll\n const links = document.querySelectorAll('.brand-sidenav a');\n const sections = Array.from(links).map(a => document.querySelector(a.getAttribute('href')));\n function onScroll() {\n const y = window.scrollY + 140;\n let active = 0;\n sections.forEach((s, i) => { if (s && s.offsetTop <= y) active = i; });\n links.forEach((a, i) => a.classList.toggle('active', i === active));\n }\n window.addEventListener('scroll', onScroll, { passive: true });\n onScroll();\n<\/script>\n\n<\/body>\n<\/html>\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Brand Guidelines \u2014 Azuriya Pharma Home Science & Pipeline Publications About Investors Contact Brand Guidelines \u00b7 Version 1.0 A working reference for identity, color, type, and voice. Azuriya is a clinical-stage biopharmaceutical company developing APX3330 \u2014 a first-in-class oral APE1\/Ref-1 inhibitor for IBD. This page codifies how the company looks and sounds, so that every …<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"_genesis_block_theme_hide_title":false,"footnotes":""},"class_list":["post-11","page","type-page","status-publish","hentry","post","without-featured-image"],"featured_image_src":null,"featured_image_src_square":null,"_links":{"self":[{"href":"https:\/\/azuriyapharma.co\/index.php?rest_route=\/wp\/v2\/pages\/11","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/azuriyapharma.co\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/azuriyapharma.co\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/azuriyapharma.co\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/azuriyapharma.co\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=11"}],"version-history":[{"count":0,"href":"https:\/\/azuriyapharma.co\/index.php?rest_route=\/wp\/v2\/pages\/11\/revisions"}],"wp:attachment":[{"href":"https:\/\/azuriyapharma.co\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=11"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}