:root {
    --sh-ivory: #fef9f3;
    --sh-ivory-deep: #f6eee3;
    --sh-gold: #c49a6c;
    --sh-gold-dark: #a87e52;
    --sh-gold-light: #e8cfa9;
    --sh-black: #111111;
    --sh-text: #2b2724;
    --sh-muted: #6f655c;
    --sh-line: rgba(196, 154, 108, 0.32);

    --sh-font-display: "League Spartan", "Montserrat", system-ui, sans-serif;
    --sh-font-accent: "Jost", "Montserrat", system-ui, sans-serif;
    --sh-font-body: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;

    --sh-container: 1200px;
    --sh-header-h: 88px;

    --sh-ease: cubic-bezier(.16, 1, .3, 1);
    --sh-tr-hover: box-shadow .35s ease, background-color .35s ease, background-size .6s var(--sh-ease), color .35s ease;
}

body {
    background: var(--sh-ivory);
    color: var(--sh-text);
    font-family: var(--sh-font-body);
}
body:not(.elementor-editor-active) {
    display: flex;
    flex-direction: column;
    min-height: calc(100vh - var(--wp-admin--admin-bar--height, 0px));
    min-height: calc(100svh - var(--wp-admin--admin-bar--height, 0px));
}
body:not(.elementor-editor-active) > .sh-footer { margin-top: auto; }

h1, h2, h3, h4 {
    font-family: var(--sh-font-display);
    font-weight: 800;
    color: var(--sh-black);
    letter-spacing: -0.01em;
}

a { color: var(--sh-gold-dark); }

::selection { background: var(--sh-gold); color: #fff; }

.sh-container {
    width: 100%;
    max-width: var(--sh-container);
    margin-inline: auto;
    padding-inline: 24px;
}

:focus-visible {
    outline: 2px solid var(--sh-gold-dark);
    outline-offset: 3px;
}

.sh-btn,
.sh-button .elementor-button {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 50px;
    padding: 0 28px;
    border-radius: 0;
    overflow: hidden;
    isolation: isolate;
    font-family: var(--sh-font-body);
    font-weight: 700;
    font-size: 14px;
    letter-spacing: .1em;
    text-transform: uppercase;
    text-decoration: none;
    white-space: nowrap;
    transition: background-color .3s ease, color .3s ease, box-shadow .4s ease;
}
.sh-btn::after,
.sh-button .elementor-button::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: -60%;
    width: 50%;
    background: linear-gradient(105deg, transparent, rgba(255, 255, 255, .42), transparent);
    transform: skewX(-18deg);
    pointer-events: none;
}
.sh-btn:hover::after,
.sh-btn:focus-visible::after,
.sh-button .elementor-button:hover::after,
.sh-button .elementor-button:focus-visible::after {
    transform: translateX(340%) skewX(-18deg);
    transition: transform .9s var(--sh-ease);
}

.sh-btn--primary,
.sh-button .elementor-button {
    background: var(--sh-gold);
    color: #fff;
}
.sh-btn--primary:hover,
.sh-btn--primary:focus,
.sh-btn--primary:focus-visible,
.sh-button .elementor-button:hover,
.sh-button .elementor-button:focus-visible {
    background: var(--sh-gold-dark);
    color: #fff;
    box-shadow: 0 14px 34px -14px rgba(196, 154, 108, .95);
}

.sh-button--ghost .elementor-button {
    background: transparent;
    color: var(--sh-black);
    box-shadow: inset 0 0 0 1px var(--sh-black);
}
.sh-button--ghost .elementor-button:hover,
.sh-button--ghost .elementor-button:focus-visible {
    background: var(--sh-black);
    color: var(--sh-ivory);
    box-shadow: inset 0 0 0 1px var(--sh-black), 0 14px 34px -18px rgba(17, 17, 17, .8);
}

.sh-topbar {
    background: var(--sh-black);
    color: var(--sh-ivory);
    font-size: 14px;
}
.sh-topbar__inner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    min-height: 38px;
}
.sh-topbar__claim {
    font-family: var(--sh-font-accent);
    letter-spacing: .12em;
    text-transform: uppercase;
    font-size: 12px;
    color: var(--sh-gold);
}

.sh-header {
    position: sticky;
    top: 0;
    z-index: 100;
    background: rgba(254, 249, 243, .94);
    backdrop-filter: saturate(140%) blur(10px);
    border-bottom: 1px solid var(--sh-line);
    transition: box-shadow .25s;
}
.admin-bar .sh-header { top: 32px; }
.sh-header.is-scrolled { box-shadow: 0 10px 30px -22px rgba(17, 17, 17, .45); }
@supports (animation-timeline: scroll()) {
    .sh-header::after {
        content: "";
        position: absolute;
        left: 0;
        right: 0;
        bottom: -1px;
        height: 2px;
        background: linear-gradient(90deg, var(--sh-gold-dark), var(--sh-gold-light));
        transform-origin: 0 50%;
        transform: scaleX(0);
        animation: sh-progress linear both;
        animation-timeline: scroll(root);
    }
    @keyframes sh-progress { to { transform: scaleX(1); } }
}

.sh-header__inner {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 24px;
    min-height: var(--sh-header-h);
    transition: min-height .25s;
}
.sh-header.is-scrolled .sh-header__inner { min-height: 70px; }

.sh-brand {
    display: inline-flex;
    align-items: center;
    gap: 12px;
    text-decoration: none;
    flex-shrink: 0;
}
.sh-brand__icon {
    width: auto;
    height: 54px;
    transition: height .25s, transform .6s var(--sh-ease);
}
.sh-brand:hover .sh-brand__icon { transform: rotate(-4deg) scale(1.04); }
.sh-header.is-scrolled .sh-brand__icon { height: 44px; }
.sh-brand__text {
    display: flex;
    flex-direction: column;
    line-height: 1;
}
.sh-brand__name {
    font-family: var(--sh-font-display);
    font-weight: 900;
    font-size: 26px;
    letter-spacing: .01em;
    text-transform: uppercase;
    color: var(--sh-black);
}
.sh-brand__tagline {
    margin-top: 6px;
    font-family: var(--sh-font-accent);
    font-weight: 500;
    font-size: 11px;
    letter-spacing: .32em;
    text-transform: uppercase;
    color: var(--sh-gold);
}

.sh-nav {
    display: flex;
    align-items: center;
    gap: 28px;
}
.sh-menu {
    display: flex;
    align-items: center;
    gap: 4px;
    margin: 0;
    padding: 0;
    list-style: none;
}
.sh-menu a {
    position: relative;
    display: block;
    padding: 10px 14px;
    font-family: var(--sh-font-body);
    font-weight: 600;
    font-size: 16px;
    color: var(--sh-text);
    text-decoration: none;
    white-space: nowrap;
    transition: color .2s;
}
.sh-menu a::after {
    content: "";
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 4px;
    height: 2px;
    background: var(--sh-gold);
    transform: scaleX(0);
    transform-origin: left;
    transition: transform .35s var(--sh-ease);
}
.sh-menu a:hover,
.sh-menu .current-menu-item > a,
.sh-menu .current_page_item > a { color: var(--sh-black); }
.sh-menu a:hover::after,
.sh-menu .current-menu-item > a::after,
.sh-menu .current_page_item > a::after { transform: scaleX(1); }
.sh-menu .sub-menu { display: none; }

.sh-nav-toggle {
    display: none;
    flex-direction: column;
    justify-content: center;
    gap: 5px;
    width: 48px;
    height: 48px;
    padding: 12px;
    border: 1px solid var(--sh-line);
    border-radius: 0;
    background: transparent;
    cursor: pointer;
}
.sh-nav-toggle:hover,
.sh-nav-toggle:focus { background: var(--sh-ivory-deep); }
.sh-nav-toggle__bar {
    display: block;
    height: 2px;
    background: var(--sh-black);
    transition: transform .25s, opacity .2s;
}
.sh-nav-toggle[aria-expanded="true"] .sh-nav-toggle__bar:nth-child(2) { transform: translateY(7px) rotate(45deg); }
.sh-nav-toggle[aria-expanded="true"] .sh-nav-toggle__bar:nth-child(3) { opacity: 0; }
.sh-nav-toggle[aria-expanded="true"] .sh-nav-toggle__bar:nth-child(4) { transform: translateY(-7px) rotate(-45deg); }

.sh-glow {
    position: relative;
    --mx: -999px;
    --my: -999px;
    --sh-glow-o: 0;
    --sh-glow-c: #b4844f;
    --sh-glow-halo: rgba(196, 154, 108, .85);
}

.sh-glow::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 3;
    pointer-events: none;
    border: 1.5px solid transparent;
    border-image: radial-gradient(280px circle at var(--mx) var(--my), var(--sh-glow-c), rgba(196, 154, 108, .4) 45%, transparent 72%) 1;
    filter: drop-shadow(0 0 2px var(--sh-glow-halo)) drop-shadow(0 0 8px var(--sh-glow-halo));
    opacity: var(--sh-glow-o);
    transition: opacity .3s ease;
}
.sh-quote.sh-glow {
    --sh-glow-c: #d9ad74;
    --sh-glow-halo: rgba(217, 173, 116, .8);
}

.e-con.sh-section {
    --content-width: 1200px;
    --padding-top: 112px;
    --padding-bottom: 112px;
    --padding-left: 24px;
    --padding-right: 24px;
}
.e-con.sh-section--tint { background: var(--sh-ivory-deep); }
.e-con.sh-section--dark { background: var(--sh-black); }

.sh-eyebrow .elementor-heading-title {
    display: inline-flex;
    align-items: center;
    gap: 14px;
    font-family: var(--sh-font-accent);
    font-weight: 500;
    font-size: 13px;
    letter-spacing: .3em;
    text-transform: uppercase;
    color: var(--sh-gold-dark);
}
.sh-eyebrow .elementor-heading-title::before,
.sh-center .sh-eyebrow .elementor-heading-title::after {
    content: "";
    width: 32px;
    height: 1px;
    background: currentColor;
    transform-origin: right;
    transition: transform 1.1s var(--sh-ease) .25s;
}
.sh-center .sh-eyebrow .elementor-heading-title::after { transform-origin: left; }
.sh-eyebrow.sh-reveal:not(.is-visible) .elementor-heading-title::before,
.sh-eyebrow.sh-reveal:not(.is-visible) .elementor-heading-title::after { transform: scaleX(0); }

.sh-h1 .elementor-heading-title {
    font-size: clamp(42px, 5.4vw, 68px);
    line-height: 1.03;
    font-weight: 800;
}
.sh-h2 .elementor-heading-title {
    font-size: clamp(32px, 3.6vw, 48px);
    line-height: 1.08;
    font-weight: 800;
}
.sh-lead { font-size: 19px; line-height: 1.7; color: var(--sh-muted); }
.sh-lead p:last-child { margin-bottom: 0; }
.sh-center { text-align: center; }
.sh-section-head { --gap: 16px; max-width: 1140px; margin-inline: auto; margin-bottom: 64px; }

.sh-hero__points ul,
.sh-checklist ul { margin: 0; padding: 0; list-style: none; }
.sh-hero__points li,
.sh-checklist li { position: relative; }
.sh-hero__points li::before,
.sh-checklist li::before {
    content: "";
    flex-shrink: 0;
    background: var(--sh-gold);
}
.sh-hero__points li::after,
.sh-checklist li::after {
    content: "";
    position: absolute;
    left: var(--sh-check-x);
    top: var(--sh-check-y);
    width: var(--sh-check-w);
    height: var(--sh-check-h);
    border: solid #fff;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.e-con.sh-hero {
    --padding-top: 96px;
    --padding-bottom: 112px;
    position: relative;
    overflow: hidden;
    background: var(--sh-ivory);
}
.e-con.sh-hero::after,
.e-con.sh-cta::after {
    content: "";
    position: absolute;
    inset: -25%;
    pointer-events: none;
    z-index: 0;
    background:
        radial-gradient(closest-side at 72% 38%, rgba(196, 154, 108, .22), transparent),
        radial-gradient(closest-side at 18% 82%, rgba(196, 154, 108, .10), transparent);
    animation: sh-aurora 26s ease-in-out infinite alternate;
}
.e-con.sh-hero > .e-con-inner,
.e-con.sh-cta > .e-con-inner { position: relative; z-index: 1; }
@keyframes sh-aurora {
    from { transform: translate3d(-3%, -2%, 0) scale(1); }
    to   { transform: translate3d(4%, 3%, 0) scale(1.08); }
}

.sh-hero__copy { --gap: 24px; }
.sh-hero__actions { --gap: 14px; margin-top: 8px; }
.sh-hero__points ul { display: flex; flex-wrap: wrap; gap: 10px 26px; margin-top: 8px; }
.sh-hero__points li {
    display: inline-flex; align-items: center; gap: 10px; font-weight: 600; font-size: 15px; color: var(--sh-text);
    --sh-check-x: 6.5px; --sh-check-y: calc(50% - 6px); --sh-check-w: 5px; --sh-check-h: 9px;
}
.sh-hero__points li::before { width: 18px; height: 18px; }

.sh-hero__visual { justify-content: center; align-items: center; }
.e-con.sh-hero__card {
    --padding-top: 60px; --padding-bottom: 52px; --padding-left: 44px; --padding-right: 44px;
    --gap: 22px;
    max-width: 440px;
    width: 100%;
    border-radius: 0;
    background-color: #fff;
    background-image: radial-gradient(420px circle at var(--mx) var(--my), rgba(196, 154, 108, calc(var(--sh-glow-o) * .09)), transparent 65%);
    box-shadow:
        inset 0 0 0 1px var(--sh-line),
        0 40px 70px -40px rgba(80, 56, 30, .45),
        0 0 46px -14px rgba(196, 154, 108, calc(var(--sh-glow-o) * .55));
    text-align: center;
    transition: var(--sh-tr-hover);
}
.e-con.sh-hero__card::before {
    content: "";
    display: block;
    position: absolute;
    top: 20px;
    left: 20px;
    width: 100%;
    height: 100%;
    border: 1px solid rgba(196, 154, 108, .6);
    border-radius: 0;
    background: none;
    opacity: 1;
    mix-blend-mode: normal;
    z-index: -1;
    transition: transform .9s var(--sh-ease);
}
.e-con.sh-hero__card:hover::before { transform: translate(-8px, -8px); }
.sh-hero__card .elementor-widget-image img {
    width: 180px;
    height: auto;
    animation: sh-float 7s ease-in-out infinite;
}
@keyframes sh-float {
    0%, 100% { transform: translateY(0); }
    50%      { transform: translateY(-8px); }
}
.sh-hero__card .sh-card-tag .elementor-heading-title {
    font-family: var(--sh-font-accent);
    letter-spacing: .28em;
    text-transform: uppercase;
    font-size: 13px;
    color: var(--sh-gold-dark);
    font-weight: 500;
}
.sh-hero__card .sh-card-title .elementor-heading-title {
    font-family: var(--sh-font-display);
    font-weight: 700;
    font-size: 26px;
    line-height: 1.2;
}

.e-con.sh-hero.sh-hero--photo { --padding-top: 120px; --padding-bottom: 130px; }
.e-con.sh-hero--photo::after {
    inset: 0;
    animation: none;
    background: linear-gradient(90deg,
        rgba(254, 249, 243, .97) 0%,
        rgba(254, 249, 243, .92) 34%,
        rgba(254, 249, 243, .55) 56%,
        rgba(254, 249, 243, 0) 76%);
}
.sh-hero--photo .sh-hero__visual { display: none; }
@property --sh-arm { syntax: '<length>'; inherits: false; initial-value: 46px; }
.e-con.sh-hero--photo::before {
    --sh-arm: 46px;
    --sh-off: 18px;
    --sh-c: var(--sh-gold);
    --sh-f: rgba(254, 249, 243, .75);
    content: "";
    display: block;
    position: absolute;
    top: 56px;
    bottom: 56px;
    left: calc(50% + 24px);
    right: max(24px, calc((100% - 1200px) / 2 + 24px));
    width: auto;
    height: auto;
    border: 0;
    border-radius: 0;
    opacity: 1;
    mix-blend-mode: normal;
    z-index: 1;
    pointer-events: none;
    background:
        linear-gradient(var(--sh-c), var(--sh-c)) left 0 top 0 / var(--sh-arm) 2px,
        linear-gradient(var(--sh-c), var(--sh-c)) left 0 top 0 / 2px var(--sh-arm),
        linear-gradient(var(--sh-c), var(--sh-c)) right var(--sh-off) top 0 / var(--sh-arm) 2px,
        linear-gradient(var(--sh-c), var(--sh-c)) right var(--sh-off) top 0 / 2px var(--sh-arm),
        linear-gradient(var(--sh-c), var(--sh-c)) left 0 bottom var(--sh-off) / var(--sh-arm) 2px,
        linear-gradient(var(--sh-c), var(--sh-c)) left 0 bottom var(--sh-off) / 2px var(--sh-arm),
        linear-gradient(var(--sh-c), var(--sh-c)) right var(--sh-off) bottom var(--sh-off) / var(--sh-arm) 2px,
        linear-gradient(var(--sh-c), var(--sh-c)) right var(--sh-off) bottom var(--sh-off) / 2px var(--sh-arm),
        linear-gradient(var(--sh-f), var(--sh-f)) left var(--sh-off) top var(--sh-off) / calc(100% - var(--sh-off)) 1px,
        linear-gradient(var(--sh-f), var(--sh-f)) left var(--sh-off) bottom 0 / calc(100% - var(--sh-off)) 1px,
        linear-gradient(var(--sh-f), var(--sh-f)) left var(--sh-off) top var(--sh-off) / 1px calc(100% - var(--sh-off)),
        linear-gradient(var(--sh-f), var(--sh-f)) right 0 top var(--sh-off) / 1px calc(100% - var(--sh-off));
    background-repeat: no-repeat;
    animation: sh-arm 1.4s var(--sh-ease) .5s both;
}
@keyframes sh-arm { from { --sh-arm: 0px; opacity: 0; } }
.elementor-editor-active .e-con.sh-hero--photo::before { animation: none; }
.sh-hero--photo .sh-hero__copy { max-width: 620px; }

@media (max-width: 1024px) {
    .e-con.sh-hero--photo::before { display: none; }
    .e-con.sh-hero--photo::after {
        background: linear-gradient(90deg, rgba(254, 249, 243, .96) 0%, rgba(254, 249, 243, .85) 60%, rgba(254, 249, 243, .45) 100%);
    }
}
@media (max-width: 767px) {
    .e-con.sh-hero.sh-hero--photo { --padding-top: 330px; --padding-bottom: 56px; background-size: auto 360px !important; background-position: 70% top !important; }
    .e-con.sh-hero.sh-hero--photo::before {
        display: block;
        --sh-arm: 32px;
        --sh-off: 10px;
        top: 20px;
        bottom: auto;
        left: 16px;
        right: 16px;
        height: 290px;
    }
    .e-con.sh-hero--photo::after {
        background: linear-gradient(180deg, rgba(254, 249, 243, 0) 0, rgba(254, 249, 243, 0) 200px, rgba(254, 249, 243, 1) 340px);
    }
}

.e-con.sh-grid {
    display: grid;
    grid-template-columns: repeat(var(--sh-cols, 3), minmax(0, 1fr));
    gap: 24px;
}
.e-con.sh-grid > .e-con,
.e-con.sh-grid > .elementor-element { width: auto; max-width: none; margin: 0; }
.e-con.sh-grid--4 { --sh-cols: 4; }

.e-con.sh-step,
.sh-feature,
.e-con.sh-card {
    border-radius: 0;
    box-shadow:
        inset 0 0 0 1px var(--sh-line),
        0 30px 60px -44px rgba(196, 154, 108, calc(var(--sh-glow-o, 0) * 1));
    transition: var(--sh-tr-hover);
}

.e-con.sh-step {
    --padding-top: 40px; --padding-bottom: 40px; --padding-left: 36px; --padding-right: 36px;
    --gap: 14px;
    background-color: #fff;
    background-image: radial-gradient(380px circle at var(--mx) var(--my), rgba(196, 154, 108, calc(var(--sh-glow-o, 0) * .08)), transparent 65%);
}
.sh-step__num .elementor-heading-title {
    font-family: var(--sh-font-display);
    font-weight: 800;
    font-size: 72px;
    line-height: .9;
    color: transparent;
    -webkit-text-stroke: 1.2px var(--sh-gold);
    transition: color .5s ease;
}
.sh-step:hover .sh-step__num .elementor-heading-title { color: var(--sh-gold); }
.sh-step h3,
.sh-card h3 { font-size: 23px; line-height: 1.2; margin: 6px 0 0; }
.sh-step p,
.sh-card p { color: var(--sh-muted); line-height: 1.7; margin: 0; }

.sh-feature {
    padding: 40px 32px 36px;
    background-color: rgba(255, 255, 255, .6);
    background-image: radial-gradient(380px circle at var(--mx) var(--my), rgba(196, 154, 108, calc(var(--sh-glow-o, 0) * .08)), transparent 65%);
}
.sh-feature .elementor-icon-box-wrapper { text-align: center; }
.sh-feature .elementor-icon-box-icon { margin: 0 0 22px; }
.sh-feature .elementor-icon {
    display: inline-grid;
    place-items: center;
    width: 58px;
    height: 58px;
    border-radius: 0;
    background: transparent;
    box-shadow: inset 0 0 0 1px var(--sh-gold);
    color: var(--sh-gold-dark);
    font-size: 24px;
    transition: background-color .4s ease, color .4s ease;
}
.sh-feature .elementor-icon svg { width: 24px; height: 24px; fill: currentColor; }
.sh-feature:hover .elementor-icon { background: var(--sh-gold); color: #fff; }
.sh-feature .elementor-icon-box-title { font-family: var(--sh-font-display); font-weight: 800; font-size: 22px; color: var(--sh-black); margin: 0 0 10px; }
.sh-feature .elementor-icon-box-description { color: var(--sh-muted); line-height: 1.7; margin: 0; }

/* ---------- Kohderyhmäkortit ---------- */
.e-con.sh-card {
    --padding-top: 36px; --padding-bottom: 32px; --padding-left: 30px; --padding-right: 30px;
    --gap: 12px;
    background-color: var(--sh-ivory);
    background-image:
        linear-gradient(var(--sh-gold), var(--sh-gold)),
        radial-gradient(380px circle at var(--mx) var(--my), rgba(196, 154, 108, calc(var(--sh-glow-o, 0) * .08)), transparent 65%);
    background-repeat: no-repeat;
    background-size: 0% 2px, 100% 100%;
    background-position: 0 0, 0 0;
}
.e-con.sh-card:hover { background-size: 100% 2px, 100% 100%; }
.sh-card .sh-card__link { margin-top: auto; }
.sh-card .sh-card__link a {
    font-weight: 700;
    font-size: 14px;
    letter-spacing: .08em;
    text-transform: uppercase;
    color: var(--sh-gold-dark);
    text-decoration: none;
}
.sh-card .sh-card__link a::after {
    content: "";
    display: inline-block;
    margin-left: 8px;
    transition: transform .4s var(--sh-ease);
}
.sh-card:hover .sh-card__link a::after { transform: translateX(6px); }

.sh-split { --gap: 72px; align-items: center; }
.sh-split__copy { --gap: 22px; }
.sh-checklist ul { display: grid; gap: 14px; margin-top: 6px; }
.sh-checklist li {
    display: flex; gap: 14px; align-items: flex-start; font-weight: 600; font-size: 17px;
    --sh-check-x: 8px; --sh-check-y: 5px; --sh-check-w: 6px; --sh-check-h: 11px;
}
.sh-checklist li::before { width: 22px; height: 22px; margin-top: 1px; }

.e-con.sh-quote {
    --padding-top: 64px; --padding-bottom: 64px; --padding-left: 52px; --padding-right: 52px;
    --gap: 18px;
    border-radius: 0;
    background:
        radial-gradient(420px circle at var(--mx) var(--my), rgba(196, 154, 108, calc(var(--sh-glow-o, 0) * .14)), transparent 65%),
        var(--sh-black);
    box-shadow:
        -20px -20px 0 -1px var(--sh-ivory),
        -20px -20px 0 0 rgba(196, 154, 108, .6),
        0 40px 70px -40px rgba(17, 17, 17, .6),
        0 0 50px -12px rgba(196, 154, 108, calc(var(--sh-glow-o, 0) * .5));
}
.sh-quote .elementor-heading-title {
    font-family: var(--sh-font-display);
    font-weight: 700;
    color: var(--sh-ivory);
    font-size: clamp(28px, 3vw, 38px);
    line-height: 1.2;
}
.sh-quote .sh-quote__by .elementor-heading-title {
    font-family: var(--sh-font-accent);
    font-size: 13px;
    letter-spacing: .3em;
    text-transform: uppercase;
    color: var(--sh-gold);
    font-weight: 500;
}
.e-con.sh-quote::before {
    content: "";
    display: block;
    position: absolute;
    inset: auto 0 0 auto;
    width: 202px;
    height: 214px;
    border: 0;
    border-radius: 0;
    background: url("../img/logo-icon.png") left top / 250px auto no-repeat;
    opacity: .14;
    mix-blend-mode: normal;
    pointer-events: none;
    z-index: 0;
}
.e-con.sh-quote > .elementor-element { position: relative; z-index: 1; }

/* ---------- Kuvapaikat (sh-photo): kuvakortti kehyksellä ja korttikuvat ----------
   Kuva on containerin Elementor-taustakuva; luokka sh-kuvavalitsin tuo editoriin
   kuvanvaihtajan ja sovituksen, sh-kansio-<slug> valitsee oletuskansion. */
.e-con.sh-photo {
    position: relative;
    min-height: 520px;
    border-radius: 0;
    background-color: var(--sh-ivory-deep);
    background-size: cover;
    background-position: center;
    box-shadow:
        -20px -20px 0 -1px var(--sh-ivory),
        -20px -20px 0 0 rgba(196, 154, 108, .6),
        0 40px 70px -40px rgba(17, 17, 17, .45);
}
/* Kehyskoukut kuvan sisänurkissa (korvaa Elementorin taustapeitteen ::beforen). */
.e-con.sh-photo::before {
    --sh-arm: 40px;
    --sh-c: var(--sh-gold);
    content: "";
    display: block;
    position: absolute;
    inset: 18px;
    width: auto;
    height: auto;
    border: 0;
    border-radius: 0;
    opacity: 1;
    mix-blend-mode: normal;
    z-index: 1;
    pointer-events: none;
    background:
        linear-gradient(var(--sh-c), var(--sh-c)) left top / var(--sh-arm) 2px,
        linear-gradient(var(--sh-c), var(--sh-c)) left top / 2px var(--sh-arm),
        linear-gradient(var(--sh-c), var(--sh-c)) right top / var(--sh-arm) 2px,
        linear-gradient(var(--sh-c), var(--sh-c)) right top / 2px var(--sh-arm),
        linear-gradient(var(--sh-c), var(--sh-c)) left bottom / var(--sh-arm) 2px,
        linear-gradient(var(--sh-c), var(--sh-c)) left bottom / 2px var(--sh-arm),
        linear-gradient(var(--sh-c), var(--sh-c)) right bottom / var(--sh-arm) 2px,
        linear-gradient(var(--sh-c), var(--sh-c)) right bottom / 2px var(--sh-arm);
    background-repeat: no-repeat;
}
.e-con.sh-ei-kehysta::before { display: none !important; }
.e-con.sh-photo.sh-ei-kehysta { box-shadow: 0 40px 70px -40px rgba(17, 17, 17, .45); }

.e-con.sh-card > .e-con.sh-card__photo {
    width: auto;
    min-height: 190px;
    margin: -36px -30px 10px;
    background-color: var(--sh-ivory-deep);
    background-size: cover;
    background-position: center;
    filter: saturate(.92);
    transition: filter .5s ease;
}
.e-con.sh-card:hover > .e-con.sh-card__photo { filter: saturate(1.05); }

@media (max-width: 1024px) {
    .e-con.sh-photo { min-height: 440px; }
}
@media (max-width: 767px) {
    .e-con.sh-photo {
        min-height: 360px;
        margin: 12px 0 0 12px;
        max-width: calc(100% - 12px);
        box-shadow: -12px -12px 0 -1px var(--sh-ivory), -12px -12px 0 0 rgba(196, 154, 108, .6), 0 30px 60px -40px rgba(17, 17, 17, .45);
    }
    .e-con.sh-photo::before { inset: 12px; --sh-arm: 30px; }
    .e-con.sh-card > .e-con.sh-card__photo { min-height: 210px; }
}

/* ---------- CTA ---------- */
.e-con.sh-cta {
    --padding-top: 104px;
    --padding-bottom: 104px;
    position: relative;
    overflow: hidden;
    text-align: center;
}
.e-con.sh-cta::after {
    background:
        radial-gradient(closest-side at 50% 120%, rgba(196, 154, 108, .30), transparent),
        radial-gradient(closest-side at 85% 10%, rgba(196, 154, 108, .10), transparent);
}
.sh-cta .sh-cta__inner { --gap: 20px; align-items: center; max-width: 720px; margin-inline: auto; }
.sh-cta .elementor-heading-title { color: var(--sh-ivory); }
.sh-cta .sh-lead { color: rgba(254, 249, 243, .75); }

/* =========================================================
   Alasivut
   ========================================================= */
.e-con.sh-page-hero { --padding-top: 88px; --padding-bottom: 80px; }
.sh-page-hero .sh-hero__copy { max-width: 820px; }
.sh-page-hero .sh-h1 .elementor-heading-title { font-size: clamp(40px, 4.8vw, 62px); }

/* Korttien yhteinen pohja (hohde + ohut viiva) myös alasivujen laatikoille */
.e-con.sh-glow-card {
    border-radius: 0;
    background-color: #fff;
    background-image: radial-gradient(420px circle at var(--mx) var(--my), rgba(196, 154, 108, calc(var(--sh-glow-o, 0) * .08)), transparent 65%);
    box-shadow:
        inset 0 0 0 1px var(--sh-line),
        0 30px 60px -44px rgba(196, 154, 108, calc(var(--sh-glow-o, 0) * 1));
    transition: var(--sh-tr-hover);
}

/* ---------- Hinnasto ---------- */
.e-con.sh-price { --padding-top: 8px; --padding-bottom: 8px; --padding-left: 40px; --padding-right: 40px; }
.sh-price table {
    width: 100%;
    margin: 0;
    border-collapse: collapse;
    font-size: 16px;
}
.sh-price table th,
.sh-price table td {
    padding: 22px 16px;
    border: 0;
    background: none;
    text-align: left;
    vertical-align: top;
    line-height: 1.55;
}
.sh-price table thead:first-child tr:first-child th {
    padding-top: 30px;
    padding-bottom: 14px;
    border: 0;
    border-bottom: 1px solid var(--sh-black);
    font-family: var(--sh-font-accent);
    font-weight: 500;
    font-size: 12px;
    letter-spacing: .24em;
    text-transform: uppercase;
    color: var(--sh-gold-dark);
}
.sh-price table tbody > tr:nth-child(n) > td {
    background: none;
    border-bottom: 1px solid var(--sh-line);
    transition: background-color .3s ease;
}
.sh-price table tbody > tr:last-child > td { border-bottom: 0; }
.sh-price table tbody > tr:hover > td { background: rgba(196, 154, 108, .07); }
.sh-price table td:first-child { width: 30%; font-family: var(--sh-font-display); font-weight: 700; font-size: 19px; color: var(--sh-black); }
.sh-price table td:nth-child(2) { color: var(--sh-muted); }
.sh-price table th:last-child,
.sh-price table td:last-child { text-align: right; white-space: nowrap; }
.sh-table:not(.sh-table--last-right) table th:last-child,
.sh-table:not(.sh-table--last-right) table td:last-child { text-align: left; white-space: normal; }
.sh-price table td:last-child { font-family: var(--sh-font-display); font-weight: 800; font-size: 20px; color: var(--sh-black); }
/* Useampi hintasarake (esim. Hinta / Kelakorvaus / Omavastuu): kaikki 3. sarakkeesta alkaen oikealle */
.sh-table--last-right table th:nth-child(n+3),
.sh-table--last-right table td:nth-child(n+3) { text-align: right; font-variant-numeric: tabular-nums; }
.sh-table--wide table td:first-child { width: 40%; }
.sh-table [hidden] { display: none !important; }
/* Koko levyiset rivit: ryhmän otsikko ja huomautus */
.sh-price table tbody + tbody { border-top: 0; }
.sh-price table .sh-table__group th {
    padding: 52px 16px 14px;
    border-bottom: 1px solid var(--sh-gold);
    background: none;
    font-family: var(--sh-font-display);
    font-weight: 700;
    font-size: 15px;
    letter-spacing: .14em;
    color: var(--sh-gold-dark);
    text-align: left;
    white-space: normal;
}
.sh-price table tbody:first-of-type .sh-table__group th { padding-top: 30px; }
.sh-price table tbody > tr.sh-table__note > td {
    width: auto;
    padding-top: 16px;
    padding-bottom: 16px;
    font-family: var(--sh-font-body);
    font-weight: 400;
    font-size: 14px;
    line-height: 1.7;
    color: var(--sh-muted);
    text-align: left;
    white-space: normal;
}
.sh-price table tbody > tr.sh-table__note:hover > td { background: none; }
/* 4+ näkyvää saraketta ei mahdu tabletille: korttinäkymä jo 1024 px:stä alkaen,
   arvot omille riveilleen sarakkeen nimen kanssa (data-label) */
@media (max-width: 1024px) {
    .sh-table--wide table thead { display: none; }
    .sh-price.sh-table--wide table tbody > tr {
        display: grid;
        grid-template-columns: 1fr;
        padding: 18px 0;
        border-bottom: 1px solid var(--sh-line);
    }
    .sh-price.sh-table--wide table tbody > tr:last-child { border-bottom: 0; }
    .sh-price.sh-table--wide table tbody > tr:nth-child(n) > td { padding: 0; border: 0; width: auto; }
    .sh-price.sh-table--wide table td:nth-child(2) { margin-top: 6px; font-size: 15px; }
    .sh-price.sh-table--wide table td:nth-child(n+3) {
        display: flex;
        justify-content: space-between;
        align-items: baseline;
        gap: 16px;
        margin-top: 6px;
        text-align: right;
    }
    .sh-price.sh-table--wide table td:nth-child(n+3)::before {
        content: attr(data-label);
        font-family: var(--sh-font-body);
        font-weight: 400;
        font-size: 14px;
        color: var(--sh-muted);
        text-align: left;
    }
    .sh-price.sh-table--wide table td:nth-child(n+3):empty { display: none; }
    .sh-price.sh-table--wide table tbody > tr.sh-table__group,
    .sh-price.sh-table--wide table tbody > tr.sh-table__note { display: block; padding: 0; border-bottom: 0; }
    .sh-price.sh-table--wide table .sh-table__group th { display: block; padding: 40px 0 12px; font-size: 14px; }
    .sh-price.sh-table--wide table tbody:first-of-type .sh-table__group th { padding-top: 24px; }
    .sh-price.sh-table--wide table tbody > tr.sh-table__note > td { display: block; padding: 14px 0; border-bottom: 1px solid var(--sh-line); }
}
.sh-note { font-size: 14px; line-height: 1.7; color: var(--sh-muted); }
.sh-note p:last-child { margin-bottom: 0; }

/* ---------- Yhteystiedot ---------- */
.e-con.sh-contact {
    --padding-top: 52px; --padding-bottom: 44px; --padding-left: 48px; --padding-right: 48px;
    --gap: 12px;
}
.sh-monogram .elementor-heading-title {
    display: inline-grid;
    place-items: center;
    width: 84px;
    height: 84px;
    margin-bottom: 10px;
    padding-top: 4px;
    box-shadow: inset 0 0 0 1px var(--sh-gold);
    font-family: var(--sh-font-display);
    font-weight: 800;
    font-size: 32px;
    letter-spacing: .04em;
    color: var(--sh-gold-dark);
}
.sh-contact-list ul { display: grid; margin: 10px 0 0; padding: 0; list-style: none; }
.sh-contact-list li {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 16px;
    padding: 15px 0;
    border-top: 1px solid var(--sh-line);
    font-size: 16px;
    color: var(--sh-text);
}
.sh-contact-list li > span:first-child {
    font-family: var(--sh-font-accent);
    font-size: 12px;
    letter-spacing: .24em;
    text-transform: uppercase;
    color: var(--sh-gold-dark);
}
.sh-contact-list a {
    color: var(--sh-black);
    font-weight: 700;
    text-decoration: none;
    background: linear-gradient(var(--sh-gold), var(--sh-gold)) 0 100% / 0 1px no-repeat;
    transition: background-size .4s var(--sh-ease);
}
.sh-contact-list a:hover,
.sh-contact-list a:focus-visible { background-size: 100% 1px; }

/* ---------- Toiminta-aluekartta ---------- */
.sh-areamap {
    position: relative;
    background: var(--sh-ivory-deep);
    box-shadow:
        20px 20px 0 -1px var(--sh-ivory),
        20px 20px 0 0 rgba(196, 154, 108, .6),
        0 0 46px -14px rgba(196, 154, 108, calc(var(--sh-glow-o, 0) * .55));
}
.sh-areamap__map {
    width: 100%;
    height: 500px;
    opacity: 0;
    transition: opacity .8s ease;
}
.sh-areamap.is-ready .sh-areamap__map { opacity: 1; }
.sh-areamap.is-error::before {
    content: "Karttaa ei voitu ladata.";
    position: absolute;
    inset: 0;
    display: grid;
    place-items: center;
    color: var(--sh-muted);
}
.sh-areamap__badge {
    position: absolute;
    left: 0;
    top: 0;
    z-index: 2;
    padding: 10px 16px;
    background: var(--sh-black);
    font-family: var(--sh-font-accent);
    font-size: 12px;
    letter-spacing: .26em;
    text-transform: uppercase;
    color: var(--sh-gold);
    cursor: pointer;
    transition: background-color .3s ease, color .3s ease;
}
.sh-areamap__badge:hover,
.sh-areamap__badge:focus-visible { background: var(--sh-gold); color: var(--sh-black); }
.sh-areamap .maplibregl-ctrl-group { border-radius: 0; box-shadow: 0 0 0 1px var(--sh-line); }
.sh-areamap .maplibregl-ctrl-group button { border-radius: 0; }
.sh-areamap .maplibregl-cooperative-gesture-screen { font-family: var(--sh-font-body); }

.sh-areamap__chips {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin: 36px 0 0;
    padding: 0;
    list-style: none;
}
.sh-areamap__chip {
    display: inline-flex;
    align-items: baseline;
    gap: 10px;
    padding: 12px 18px;
    border: 0;
    border-radius: 0;
    background: #fff;
    box-shadow: inset 0 0 0 1px var(--sh-line);
    font-family: var(--sh-font-body);
    font-weight: 700;
    font-size: 15px;
    color: var(--sh-black);
    cursor: pointer;
    transition: background-color .3s ease, color .3s ease, box-shadow .3s ease;
}
.sh-areamap__chip span {
    font-family: var(--sh-font-accent);
    font-weight: 500;
    font-size: 11px;
    letter-spacing: .2em;
    text-transform: uppercase;
    color: var(--sh-gold-dark);
    transition: color .3s ease;
}
.sh-areamap__chip:hover,
.sh-areamap__chip:focus { background: #fff; color: var(--sh-black); box-shadow: inset 0 0 0 1px var(--sh-gold); }
.sh-areamap__chip[aria-pressed="true"],
.sh-areamap__chip[aria-pressed="true"]:focus { background: var(--sh-black); color: var(--sh-ivory); box-shadow: inset 0 0 0 1px var(--sh-black); }
.sh-areamap__chip[aria-pressed="true"] span { color: var(--sh-gold); }

@media (max-width: 767px) {
    .e-con.sh-price { --padding-left: 20px; --padding-right: 20px; }
    .sh-price table thead { display: none; }
    .sh-price table tbody > tr {
        display: grid;
        grid-template-columns: 1fr auto;
        column-gap: 16px;
        padding: 18px 0;
        border-bottom: 1px solid var(--sh-line);
    }
    .sh-price table tbody > tr:last-child { border-bottom: 0; }
    .sh-price table tbody > tr:nth-child(n) > td { padding: 0; border: 0; width: auto; }
    .sh-price table td:nth-child(2) { grid-column: 1 / -1; grid-row: 2; margin-top: 6px; font-size: 15px; }
    .sh-table--cols-2 table td:nth-child(2) { grid-column: auto; grid-row: auto; margin-top: 0; font-size: 20px; }
    .sh-price table tbody > tr.sh-table__group,
    .sh-price table tbody > tr.sh-table__note { display: block; padding: 0; border-bottom: 0; }
    .sh-price table .sh-table__group th { display: block; padding: 40px 0 12px; font-size: 14px; }
    .sh-price table tbody:first-of-type .sh-table__group th { padding-top: 24px; }
    .sh-price table tbody > tr.sh-table__note > td { display: block; padding: 14px 0; border-bottom: 1px solid var(--sh-line); }
    .e-con.sh-contact { --padding-left: 24px; --padding-right: 24px; --padding-top: 40px; }
    .sh-contact-list li { flex-direction: column; gap: 4px; }
    .sh-areamap { max-width: calc(100% - 12px); box-shadow: 12px 12px 0 -1px var(--sh-ivory), 12px 12px 0 0 rgba(196, 154, 108, .6); }
    .sh-areamap__map { height: 380px; }
}

/* ---------- Ajanvaraus: soittokortti ja lomake ---------- */
.e-con.sh-call { align-self: flex-start; --padding-top: 48px; --padding-bottom: 44px; --padding-left: 44px; --padding-right: 44px; --gap: 14px; }
.sh-phone .elementor-heading-title {
    font-family: var(--sh-font-display);
    font-weight: 800;
    font-size: clamp(34px, 3.6vw, 46px);
    line-height: 1.05;
    letter-spacing: .01em;
}
.sh-phone .elementor-heading-title a { color: var(--sh-black); text-decoration: none; transition: color .3s ease; }
.sh-phone .elementor-heading-title a:hover,
.sh-phone .elementor-heading-title a:focus-visible { color: var(--sh-gold-dark); }
.e-con.sh-form-card { --padding-top: 44px; --padding-bottom: 40px; --padding-left: 44px; --padding-right: 44px; --gap: 10px; }

.sh-form { display: grid; gap: 18px; }
.sh-field { display: grid; gap: 7px; }
.sh-field label {
    font-family: var(--sh-font-accent);
    font-weight: 500;
    font-size: 12px;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: var(--sh-gold-dark);
}
.sh-field label span { color: var(--sh-gold); }
.sh-form input,
.sh-form textarea,
.sh-form select {
    width: 100%;
    min-height: 52px;
    padding: 14px 16px;
    border: 0;
    border-radius: 0;
    background: var(--sh-ivory);
    box-shadow: inset 0 0 0 1px var(--sh-line);
    font-family: var(--sh-font-body);
    font-size: 17px;
    color: var(--sh-black);
    transition: box-shadow .25s ease, background-color .25s ease;
}
.sh-form textarea { min-height: 140px; resize: vertical; line-height: 1.6; }
.sh-form input:hover,
.sh-form textarea:hover,
.sh-form select:hover { box-shadow: inset 0 0 0 1px var(--sh-gold); }
.sh-form input:focus,
.sh-form textarea:focus,
.sh-form select:focus {
    outline: none;
    background: #fff;
    box-shadow: inset 0 0 0 2px var(--sh-gold), 0 0 0 4px rgba(196, 154, 108, .18);
}
.sh-select { position: relative; }
.sh-select select { appearance: none; -webkit-appearance: none; padding-right: 48px; cursor: pointer; }
.sh-select::after {
    content: "";
    position: absolute;
    right: 20px;
    top: 50%;
    width: 8px;
    height: 8px;
    border: solid var(--sh-gold-dark);
    border-width: 0 2px 2px 0;
    transform: translateY(-70%) rotate(45deg);
    pointer-events: none;
}
.sh-field.is-invalid input,
.sh-field.is-invalid textarea { box-shadow: inset 0 0 0 2px #b3261e; background: #fff; }
.sh-field__error { margin: 0; min-height: 0; font-size: 14px; color: #b3261e; }
.sh-field__error:empty { display: none; }
.sh-form__submit { justify-self: start; min-height: 54px; padding: 0 34px; border: 0; cursor: pointer; }
.sh-form__status { margin: 0; font-size: 15px; line-height: 1.6; }
.sh-form__status:empty { display: none; }
.sh-form__status.is-ok { padding: 14px 16px; background: rgba(196, 154, 108, .14); box-shadow: inset 3px 0 0 var(--sh-gold); color: var(--sh-text); }
.sh-form__status.is-error { color: #b3261e; }

@media (max-width: 767px) {
    .e-con.sh-call,
    .e-con.sh-form-card { --padding-left: 22px; --padding-right: 22px; --padding-top: 36px; }
    .sh-form__submit { justify-self: stretch; }
}

/* =========================================================
   Liike
   - Hero: sisääntulo puhtaalla CSS:llä heti ensimmäisestä piirrosta.
   - Muut osiot: effects.js lisää .sh-reveal-luokan vain elementeille, jotka ovat
     latautuessa näkymän alapuolella, ja .is-visible kun ne vieritetään esiin.
   ========================================================= */
@keyframes sh-rise { from { opacity: 0; transform: translate3d(0, 28px, 0); } }
@keyframes sh-wipe {
    from { clip-path: inset(-10% -10% 110% -10%); }
    to   { clip-path: inset(-10% -10% -10% -10%); }
}
@keyframes sh-line { from { transform: scaleX(0); } }

.sh-hero__copy > .elementor-element { animation: sh-rise 1s var(--sh-ease) both; }
.sh-hero__copy > .elementor-element:nth-child(2) { animation-delay: .09s; }
.sh-hero__copy > .elementor-element:nth-child(3) { animation-delay: .18s; }
.sh-hero__copy > .elementor-element:nth-child(4) { animation-delay: .27s; }
.sh-hero__copy > .elementor-element:nth-child(5) { animation-delay: .36s; }
.sh-hero__copy > .sh-h1 .elementor-heading-title { animation: sh-wipe 1.3s var(--sh-ease) .09s both; }
.sh-hero__copy > .sh-eyebrow .elementor-heading-title::before { animation: sh-line 1s var(--sh-ease) .3s both; }
.sh-hero__visual { animation: sh-rise 1.1s var(--sh-ease) .4s both; }

/* Elementor-editorissa ei sisääntuloanimaatioita, jotta muokkaus pysyy rauhallisena. */
.elementor-editor-active .sh-hero__copy > .elementor-element,
.elementor-editor-active .sh-hero__copy > .sh-h1 .elementor-heading-title,
.elementor-editor-active .sh-hero__copy > .sh-eyebrow .elementor-heading-title::before,
.elementor-editor-active .sh-hero__visual { animation: none; }

.elementor-element.sh-reveal {
    opacity: 0;
    transform: translate3d(0, 28px, 0);
    transition: opacity .9s var(--sh-ease), transform 1.1s var(--sh-ease), var(--sh-tr-hover);
}
.elementor-element.sh-reveal.is-visible {
    opacity: 1;
    transform: none;
}
/* Isot otsikot paljastuvat lisäksi pyyhkäisten. Rajaus on sisemmässä tekstielementissä,
   jotta IntersectionObserver näkee itse widgetin. Viive peritään widgetiltä. */
.elementor-element.sh-reveal:is(.sh-h1, .sh-h2) .elementor-heading-title {
    clip-path: inset(-10% -10% 110% -10%);
    transition: clip-path 1.3s var(--sh-ease);
    transition-delay: inherit;
}
.elementor-element.sh-reveal.is-visible:is(.sh-h1, .sh-h2) .elementor-heading-title {
    clip-path: inset(-10% -10% -10% -10%);
}

/* =========================================================
   Footer
   ========================================================= */
.sh-footer {
    background: var(--sh-black);
    color: rgba(254, 249, 243, .72);
    font-size: 15px;
    border-top: 1px solid rgba(196, 154, 108, .25);
}
.sh-footer__inner {
    display: grid;
    grid-template-columns: 1.4fr 1fr;
    gap: 40px;
    padding-block: 56px 40px;
}
.sh-footer .sh-brand__name { color: var(--sh-ivory); }
.sh-footer__text { max-width: 420px; margin: 18px 0 0; line-height: 1.65; }
.sh-footer__title {
    margin: 0 0 14px;
    font-family: var(--sh-font-accent);
    font-size: 13px;
    font-weight: 500;
    letter-spacing: .3em;
    text-transform: uppercase;
    color: var(--sh-gold);
}
.sh-footer__links { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.sh-footer__links a { color: var(--sh-ivory); text-decoration: none; transition: color .2s; }
.sh-footer__links a:hover { color: var(--sh-gold); }
.sh-footer__bottom {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    gap: 8px 24px;
    padding-block: 20px;
    border-top: 1px solid rgba(254, 249, 243, .12);
    font-size: 14px;
}

/* =========================================================
   Responsiivisuus
   ========================================================= */
@media (max-width: 1240px) {
    .sh-header__inner { gap: 16px; }
    .sh-nav { gap: 14px; }
    .sh-menu a { padding: 10px 9px; font-size: 15px; }
    .sh-menu a::after { left: 9px; right: 9px; }
    .sh-brand__icon { height: 48px; }
    .sh-brand__name { font-size: 22px; }
    .sh-brand__tagline { font-size: 10px; letter-spacing: .26em; }
    .sh-btn { padding: 0 20px; font-size: 13px; }
}

@media (max-width: 1024px) {
    .sh-nav-toggle { display: inline-flex; }

    .sh-nav {
        position: absolute;
        top: 100%;
        left: 0;
        right: 0;
        flex-direction: column;
        align-items: stretch;
        gap: 16px;
        padding: 16px 24px 28px;
        background: var(--sh-ivory);
        border-bottom: 1px solid var(--sh-line);
        box-shadow: 0 18px 30px -20px rgba(17, 17, 17, .4);
        display: none;
    }
    .sh-nav.is-open { display: flex; animation: sh-drop .45s var(--sh-ease); }
    @keyframes sh-drop { from { opacity: 0; transform: translateY(-8px); } }

    .sh-menu {
        flex-direction: column;
        align-items: stretch;
        gap: 0;
    }
    .sh-menu a {
        padding: 14px 4px;
        font-size: 18px;
        border-bottom: 1px solid var(--sh-line);
    }
    .sh-menu a::after { display: none; }
    .sh-menu .current-menu-item > a,
    .sh-menu .current_page_item > a { color: var(--sh-gold-dark); }

    .sh-nav__cta { width: 100%; min-height: 54px; font-size: 15px; }

    .e-con.sh-section { --padding-top: 88px; --padding-bottom: 88px; }
    .e-con.sh-grid,
    .e-con.sh-grid--4 { --sh-cols: 2; }
    .sh-split { --gap: 48px; }
}

@media (max-width: 782px) {
    .admin-bar .sh-header { top: 46px; }
}

@media (max-width: 767px) {
    .e-con.sh-section { --padding-top: 68px; --padding-bottom: 68px; --padding-left: 16px; --padding-right: 16px; }
    .e-con.sh-hero { --padding-top: 52px; --padding-bottom: 72px; }
    .e-con.sh-grid,
    .e-con.sh-grid--4 { --sh-cols: 1; }
    .sh-section-head { margin-bottom: 40px; }
    .sh-lead { font-size: 17px; }
    .sh-hero__actions .elementor-widget-button,
    .sh-hero__actions .elementor-button { width: 100%; justify-content: center; }
    .e-con.sh-hero__card { --padding-top: 40px; --padding-bottom: 36px; --padding-left: 24px; --padding-right: 24px; max-width: calc(100% - 12px); }
    .e-con.sh-hero__card::before { top: 12px; left: 12px; }
    .sh-hero__card .elementor-widget-image img { width: 120px; }
    .e-con.sh-quote {
        --padding-left: 28px; --padding-right: 28px; --padding-top: 44px; --padding-bottom: 44px;
        margin: 12px 0 0 12px;
        max-width: calc(100% - 12px);
        box-shadow:
            -12px -12px 0 -1px var(--sh-ivory),
            -12px -12px 0 0 rgba(196, 154, 108, .6),
            0 30px 60px -40px rgba(17, 17, 17, .6);
    }
    .sh-step__num .elementor-heading-title { font-size: 60px; }
    .sh-footer__inner { grid-template-columns: 1fr; padding-block: 44px 28px; }
}

@media (max-width: 600px) {
    .admin-bar .sh-header { top: 0; }
}

@media (max-width: 560px) {
    :root { --sh-header-h: 74px; }
    .sh-container { padding-inline: 16px; }
    .sh-topbar__claim { font-size: 11px; letter-spacing: .08em; text-align: center; }
    .sh-brand__icon { height: 44px; }
    .sh-brand__name { font-size: 20px; }
    .sh-brand__tagline { font-size: 9px; letter-spacing: .24em; }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation: none !important;
        transition: none !important;
    }
}