.roast-hero-banner{position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden;background:var(--charisma-color-espresso)}.roast-hero-banner__image{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;object-fit:cover;object-position:center}.roast-hero-banner__overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,#1c131026,#1c13108c)}.roast-hero-banner__content{position:relative;z-index:2;text-align:center}.roast-hero-banner .roast-hero__eyebrow{color:#ffffffd9}.roast-hero-banner .roast-hero__heading{color:#fff}.roast-hero-banner .roast-hero__subheading{color:#ffffffe6}.roast-hero__eyebrow{font-family:var(--charisma-font-mono);font-size:var(--charisma-text-eyebrow);font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin:0 0 .7rem}.roast-hero__heading{font-family:var(--charisma-font-serif);font-weight:700;font-size:var(--charisma-text-display);line-height:1.1;margin:0 0 1rem}.roast-hero__subheading{font-size:var(--charisma-text-body);margin:0}.roast-hero{padding:2.5rem 0 clamp(3rem,7vw,5rem);background:var(--charisma-color-parchment)}.roast-hero__inner{max-width:640px;margin:0 auto;text-align:center}.roast-hero__grid{display:flex;flex-direction:column;align-items:center;gap:16px}.roast-hero__row{display:flex;justify-content:center;gap:16px}.roast-hero__tile{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;width:190px;height:130px;border-radius:12px;text-decoration:none;transition:transform .15s ease}.roast-hero__tile:hover{transform:translateY(-3px)}.roast-hero__tile-name{font-family:var(--charisma-font-serif);font-weight:700;font-size:var(--charisma-text-subtitle);line-height:1.05;text-align:center}.roast-hero__tile-type{font-family:var(--charisma-font-mono);font-size:var(--charisma-text-eyebrow);font-weight:700;line-height:1.05;letter-spacing:.03em;text-transform:uppercase;text-align:center}@media screen and (max-width:749px){.roast-hero__grid,.roast-hero__row{gap:10px}.roast-hero__tile{width:100px;height:95px;gap:1px;border-radius:10px}}@media(prefers-reduced-motion:reduce){.roast-hero__tile{transition:none}}
/*# sourceMappingURL=/cdn/shop/t/16/assets/roast-personality-hero.css.map */