
.location-story {
    --story-red: #c71111;
    --story-red-dark: #990d0d;
    --story-navy: #07152f;
    --story-ink: #172033;
    --story-muted: #667085;
    --story-light: #f5f7fa;
    --story-border: #e3e7ee;
    color: var(--story-ink);
    background: #fff;
    overflow: hidden;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    line-height: 1.7;
}

.location-story *,
.location-story *::before,
.location-story *::after { box-sizing: border-box; }

.story-container { width: min(1160px, calc(100% - 40px)); margin: 0 auto; }
.story-hero {
    min-height: 500px;
    display: flex;
    align-items: center;
    position: relative;
    color: #fff;
    background-color: #0b1020;
    background-position: center;
    background-size: cover;
}
.story-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(3, 10, 25, .9), rgba(3, 10, 25, .62) 58%, rgba(3, 10, 25, .2));
}
.story-hero--vulcan { background-image: url("/images/locations/movers-in-vulcan/vulcan-movers-1.png"); }
.story-hero--whitecourt { background-image: url("/images/locations/movers-in-whitecourt/whitecourt-movers-1.png"); }
.story-hero--wainwright { background-image: url("/images/locations/movers-in-wainwright/wainwright-movers-1.png"); }
.story-hero__content { position: relative; z-index: 1; max-width: 760px; padding: 86px 0; }
.story-kicker {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    margin-bottom: 18px;
    color: #fff;
    font-size: .72rem;
    font-weight: 600;
    letter-spacing: 1.45px;
    text-transform: uppercase;
}
.story-kicker::before { content: ""; width: 34px; height: 3px; background: var(--story-red); }
.story-hero h1 { margin: 0 0 18px; font-family: Manrope, Inter, sans-serif; font-size: clamp(2.5rem, 5vw, 4.5rem); font-weight: 600; line-height: 1.02; letter-spacing: -.045em; color: #fff; }
.story-hero__lead { max-width: 680px; margin: 0 0 28px; color: rgba(255,255,255,.82); font-size: 1.1rem; }
.story-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    padding: 0 25px;
    border-radius: 5px;
    background: var(--story-red);
    color: #fff !important;
    text-decoration: none !important;
    font-size: .85rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: .4px;
}
.story-button:hover { background: var(--story-red-dark); }
.story-section { padding: 76px 0; }
.story-section--light { background: var(--story-light); }
.story-section--dark { color: #fff; background: var(--story-navy); }
.story-section__heading { max-width: 790px; margin-bottom: 30px; }
.story-section__heading h2 { margin: 0 0 14px; font-family: Manrope, Inter, sans-serif; color: var(--story-navy); font-size: clamp(1.75rem, 3.2vw, 2.65rem); font-weight: 600; line-height: 1.14; letter-spacing: -.035em; }
.story-section--dark .story-section__heading h2 { color: #fff; }
.story-section__heading p { margin: 0; color: var(--story-muted); font-size: 1.05rem; }
.story-section--dark .story-section__heading p { color: rgba(255,255,255,.72); }
.story-copy { max-width: 880px; }
.story-copy p { margin: 0 0 19px; color: var(--story-muted); font-size: 1.03rem; }
.story-copy p:last-child { margin-bottom: 0; }
.story-section--dark .story-copy p { color: rgba(255,255,255,.75); }
.story-copy strong { color: var(--story-ink); }
.story-section--dark .story-copy strong { color: #fff; }
.story-feature-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.story-feature { padding: 25px; border: 1px solid var(--story-border); border-radius: 9px; background: #fff; }
.story-feature h3 { margin: 0 0 9px; color: var(--story-navy); font-size: 1.12rem; font-weight: 600; line-height: 1.3; }
.story-feature p { margin: 0; color: var(--story-muted); }
.story-section--dark .story-feature { border-color: rgba(255,255,255,.14); background: rgba(255,255,255,.06); }
.story-section--dark .story-feature h3 { color: #fff; }
.story-media { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; margin-top: 34px; }
.story-media figure { margin: 0; overflow: hidden; border-radius: 11px; background: var(--story-light); }
.story-media img { display: block; width: 100%; height: 310px; object-fit: cover; }
.story-media figcaption { padding: 14px 17px; color: var(--story-muted); font-size: .92rem; }
.story-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin: 0; padding: 0; list-style: none; }
.story-list li { padding: 18px 20px; border-left: 3px solid var(--story-red); color: var(--story-navy); background: #fff; font-weight: 600; }
.story-quote { padding: 56px 0; background: #fff; }
.story-quote__inner { display: grid; grid-template-columns: .85fr 1.15fr; gap: 38px; align-items: start; padding: 38px; border: 1px solid var(--story-border); border-top: 4px solid var(--story-red); border-radius: 10px; }
.story-quote h2 { margin: 0 0 10px; font-family: Manrope, Inter, sans-serif; color: var(--story-navy); font-size: clamp(1.65rem, 2.6vw, 2.35rem); font-weight: 600; line-height: 1.14; }
.story-quote p { margin: 0; color: var(--story-muted); }
.story-form { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.story-form label { display: flex; flex-direction: column; gap: 6px; color: var(--story-navy); font-size: .86rem; font-weight: 600; }
.story-form input, .story-form select, .story-form textarea { width: 100%; border: 1px solid var(--story-border); border-radius: 5px; padding: 12px 13px; color: var(--story-ink); background: #fff; font: inherit; }
.story-form textarea { min-height: 90px; resize: vertical; }
.story-form .full { grid-column: 1 / -1; }
.story-form button { border: 0; cursor: pointer; }
.story-faq { max-width: 900px; }
.story-faq details { border-top: 1px solid var(--story-border); }
.story-faq details:last-child { border-bottom: 1px solid var(--story-border); }
.story-faq summary { display: flex; justify-content: space-between; gap: 20px; padding: 20px 4px; color: var(--story-navy); font-size: 1.05rem; font-weight: 600; cursor: pointer; list-style: none; }
.story-faq summary::-webkit-details-marker { display: none; }
.story-faq summary::after { content: "+"; color: var(--story-red); font-size: 1.5rem; line-height: 1; }
.story-faq details[open] summary::after { content: "−"; }
.story-faq__answer { padding: 0 48px 22px 4px; color: var(--story-muted); }
.story-final { padding: 66px 0; color: #fff; background: linear-gradient(120deg, #07152f, #16294a); }
.story-final__inner { display: flex; align-items: center; justify-content: space-between; gap: 25px; }
.story-final h2 { max-width: 700px; margin: 0; font-family: Manrope, Inter, sans-serif; color: #fff; font-size: clamp(1.75rem, 3.2vw, 2.5rem); font-weight: 600; line-height: 1.14; }
@media (max-width: 800px) {
    .story-feature-grid, .story-media, .story-quote__inner { grid-template-columns: 1fr; }
    .story-list { grid-template-columns: 1fr 1fr; }
    .story-final__inner { display: block; }
    .story-final .story-button { margin-top: 22px; }
}
@media (max-width: 560px) {
    .story-container { width: min(100% - 28px, 1160px); }
    .story-hero { min-height: 450px; }
    .story-hero__content { padding: 65px 0; }
    .story-hero h1 { font-size: 2.65rem; }
    .story-section { padding: 55px 0; }
    .story-list, .story-form { grid-template-columns: 1fr; }
    .story-form .full { grid-column: auto; }
    .story-quote__inner { padding: 25px 20px; }
    .story-media img { height: 240px; }
}
