.topbar{padding:8px 5%}.brand{min-width:210px}.brand-logo{display:block;width:220px;height:70px;object-fit:contain;object-position:left center;background:#fff;border-radius:10px;padding:5px 12px}.section-logo{width:min(340px,80%);height:120px;object-fit:contain;margin-bottom:10px}.footer-logo{width:240px;max-width:80%;height:105px;object-fit:contain;background:#fff;border-radius:12px;padding:6px 14px;margin-bottom:12px}@media(max-width:600px){.brand-logo{width:180px;height:58px}}
.hero-visual{height:100%;min-height:520px;position:relative;overflow:hidden}.hero-visual .hero-img{position:absolute;inset:0}.mascot{position:absolute;right:2%;bottom:-8px;width:min(38vw,430px);max-height:92%;object-fit:contain;filter:drop-shadow(0 18px 18px #00132988);z-index:2}.hero-brands{display:flex;gap:8px;flex-wrap:wrap;margin-top:24px}.hero-brands span{border:1px solid #ffffff55;background:#ffffff17;border-radius:999px;padding:6px 12px;font-size:12px;font-weight:900;letter-spacing:.6px}.brand-showcase{padding:48px 5%;background:#fff;display:grid;grid-template-columns:.8fr 1.2fr;gap:42px;align-items:center}.brand-showcase h2{font-size:clamp(28px,3vw,42px);line-height:1.12;margin:8px 0 12px;color:var(--navy)}.brand-showcase p{color:var(--muted);max-width:640px}.brand-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.brand-badge{min-height:116px;border-radius:16px;padding:20px 14px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;box-shadow:0 10px 24px #102d4f24;transition:transform .2s ease}.brand-badge:hover{transform:translateY(-4px)}.brand-badge strong{font-size:clamp(18px,2vw,27px);letter-spacing:.5px}.brand-badge small{opacity:.86}.ppa{background:linear-gradient(145deg,#ef6c00,#173f8a)}.garen{background:linear-gradient(145deg,#123b7a,#1976d2)}.rossi{background:linear-gradient(145deg,#d4222d,#8e1018)}.peccinin{background:linear-gradient(145deg,#191919,#ef7b16)}@media(max-width:900px){.brand-showcase{grid-template-columns:1fr}.brand-grid{grid-template-columns:repeat(2,1fr)}.mascot{width:min(52vw,380px)}}@media(max-width:600px){.brand-logo{width:180px;height:58px}.hero-visual{min-height:320px}.mascot{width:62vw}.brand-showcase{padding:38px 6%}.brand-grid{gap:10px}.brand-badge{min-height:98px;padding:14px 8px}.brand-badge strong{font-size:17px}}