@charset "UTF-8";
@font-face {
    font-family: 'SakolenterContact';
    src: url('../fonts/contact-reference-v1/contact-regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'SakolenterContact';
    src: url('../fonts/contact-reference-v1/contact-bold.woff') format('woff');
    font-weight: 600 800;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'SakolenterContact';
    src: url('../fonts/contact-reference-v1/contact-extrabold.woff') format('woff');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}
/* Sakolenter contact page: approved reference, native MVC form, WebP artwork. */
.html-contact-reference body,
.html-contact-reference .page-wrapper { background: #f8f9fb; }
.html-contact-reference .sc-contact-shell { display: flow-root; width: 100%; max-width: none; margin: 0; padding: 0; }
#sakolenter-contact-reference {
    --sc-contact-red: #f5223d;
    --sc-contact-muted: #7b8598;
    --sc-contact-border: #e3e8ef;
    --sc-contact-gutter: 38px;
    width: calc(100% - var(--sc-contact-gutter) - var(--sc-contact-gutter));
    max-width: none;
    margin: 0 auto 20px;
    padding: 0;
    color: #15171b;
    font-family: 'SakolenterContact', estedad, Tahoma, sans-serif;
    font-size: 14px;
    line-height: 1.8;
    text-align: right;
    direction: rtl;
}
#sakolenter-contact-reference *,
#sakolenter-contact-reference *::before,
#sakolenter-contact-reference *::after { box-sizing: border-box; }
#sakolenter-contact-reference h1,
#sakolenter-contact-reference h2,
#sakolenter-contact-reference p { margin: 0; padding: 0; font-family: inherit; }
#sakolenter-contact-reference a { text-decoration: none; }
#sakolenter-contact-reference .sc-contact-icon { display: block; flex: 0 0 auto; width: 24px; height: 24px; overflow: visible; }
#sakolenter-contact-reference a:focus-visible,
#sakolenter-contact-reference button:focus-visible { outline: 2px solid var(--sc-contact-red); outline-offset: 4px; }

#sakolenter-contact-reference .sc-contact-hero {
    position: relative;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 136px;
    align-items: center;
    min-height: max(204px, calc((100vw - var(--sc-contact-gutter) - var(--sc-contact-gutter)) * .15644));
    margin: 0;
    padding: 24px 26px 24px 61%;
    overflow: hidden;
    isolation: isolate;
    border: 1px solid #232930;
    border-radius: 12px;
    background: linear-gradient(120deg, #171c22, #12171d);
    color: #fff;
    direction: ltr;
}
#sakolenter-contact-reference .sc-contact-hero__visual {
    position: absolute;
    z-index: -1;
    inset: 0 auto 0 0;
    width: 59%;
    overflow: hidden;
    background: #151b22;
}
#sakolenter-contact-reference .sc-contact-hero__visual::before {
    /* Photo window in the approved 1380x1140 artwork: x=38,y=125,w=770,h=202.
       The UI text outside this photographic window is never displayed. */
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    aspect-ratio: 770 / 202;
    transform: translateY(-50%);
    background-image: url('../img/contact-reference-v1/contact-hero-source.webp');
    background-size: 179.220779% 564.356436%;
    background-position: 6.229508% 13.326226%;
    background-repeat: no-repeat;
}
#sakolenter-contact-reference .sc-contact-hero__visual::after {
    content: "";
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    width: 12px;
    background: linear-gradient(90deg, transparent, #171c22);
}
#sakolenter-contact-reference .sc-contact-hero__copy { grid-column: 1; min-width: 0; direction: rtl; text-align: right; }
#sakolenter-contact-reference .sc-contact-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 11px; margin: 0 0 13px; font-size: 11px; line-height: 1.9; color: #d1d5dc; }
#sakolenter-contact-reference .sc-contact-breadcrumb a { color: inherit; }
#sakolenter-contact-reference .sc-contact-breadcrumb a:hover { color: #fff; text-decoration: underline; }
#sakolenter-contact-reference .sc-contact-breadcrumb > span[aria-hidden] { color: #7c838d; }
#sakolenter-contact-reference .sc-contact-hero h1 { color: #fff; font-size: clamp(30px, 3.4vw, 46px); font-weight: 900; line-height: 1.6; white-space: nowrap; }
#sakolenter-contact-reference .sc-contact-hero p { margin-top: 3px; color: #fff; font-size: 18px; font-weight: 400; line-height: 1.9; white-space: nowrap; }
#sakolenter-contact-reference .sc-contact-hero__icon { grid-column: 2; justify-self: end; display: flex; width: 126px; height: 126px; align-items: center; justify-content: center; margin: 0; border: 2px solid rgba(245,34,61,.1); border-radius: 50%; background: radial-gradient(circle, rgba(173,13,38,.30), rgba(94,12,28,.20)); color: #fff; }
#sakolenter-contact-reference .sc-contact-hero__icon .sc-contact-icon { width: 64px; height: 64px; stroke-width: 1.35; }

#sakolenter-contact-reference .sc-contact-layout { display: grid; grid-template-columns: minmax(0, 1.82fr) minmax(0, 1fr); grid-template-areas: "form info"; align-items: start; gap: 22px; margin-top: 19px; direction: ltr; }
#sakolenter-contact-reference .sc-contact-card { display: block; min-width: 0; margin: 0; border: 1px solid var(--sc-contact-border); border-radius: 12px; background: #fff; box-shadow: 0 4px 20px rgba(32,43,64,.022); }
#sakolenter-contact-reference .sc-contact-form-card { grid-area: form; padding: 20px 24px 25px; direction: rtl; }
#sakolenter-contact-reference .sc-contact-form-card h2 { color: #11151b; font-size: 24px; font-weight: 900; line-height: 1.5; }
#sakolenter-contact-reference .sc-contact-form-intro { margin-top: 7px; color: var(--sc-contact-muted); font-size: 14px; line-height: 1.9; }
#sakolenter-contact-reference .sc-contact-message-form { margin: 15px 0 0; padding: 0; }
#sakolenter-contact-reference .sc-contact-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin: 0; }
#sakolenter-contact-reference .sc-contact-field { min-width: 0; margin: 0; padding: 0; }
#sakolenter-contact-reference .sc-contact-field--wide { grid-column: 1 / -1; }
#sakolenter-contact-reference .sc-contact-field > label { display: block; width: 100%; margin: 0 0 7px; padding: 0; color: #20242c; font-family: inherit; font-size: 14px; font-weight: 700; line-height: 1.9; text-align: right; }
#sakolenter-contact-reference .sc-contact-input-wrap { position: relative; min-width: 0; }
#sakolenter-contact-reference .sc-contact-input-wrap > .sc-contact-icon { position: absolute; z-index: 1; top: 50%; right: 14px; width: 19px; height: 19px; transform: translateY(-50%); color: #8994a5; pointer-events: none; }
#sakolenter-contact-reference .sc-contact-input {
    display: block;
    width: 100%;
    min-width: 0;
    height: 50px;
    margin: 0;
    padding: 11px 45px 11px 15px;
    border: 1px solid #dfe5ed;
    border-radius: 8px;
    background: linear-gradient(180deg, #fcfdff, #fafbfd);
    color: #252b36;
    font-family: inherit;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.9;
    text-align: right;
    outline: none;
    box-shadow: none;
    transition: border-color .18s ease, box-shadow .18s ease;
}
#sakolenter-contact-reference .sc-contact-input::placeholder { color: #8793a7; opacity: 1; }
#sakolenter-contact-reference .sc-contact-input:focus { border-color: #ef8795; box-shadow: 0 0 0 3px rgba(245,34,61,.08); background: #fff; }
#sakolenter-contact-reference .sc-contact-field--email .sc-contact-input { text-align: left; direction: ltr; }
#sakolenter-contact-reference .sc-contact-textarea { min-height: 154px; height: 154px; max-width: 100%; padding-top: 12px; resize: vertical; }
#sakolenter-contact-reference .sc-contact-input-wrap--message > .sc-contact-icon { top: 16px; transform: none; }
#sakolenter-contact-reference .sc-contact-button { display: inline-flex; width: 100%; min-height: 50px; align-items: center; justify-content: center; gap: 12px; margin: 0; padding: 10px 15px; border: 1px solid var(--sc-contact-red); border-radius: 8px; background: linear-gradient(120deg, #fa1838, #f5223d); color: #fff; font-family: inherit; font-size: 15px; font-weight: 700; line-height: 1.8; text-align: center; cursor: pointer; transition: background-color .18s ease, box-shadow .18s ease; }
#sakolenter-contact-reference .sc-contact-button:hover { color: #fff; background: #e61b36; box-shadow: 0 4px 12px rgba(245,34,61,.16); }
#sakolenter-contact-reference .sc-contact-submit { min-height: 56px; margin-top: 3px; }
#sakolenter-contact-reference .sc-contact-button .sc-contact-icon { width: 24px; height: 24px; }
#sakolenter-contact-reference .field-validation-valid,
#sakolenter-contact-reference .validation-summary-valid { display: none; }
#sakolenter-contact-reference .field-validation-error { display: block; margin-top: 5px; color: #cf1b36; font-size: 12px; line-height: 1.8; }
#sakolenter-contact-reference .sc-contact-input.input-validation-error { border-color: #df5a70; background: #fff9fa; }
#sakolenter-contact-reference .sc-contact-validation { margin: 0 0 16px; padding: 12px 15px; border: 1px solid #f0b3bd; border-radius: 8px; background: #fff3f5; color: #ab1930; font-size: 12px; line-height: 1.9; }
#sakolenter-contact-reference .sc-contact-validation ul { margin: 0; padding: 0 20px 0 0; }
#sakolenter-contact-reference .sc-contact-success { display: flex; align-items: center; gap: 14px; min-height: 170px; margin-top: 24px; padding: 20px; border: 1px solid #bce4cd; border-radius: 10px; background: #f1fbf5; color: #167444; font-size: 15px; line-height: 2; }
#sakolenter-contact-reference .sc-contact-success .sc-contact-icon { width: 34px; height: 34px; }
#sakolenter-contact-reference .sc-contact-captcha { min-width: 0; overflow-x: auto; padding: 1px 0 4px; }

#sakolenter-contact-reference .sc-contact-info { grid-area: info; display: grid; grid-template-columns: minmax(0, 1fr); gap: 19px; min-width: 0; direction: rtl; }
#sakolenter-contact-reference .sc-contact-call-card,
#sakolenter-contact-reference .sc-contact-hours-card { padding: 16px 18px 19px; }
#sakolenter-contact-reference .sc-contact-card-heading { display: flex; align-items: center; gap: 14px; margin: 0 0 16px; }
#sakolenter-contact-reference .sc-contact-card-heading > div { flex: 1; min-width: 0; }
#sakolenter-contact-reference .sc-contact-icon-badge { display: inline-flex; flex: 0 0 74px; width: 74px; height: 74px; align-items: center; justify-content: center; border-radius: 50%; background: linear-gradient(130deg, #fce5e9, #fff1f3); color: var(--sc-contact-red); }
#sakolenter-contact-reference .sc-contact-icon-badge > .sc-contact-icon { width: 39px; height: 39px; }
#sakolenter-contact-reference .sc-contact-info h2 { color: #131820; font-size: 20px; font-weight: 900; line-height: 1.85; }
#sakolenter-contact-reference .sc-contact-card-heading p { margin-top: 7px; color: var(--sc-contact-muted); font-size: 12px; line-height: 1.9; }
#sakolenter-contact-reference .sc-contact-phone { display: flex; min-height: 57px; align-items: center; justify-content: center; gap: 18px; margin: 0 0 6px; padding: 8px 12px; border-radius: 9px; background: linear-gradient(100deg, #fff0f3, #fcedf0); color: var(--sc-contact-red); font-size: 25px; font-weight: 700; line-height: 1.5; }
#sakolenter-contact-reference .sc-contact-phone:hover { color: #df1731; background: #ffe9ee; }
#sakolenter-contact-reference .sc-contact-phone .sc-contact-icon { width: 29px; height: 29px; }
#sakolenter-contact-reference .sc-contact-call-button { min-height: 50px; }
#sakolenter-contact-reference .sc-contact-hours { display: grid; gap: 4px; margin: 0; padding: 11px 14px; border: 1px solid #e4e9f0; border-radius: 9px; background: linear-gradient(125deg, #f9fafc, #f5f7fa); }
#sakolenter-contact-reference .sc-contact-hours > div { display: flex; align-items: center; gap: 13px; min-width: 0; color: #1e2430; font-size: 13px; font-weight: 700; line-height: 1.85; }
#sakolenter-contact-reference .sc-contact-hours .sc-contact-icon { width: 19px; height: 19px; color: var(--sc-contact-red); }
#sakolenter-contact-reference .sc-contact-whatsapp { display: flex; align-items: center; gap: 13px; padding: 13px 18px; color: #121820; }
#sakolenter-contact-reference .sc-contact-whatsapp:hover { color: #128640; border-color: #b4d9c2; box-shadow: 0 5px 18px rgba(33,151,83,.07); }
#sakolenter-contact-reference .sc-contact-icon-badge--whatsapp { background: linear-gradient(130deg, #e6f5e9, #edf9ef); color: #08b946; }
#sakolenter-contact-reference .sc-contact-icon-badge--whatsapp .sc-contact-icon { width: 41px; height: 41px; }
#sakolenter-contact-reference .sc-contact-whatsapp-copy { display: flex; flex: 1; flex-direction: column; gap: 8px; min-width: 0; }
#sakolenter-contact-reference .sc-contact-whatsapp-copy strong { color: #161b23; font-size: 18px; font-weight: 900; line-height: 1.7; }
#sakolenter-contact-reference .sc-contact-whatsapp-copy small { color: var(--sc-contact-muted); font-size: 11px; line-height: 1.8; }
#sakolenter-contact-reference .sc-contact-whatsapp > .sc-contact-icon { width: 17px; height: 17px; color: #8390a3; }

#sakolenter-contact-reference .sc-contact-services { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: 22px 0 0; padding: 0; overflow: hidden; border: 1px solid var(--sc-contact-border); border-radius: 12px; background: linear-gradient(120deg, #fbfcfe, #f6f8fb); }
#sakolenter-contact-reference .sc-contact-services > div { display: flex; align-items: center; justify-content: center; gap: 16px; min-width: 0; min-height: 86px; padding: 12px 16px; border-left: 1px solid #e9edf3; }
#sakolenter-contact-reference .sc-contact-services > div:last-child { border-left: 0; }
#sakolenter-contact-reference .sc-contact-service-icon { display: flex; flex: 0 0 58px; width: 58px; height: 58px; align-items: center; justify-content: center; border-radius: 50%; background: #fce7eb; color: var(--sc-contact-red); }
#sakolenter-contact-reference .sc-contact-service-icon > .sc-contact-icon { width: 32px; height: 32px; }
#sakolenter-contact-reference .sc-contact-services > div > span:last-child { display: grid; gap: 3px; min-width: 0; }
#sakolenter-contact-reference .sc-contact-services strong { color: #1b202a; font-size: 14px; font-weight: 700; line-height: 1.8; }
#sakolenter-contact-reference .sc-contact-services small { color: var(--sc-contact-muted); font-size: 12px; line-height: 1.8; }

@media (min-width: 1600px) {
    #sakolenter-contact-reference .sc-contact-textarea { min-height: 180px; height: 180px; }
}
@media (max-width: 1199px) {
    #sakolenter-contact-reference { --sc-contact-gutter: 24px; }
    #sakolenter-contact-reference .sc-contact-hero { grid-template-columns: minmax(0, 1fr) 88px; padding-right: 22px; padding-left: 58%; }
    #sakolenter-contact-reference .sc-contact-hero__visual { width: 56%; }
    #sakolenter-contact-reference .sc-contact-hero h1 { font-size: 34px; }
    #sakolenter-contact-reference .sc-contact-hero p { font-size: 14px; }
    #sakolenter-contact-reference .sc-contact-hero__icon { width: 80px; height: 80px; }
    #sakolenter-contact-reference .sc-contact-hero__icon .sc-contact-icon { width: 44px; height: 44px; }
    #sakolenter-contact-reference .sc-contact-layout { grid-template-columns: minmax(0, 1.55fr) minmax(0, 1fr); gap: 18px; }
    #sakolenter-contact-reference .sc-contact-form-card { padding: 20px; }
    #sakolenter-contact-reference .sc-contact-form-card h2 { font-size: 21px; }
    #sakolenter-contact-reference .sc-contact-icon-badge { flex-basis: 58px; width: 58px; height: 58px; }
    #sakolenter-contact-reference .sc-contact-icon-badge > .sc-contact-icon { width: 32px; height: 32px; }
    #sakolenter-contact-reference .sc-contact-info h2 { font-size: 17px; }
    #sakolenter-contact-reference .sc-contact-phone { font-size: 22px; }
    #sakolenter-contact-reference .sc-contact-whatsapp-copy strong { font-size: 15px; }
    #sakolenter-contact-reference .sc-contact-services > div { gap: 10px; padding: 12px; }
    #sakolenter-contact-reference .sc-contact-service-icon { flex-basis: 44px; width: 44px; height: 44px; }
    #sakolenter-contact-reference .sc-contact-service-icon > .sc-contact-icon { width: 27px; height: 27px; }
    #sakolenter-contact-reference .sc-contact-services strong { font-size: 12px; }
    #sakolenter-contact-reference .sc-contact-services small { font-size: 11px; }
}
@media (max-width: 991px) {
    #sakolenter-contact-reference { --sc-contact-gutter: 16px; }
    #sakolenter-contact-reference .sc-contact-hero { grid-template-columns: minmax(0, 1fr) 94px; min-height: 205px; padding: 26px 24px 26px 49%; }
    #sakolenter-contact-reference .sc-contact-hero__visual { width: 45%; }
    #sakolenter-contact-reference .sc-contact-hero__copy { position: relative; }
    #sakolenter-contact-reference .sc-contact-hero h1 { font-size: 32px; }
    #sakolenter-contact-reference .sc-contact-hero p { font-size: 13px; white-space: normal; }
    #sakolenter-contact-reference .sc-contact-layout { grid-template-columns: minmax(0, 1fr); grid-template-areas: "info" "form"; }
    #sakolenter-contact-reference .sc-contact-info { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
    #sakolenter-contact-reference .sc-contact-whatsapp { grid-column: 1 / -1; }
    #sakolenter-contact-reference .sc-contact-services { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    #sakolenter-contact-reference .sc-contact-services > div:nth-child(2) { border-left: 0; }
    #sakolenter-contact-reference .sc-contact-services > div:nth-child(-n+2) { border-bottom: 1px solid #e9edf3; }
    #sakolenter-contact-reference .sc-contact-services > div { justify-content: flex-start; }
}
@media (max-width: 575px) {
    #sakolenter-contact-reference { --sc-contact-gutter: 12px; margin-bottom: 16px; }
    #sakolenter-contact-reference .sc-contact-hero { grid-template-columns: minmax(0, 1fr) 90px; grid-template-rows: auto auto; min-height: 0; align-items: center; padding: 0; }
    #sakolenter-contact-reference .sc-contact-hero__visual { position: relative; grid-column: 1 / -1; grid-row: 1; inset: auto; width: 100%; height: auto; aspect-ratio: 770 / 202; }
    #sakolenter-contact-reference .sc-contact-hero__visual::after { inset: auto 0 0; width: 100%; height: 25px; background: linear-gradient(180deg, transparent, #171c22); }
    #sakolenter-contact-reference .sc-contact-hero__copy { grid-row: 2; align-self: center; padding: 18px 6px 20px 18px; }
    #sakolenter-contact-reference .sc-contact-breadcrumb { margin-bottom: 7px; font-size: 10px; }
    #sakolenter-contact-reference .sc-contact-hero h1 { font-size: 30px; line-height: 1.7; }
    #sakolenter-contact-reference .sc-contact-hero p { font-size: 11px; line-height: 1.8; }
    #sakolenter-contact-reference .sc-contact-hero__icon { grid-row: 2; width: 68px; height: 68px; align-self: center; justify-self: center; margin: 0 10px 0 0; }
    #sakolenter-contact-reference .sc-contact-hero__icon .sc-contact-icon { width: 36px; height: 36px; }
    #sakolenter-contact-reference .sc-contact-info { grid-template-columns: minmax(0, 1fr); gap: 14px; }
    #sakolenter-contact-reference .sc-contact-layout { gap: 16px; margin-top: 16px; }
    #sakolenter-contact-reference .sc-contact-form-card { padding: 18px 16px; }
    #sakolenter-contact-reference .sc-contact-form-card h2 { font-size: 18px; }
    #sakolenter-contact-reference .sc-contact-form-intro { font-size: 12px; }
    #sakolenter-contact-reference .sc-contact-fields { grid-template-columns: minmax(0, 1fr); gap: 15px; }
    #sakolenter-contact-reference .sc-contact-field > label { font-size: 13px; }
    #sakolenter-contact-reference .sc-contact-input { font-size: 12px; }
    #sakolenter-contact-reference .sc-contact-call-card,
    #sakolenter-contact-reference .sc-contact-hours-card { padding: 15px 16px 17px; }
    #sakolenter-contact-reference .sc-contact-phone { font-size: 24px; }
    #sakolenter-contact-reference .sc-contact-services { margin-top: 16px; }
    #sakolenter-contact-reference .sc-contact-services > div { flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 14px 8px; text-align: center; }
    #sakolenter-contact-reference .sc-contact-services strong { font-size: 11px; }
    #sakolenter-contact-reference .sc-contact-services small { font-size: 10px; }
}
@media (prefers-reduced-motion: reduce) {
    #sakolenter-contact-reference .sc-contact-input,
    #sakolenter-contact-reference .sc-contact-button { transition: none; }
}