:root { --yellow:#ffd128; --pink:#fa2b61; --navy:#03112f; --paper:#f8f7f3; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:30px; }
body { margin:0; background:var(--paper); color:var(--navy); font-family:Nunito,Arial,sans-serif; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
a:focus-visible,button:focus-visible { outline:3px solid var(--pink); outline-offset:5px; }
.brand-topbar { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:25px clamp(20px,5vw,80px); border-bottom:1px solid #03112f20; }
.brand-topbar img { display:block; width:150px; height:auto; }
.back-link { font-weight:900; font-size:.85rem; }
.brand-hero { display:grid; grid-template-columns:1.2fr 1fr; align-items:center; gap:50px; padding:65px clamp(20px,5vw,80px) 75px; background:var(--yellow) url('img/skull-pattern.png') center/500px; }
.eyebrow,.card-label { margin:0 0 18px; font-size:.7rem; font-weight:900; letter-spacing:.14em; }
h1,h2 { font-family:Anton,Impact,sans-serif; font-weight:400; }
h1 { margin:0; font-size:clamp(3.1rem,6.3vw,6.8rem); line-height:1.04; letter-spacing:.01em; }
h1 span { color:var(--pink); }
.hero-description { max-width:440px; margin:24px 0; font-size:1.05rem; font-weight:800; line-height:1.65; }
.section-nav { display:flex; flex-wrap:wrap; gap:12px; }
.section-nav a { padding:10px 16px; background:var(--navy); color:#fff; font-weight:900; font-size:.82rem; box-shadow:3px 3px 0 var(--pink); }
.hero-mark { display:grid; place-items:center; min-height:320px; }
.hero-mark img { display:block; width:min(100%,380px); height:auto; transform:rotate(-6deg); filter:drop-shadow(10px 14px 0 #03112f18); }
.brand-section { max-width:1240px; margin:auto; padding:70px clamp(20px,5vw,64px); border-bottom:1px solid #03112f20; }
.section-heading { display:flex; align-items:flex-start; gap:20px; margin-bottom:32px; }
.section-number { display:grid; place-items:center; flex:0 0 48px; width:48px; height:48px; background:var(--navy); color:var(--yellow); font-family:Anton,sans-serif; font-size:1.5rem; }
h2 { margin:0; font-size:clamp(1.8rem,3vw,2.7rem); line-height:1.1; }
.section-heading p { margin:10px 0 0; color:#566074; font-size:.95rem; line-height:1.5; }
.logo-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }
.asset-card { overflow:hidden; border:1px solid #03112f20; border-radius:12px; background:#fff; }
.logo-stage { display:grid; place-items:center; height:230px; padding:35px; }
.logo-stage img { max-width:100%; max-height:155px; object-fit:contain; }
.stage-yellow { background:var(--yellow); }
.stage-paper { background:#eeede8; }
.stage-pink { background:var(--pink); }
.asset-details { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:20px; }
h3 { margin:0; font-size:1rem; font-weight:900; }
.asset-details p { margin:5px 0 0; color:#566074; font-size:.75rem; }
.asset-details a { flex-shrink:0; padding:9px; border:1px solid #03112f30; border-radius:5px; font-weight:900; font-size:.75rem; }
.usage-note { margin-top:24px; padding:20px 24px; border-left:4px solid var(--pink); background:#fff; }
.usage-note p { margin:7px 0 0; font-size:.87rem; line-height:1.7; color:#566074; }
.type-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.type-card { padding:32px; border-radius:12px; }
.anton { background:var(--navy); color:#fff; }
.nunito { background:#fff; border:1px solid #03112f20; }
.type-card h3 { font-size:1.3rem; }
.anton h3,.anton .type-sample,.anton .alphabet { font-family:Anton,Impact,sans-serif; font-weight:400; }
.type-sample { margin:30px 0; font-size:clamp(2rem,4vw,3.8rem); line-height:1.18; font-weight:900; }
.anton .type-sample { color:var(--yellow); }
.alphabet { font-size:1.1rem; line-height:1.6; overflow-wrap:anywhere; }
.type-meta { display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; margin-top:25px; padding-top:18px; border-top:1px solid #8885; font-size:.8rem; font-weight:800; }
.type-meta a { text-decoration:underline; text-underline-offset:4px; }
.palette-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:15px; }
.color-card { overflow:hidden; border:1px solid #03112f20; border-radius:10px; background:#fff; }
.swatch { height:155px; }
.yellow .swatch { background:#ffd128; }.pink .swatch { background:#fa2b61; }.navy .swatch { background:#03112f; }.white .swatch { background:#fff; border-bottom:1px solid #ddd; }.black .swatch { background:#000; }
.color-card > div:last-child { padding:16px; }
.color-card h3 { font-size:.85rem; }
.color-card p { min-height:34px; margin:6px 0 14px; color:#566074; font-size:.73rem; }
.color-card button { display:flex; width:100%; align-items:center; justify-content:space-between; gap:8px; padding:8px 0; border:0; border-top:1px solid #03112f20; background:transparent; color:var(--navy); font-family:Consolas,monospace; font-size:.8rem; cursor:pointer; }
.color-status { min-height:24px; margin:16px 0 0; font-size:.85rem; font-weight:800; }
.brand-footer { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:24px; padding:35px clamp(20px,5vw,80px); background:var(--yellow); font-weight:900; }
.brand-footer img { width:130px; height:auto; }
.brand-footer p { font-size:.9rem; }
@media(max-width:900px) { .logo-grid { grid-template-columns:1fr 1fr; }.palette-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }.brand-hero { gap:25px; }.hero-mark { min-height:200px; } }
@media(max-width:600px) { .brand-topbar { padding:20px; }.brand-topbar img { width:120px; }.back-link { font-size:.75rem; }.brand-hero { grid-template-columns:1fr; padding:40px 20px; gap:30px; }.hero-mark img { width:230px; }.brand-section { padding:45px 20px; }.logo-grid,.type-grid { grid-template-columns:1fr; }.palette-grid { grid-template-columns:1fr 1fr; }.type-card { padding:24px; }.section-heading { gap:14px; }.logo-stage { height:240px; }.brand-footer { justify-content:center; text-align:center; } }
@media(prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }
.type-sample,.alphabet,[data-brand-text] { white-space:pre-line; }
.palette-grid { grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); }
@media(max-width:600px) { .palette-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }

body.brand-page { background-image:none; }
.brand-page .site-footer { margin-top:0; }

.brand-download-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.brand-download-card { display:flex; flex-direction:column; align-items:flex-start; padding:28px; border:1px solid #03112f20; border-radius:12px; background:#fff; }
.brand-download-card h3 { font-size:1.35rem; }
.brand-download-card p { margin:12px 0 24px; color:#566074; line-height:1.6; }
.brand-download-card a { margin-top:auto; padding:12px 18px; border-radius:5px; background:var(--navy); color:#fff; font-weight:900; }
.brand-download-card a:hover { background:var(--pink); }
@media(max-width:600px) { .brand-download-grid { grid-template-columns:1fr; } }