/* Homepage hero only. Copy and links stay editable in the theme settings. */
.stm-home .stm-hero-grid {
    grid-template-columns: minmax(0, 2.56fr) minmax(0, 1fr);
    gap: 10px;
}
.stm-home .stm-hero-main {
    height: 280px;
    min-height: 280px;
    isolation: isolate;
    background: #f4ecdd;
    border: 0;
    border-radius: var(--radius);
}
.stm-home .stm-hero-main::after {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(90deg, #f8f4eabb 0%, #f8f4ea55 42%, transparent 61%);
}
.stm-home .stm-hero-art,
.stm-home .stm-hero-art.has-custom-photo {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    padding: 0;
    display: block;
    mask-image: none;
    -webkit-mask-image: none;
}
.stm-home .stm-hero-art img {
    display: block;
    width: 100%;
    height: 100%;
    max-height: none;
    object-fit: cover;
    object-position: center;
    border-radius: 0;
    mix-blend-mode: normal;
}
.stm-home .stm-hero-copy {
    z-index: 2;
    width: 64%;
    height: 100%;
    padding: 24px 0 22px 30px;
}
.stm-home .stm-kicker {
    font-size: 24px;
    line-height: 1.2;
    margin: 0 0 7px;
    letter-spacing: -.025em;
    color: var(--accent);
}
.stm-home .stm-hero-copy h1 {
    max-width: 100%;
    font-size: 32px;
    line-height: 1.16;
    margin: 0 0 10px;
    letter-spacing: -.035em;
}
.stm-home .stm-hero-description {
    max-width: 410px;
    font-size: 13px;
    line-height: 1.5;
    margin: 0 0 15px;
}
.stm-home .stm-hero-buttons {
    gap: 10px;
    margin: 0;
}
.stm-home .stm-hero-buttons .stm-button {
    min-height: 44px;
    padding: 10px 21px;
    font-size: 12px;
    gap: 8px;
}
.stm-home .stm-hero-buttons .stm-button-outline {
    background: #fffdf8e6;
    border-color: #c7aa615c;
    color: var(--ink);
}
.stm-home .stm-hero-buttons .stm-button-outline:hover {
    background: #fff;
    border-color: var(--accent);
}
.stm-home .stm-hero-points {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 14px;
    width: 430px;
    max-width: 100%;
    margin-top: auto;
    font-size: 10px;
    line-height: 1.35;
}
.stm-home .stm-hero-points span,
.stm-home .stm-hero-points span:last-child {
    display: flex;
    align-items: center;
    gap: 7px;
    max-width: none;
}
.stm-home .stm-hero-points .stm-icon {
    width: 24px;
    height: 24px;
    color: var(--accent);
}
.stm-home .stm-hero-side {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: repeat(2, minmax(0, 1fr));
    gap: 8px;
}
.stm-home .stm-mini-banner {
    position: relative;
    isolation: isolate;
    display: flex;
    align-items: center;
    height: 136px;
    min-height: 136px;
    padding: 15px 16px;
    overflow: hidden;
    background: #214832;
    border: 0;
    border-radius: var(--radius);
}
.stm-home .stm-mini-banner > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    max-height: none;
    opacity: 1;
    z-index: -2;
    object-fit: cover;
    object-position: center;
    border-radius: 0;
}
.stm-home .stm-mini-banner::after {
    position: absolute;
    inset: 0;
    z-index: -1;
    background: linear-gradient(90deg, #3c281bf2 0%, #3c281bc9 41%, transparent 67%);
}
.palette-green .stm-home .stm-mini-banner::after {
    background: linear-gradient(90deg, #003b26e6 0%, #003b2699 39%, transparent 65%);
}
.stm-home .stm-mini-banner > div {
    position: relative;
    z-index: 1;
    width: 53%;
    flex: 0 0 53%;
}
.stm-home .stm-mini-banner h2 {
    max-width: none;
    font-size: 19px;
    line-height: 1.25;
    color: #fff;
    margin: 0 0 5px;
    letter-spacing: -.025em;
}
.stm-home .stm-mini-banner p {
    max-width: 150px;
    min-height: 29px;
    margin: 0 0 8px;
    color: #fff;
    font-size: 11px;
    line-height: 1.35;
}
.stm-home .stm-mini-button {
    min-height: 34px;
    padding: 7px 12px;
    gap: 7px;
    font-size: 11px;
    line-height: 1.4;
}
@media (min-width: 768px) and (max-width: 1199px) {
    .stm-home .stm-hero-copy { padding: 24px 0 20px 22px; }
    .stm-home .stm-kicker { font-size: 20px; }
    .stm-home .stm-hero-copy h1 { font-size: 27px; }
    .stm-home .stm-hero-description { max-width: 350px; font-size: 12px; }
    .stm-home .stm-hero-points { gap: 9px; font-size: 9px; }
    .stm-home .stm-hero-points .stm-icon { width: 21px; height: 21px; }
    .stm-home .stm-mini-banner { padding: 14px 13px; }
    .stm-home .stm-mini-banner h2 { font-size: 17px; }
    .stm-home .stm-mini-banner p { font-size: 10px; }
}
@media (min-width: 768px) and (max-width: 991px) {
    .stm-home .stm-hero-grid { grid-template-columns: minmax(0, 1fr); }
    .stm-home .stm-hero-main { height: 264px; min-height: 264px; }
    .stm-home .stm-hero-copy { width: 64%; }
    .stm-home .stm-hero-side { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto; }
    .stm-home .stm-mini-banner { height: 136px; min-height: 136px; }
}
@media (max-width: 767px) {
    .stm-home .stm-hero-grid { grid-template-columns: minmax(0, 1fr); gap: 8px; }
    .stm-home .stm-hero-main { display: block; height: 430px; min-height: 430px; background: #f5eee3; }
    .stm-home .stm-hero-art,
    .stm-home .stm-hero-art.has-custom-photo { inset: auto 0 0; height: 200px; width: 100%; }
    .stm-home .stm-hero-art img { object-fit: cover; object-position: right center; }
    .stm-home .stm-hero-main::after { background: linear-gradient(180deg, #f5eee3 0%, #f5eee3 48%, #f5eee388 57%, transparent 66%); }
    .stm-home .stm-hero-copy { width: 100%; height: auto; padding: 19px 19px 0; }
    .stm-home .stm-kicker { font-size: 18px; line-height: 1.25; margin-bottom: 8px; }
    .stm-home .stm-hero-copy h1 { max-width: 340px; font-size: 27px; line-height: 1.16; margin-bottom: 10px; }
    .stm-home .stm-hero-description { max-width: 340px; font-size: 12px; line-height: 1.5; margin-bottom: 14px; }
    .stm-home .stm-hero-buttons { gap: 9px; flex-wrap: nowrap; }
    .stm-home .stm-hero-buttons .stm-button { min-height: 44px; padding: 10px 15px; font-size: 11px; gap: 7px; }
    .stm-home .stm-hero-buttons .stm-button .stm-icon { width: 15px; height: 15px; }
    .stm-home .stm-hero-points { margin-top: 16px; width: 100%; gap: 9px; font-size: 9px; }
    .stm-home .stm-hero-points span { gap: 4px; }
    .stm-home .stm-hero-points .stm-icon { width: 19px; height: 19px; }
    .stm-home .stm-hero-side { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto; gap: 8px; }
    .stm-home .stm-mini-banner { align-items: flex-start; height: 238px; min-height: 238px; padding: 13px 12px; background: #073d29; }
    .stm-home .stm-mini-banner > div { width: 100%; flex-basis: 100%; }
    .stm-home .stm-mini-banner h2 { font-size: 17px; margin-bottom: 4px; }
    .stm-home .stm-mini-banner p { min-height: 0; max-width: none; font-size: 10px; margin-bottom: 9px; }
    .stm-home .stm-mini-banner > img { inset: auto 0 0; height: 116px; object-position: 90% center; }
    .stm-home .stm-mini-banner::after { background: linear-gradient(180deg, #3c281b 0%, #3c281b 44%, #3c281b66 56%, transparent 72%); }
    .palette-green .stm-home .stm-mini-banner::after { background: linear-gradient(180deg, #073d29 0%, #073d29 44%, #073d2966 56%, transparent 72%); }
    .stm-home .stm-mini-button { min-height: 44px; padding: 9px 12px; font-size: 10px; }
}
@media (max-width: 359px) {
    .stm-home .stm-hero-main { height: 450px; min-height: 450px; }
    .stm-home .stm-hero-copy { padding-inline: 15px; }
    .stm-home .stm-hero-copy h1 { font-size: 25px; }
    .stm-home .stm-hero-points { gap: 5px; font-size: 8px; }
    .stm-home .stm-mini-banner { padding-inline: 10px; }
    .stm-home .stm-mini-banner h2 { font-size: 16px; }
}