/* V24 - Contact channels, board phones and polished public surfaces */
.board-page-pro,
.contact-page-pro {
    min-height: 70vh;
    padding: clamp(1.2rem, 3.6vw, 3.5rem) clamp(1rem, 4vw, 4.5rem) clamp(3.5rem, 7vw, 6rem);
    background:
        radial-gradient(circle at 8% 12%, rgba(67, 195, 255, .16), transparent 26rem),
        radial-gradient(circle at 94% 77%, rgba(194, 101, 255, .14), transparent 29rem),
        #f6fbff;
}

.board-pro-hero,
.contact-pro-hero {
    position: relative;
    isolation: isolate;
    display: grid;
    grid-template-columns: minmax(0, 1.3fr) minmax(14rem, .55fr);
    align-items: center;
    gap: clamp(1.5rem, 5vw, 5rem);
    width: min(100%, 76rem);
    min-height: 27rem;
    margin: 0 auto clamp(2.7rem, 6vw, 5rem);
    padding: clamp(2rem, 5vw, 4.4rem);
    overflow: hidden;
    border: 1px solid rgba(255, 255, 255, .52);
    border-radius: 2rem;
    color: #f9fcff;
    background: linear-gradient(120deg, #07264b 0%, #0d4e80 55%, #4c4faa 100%);
    box-shadow: 0 1.7rem 4rem rgba(17, 71, 127, .18), inset 0 1px rgba(255, 255, 255, .19);
}

.board-pro-hero::before,
.board-pro-hero::after,
.contact-pro-hero::before,
.contact-pro-hero::after {
    content: '';
    position: absolute;
    z-index: -1;
    border-radius: 50%;
}

.board-pro-hero::before,
.contact-pro-hero::before {
    width: 28rem;
    height: 28rem;
    right: -11rem;
    top: -13rem;
    border: 1px solid rgba(221, 250, 255, .24);
    box-shadow: 0 0 0 2.8rem rgba(204, 237, 255, .06), 0 0 0 5.6rem rgba(204, 237, 255, .035);
}

.board-pro-hero::after,
.contact-pro-hero::after {
    width: 19rem;
    height: 19rem;
    left: -9rem;
    bottom: -11rem;
    background: radial-gradient(circle, rgba(255, 93, 156, .33), rgba(255, 93, 156, 0) 70%);
}

.board-pro-hero-copy,
.contact-pro-hero-copy,
.board-pro-hero-mark,
.contact-pro-identity { position: relative; z-index: 1; }

.board-pro-kicker,
.contact-pro-kicker {
    display: inline-block;
    color: #9de6ff;
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .18em;
}

.board-pro-hero h1,
.contact-pro-hero h1 {
    max-width: 46rem;
    margin: 1rem 0;
    color: #fff;
    font-family: Georgia, 'Times New Roman', serif;
    font-size: clamp(2.7rem, 5.8vw, 5.45rem);
    line-height: .97;
    letter-spacing: -.055em;
}

.board-pro-hero h1 em,
.contact-pro-hero h1 em {
    display: block;
    margin-top: .12em;
    font-style: normal;
    background: linear-gradient(96deg, #ffbdde, #c6a8ff 46%, #8be6ff);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.board-pro-hero p,
.contact-pro-hero p {
    max-width: 42rem;
    margin: 0;
    color: rgba(235, 247, 255, .8);
    font-size: 1.02rem;
    line-height: 1.75;
}

.board-pro-hero-actions,
.contact-pro-hero-pills {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .7rem;
    margin-top: 1.7rem;
}

.board-pro-hero-actions .outline-button {
    border-color: rgba(255, 255, 255, .4);
    color: #fff;
    background: rgba(255, 255, 255, .06);
}

.contact-pro-hero-pills span {
    padding: .5rem .65rem;
    border: 1px solid rgba(216, 247, 255, .23);
    border-radius: .7rem;
    color: #d8f4ff;
    background: rgba(255, 255, 255, .07);
    font-size: .74rem;
    font-weight: 800;
}

.board-pro-hero-mark,
.contact-pro-identity {
    display: grid;
    justify-items: center;
    align-content: center;
    min-height: 16.5rem;
    padding: 1.5rem;
    border: 1px solid rgba(224, 246, 255, .26);
    border-radius: 1.5rem;
    background: rgba(255, 255, 255, .1);
    box-shadow: inset 0 1px rgba(255, 255, 255, .1);
    text-align: center;
    backdrop-filter: blur(14px);
}

.board-pro-mark-logo,
.contact-pro-logo {
    width: 5.35rem;
    height: 5.35rem;
    display: grid;
    place-items: center;
    margin-bottom: .85rem;
    overflow: hidden;
    border: 2px solid rgba(255, 255, 255, .62);
    border-radius: 1.5rem;
    color: #fff;
    background: linear-gradient(135deg, #ee4380, #695eff);
    box-shadow: 0 .9rem 1.8rem rgba(0, 15, 53, .28);
    font: 800 2.5rem Georgia, serif;
}

.board-pro-mark-logo img,
.contact-pro-logo img { width: 100%; height: 100%; object-fit: contain; background: #fff; }
.board-pro-hero-mark > b,
.contact-pro-identity > b { color: #fff; font-size: .95rem; letter-spacing: .16em; }
.board-pro-hero-mark > small,
.contact-pro-identity > small { margin-top: .25rem; color: #bdeaff; font-size: .62rem; font-weight: 900; letter-spacing: .2em; }
.board-pro-mark-line,
.contact-pro-identity-line { width: 2.6rem; height: 1px; margin: .9rem 0 .7rem; background: rgba(225, 247, 255, .42); }
.board-pro-hero-mark > span,
.contact-pro-identity > span { color: #d8efff; font-size: .72rem; }

.board-pro-intro {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    gap: 2rem;
    width: min(100%, 76rem);
    margin: 0 auto 1.45rem;
}

.board-pro-intro h2,
.contact-pro-section-heading h2 { margin: .4rem 0 0; color: #12375d; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(1.9rem, 3.5vw, 3rem); letter-spacing: -.04em; }
.board-pro-intro > p { max-width: 31rem; margin: 0; color: #607b97; line-height: 1.7; }

.board-pro-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 1.15rem;
    width: min(100%, 76rem);
    margin: 0 auto;
}

.board-pro-card {
    overflow: hidden;
    border: 1px solid #d7e7f3;
    border-radius: 1.4rem;
    background: rgba(255, 255, 255, .92);
    box-shadow: 0 .9rem 2rem rgba(24, 76, 119, .07);
    transition: transform .22s ease, box-shadow .22s ease, border-color .22s ease;
}

.board-pro-card:hover { transform: translateY(-.38rem); border-color: #a4cceb; box-shadow: 0 1.35rem 2.6rem rgba(24, 76, 119, .12); }
.board-pro-card-media { position: relative; height: 16.2rem; overflow: hidden; background: linear-gradient(135deg, #ccecff, #e8ddff); }
.board-pro-card-media::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 48%, rgba(7, 39, 74, .25)); pointer-events: none; }
.board-pro-card-media img { width: 100%; height: 100%; object-fit: cover; object-position: center 22%; transition: transform .45s ease; }
.board-pro-card:hover .board-pro-card-media img { transform: scale(1.05); }
.board-pro-card-index { position: absolute; z-index: 1; top: .85rem; left: .85rem; padding: .42rem .55rem; border-radius: .58rem; color: #fff; background: rgba(7, 34, 67, .64); font-size: .67rem; font-weight: 900; letter-spacing: .09em; backdrop-filter: blur(8px); }
.board-pro-card-placeholder { width: 100%; height: 100%; display: grid; place-items: center; color: #1b5689; background: linear-gradient(135deg, #c9efff, #eadcff); font: 800 5.2rem Georgia, serif; }
.board-pro-card-copy { display: flex; flex-direction: column; min-height: 15.4rem; padding: 1.15rem; }
.board-pro-role { display: inline-flex; align-self: flex-start; padding: .36rem .55rem; border-radius: .5rem; color: #245f96; background: #e9f5ff; font-size: .69rem; font-weight: 900; }
.board-pro-card h3 { margin: .8rem 0 .45rem; color: #133a62; font-family: Georgia, 'Times New Roman', serif; font-size: 1.5rem; letter-spacing: -.03em; }
.board-pro-card p { margin: 0; color: #607b97; font-size: .87rem; line-height: 1.65; }
.board-pro-phone { display: flex; align-items: center; gap: .42rem; margin-top: auto; padding-top: 1rem; color: #1468b4; font-size: .82rem; font-weight: 900; }
.board-pro-phone:hover { color: #883edf; }
.board-pro-phone.is-muted { color: #8ba1b5; font-size: .74rem; font-weight: 700; }
.board-pro-empty { width: min(100%, 76rem); margin: 0 auto; padding: 4rem 1rem; border: 1px dashed #bad5e9; border-radius: 1.5rem; color: #607b97; text-align: center; }
.board-pro-empty > span { color: #7862ef; font-size: 2rem; }.board-pro-empty h2 { margin: .6rem 0; color: #173d64; font-family: Georgia, serif; }.board-pro-empty p { margin: 0; }

/* Modern contact centre */
.contact-pro-hero { background: linear-gradient(120deg, #172a62 0%, #245f9a 52%, #7554a8 100%); }
.contact-pro-layout { display: grid; grid-template-columns: minmax(0, .9fr) minmax(22rem, 1.1fr); gap: 1.15rem; width: min(100%, 76rem); margin: 0 auto; }
.contact-pro-info,
.contact-pro-form-card { padding: clamp(1.35rem, 3vw, 2.2rem); border: 1px solid #d8e8f4; border-radius: 1.45rem; background: rgba(255, 255, 255, .93); box-shadow: 0 .9rem 2rem rgba(26, 79, 120, .06); }
.contact-pro-section-heading p { margin: .85rem 0 0; color: #607b97; line-height: 1.7; }
.contact-pro-channel-list { display: grid; gap: .75rem; margin-top: 1.5rem; }
.contact-pro-channel { display: flex; gap: .8rem; padding: .85rem; border: 1px solid #e0ecf6; border-radius: 1rem; background: linear-gradient(120deg, #fbfdff, #f3f9ff); }
.contact-pro-channel > div { min-width: 0; }.contact-pro-channel small,.contact-pro-channel b,.contact-pro-channel a { display: block; }
.contact-pro-channel small { color: #7892ac; font-size: .62rem; font-weight: 900; letter-spacing: .13em; }.contact-pro-channel b { color: #163e67; font-size: .89rem; }.contact-pro-channel a { color: #136fca; font-size: 1.13rem; font-weight: 900; }.contact-pro-channel a:hover { color: #8248d6; }.contact-pro-channel p { margin: .25rem 0 0; color: #718aa4; font-size: .76rem; line-height: 1.5; }
.contact-channel-icon { width: 2.35rem; height: 2.35rem; flex: 0 0 2.35rem; display: grid; place-items: center; border-radius: .75rem; color: #0d5eab; background: #dff3ff; font-weight: 900; }.channel-violet { color: #6c49cc; background: #eee7ff; }.channel-green { color: #13886b; background: #e0f8ed; }
.contact-pro-panel-link { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-top: 1.15rem; padding-top: 1.1rem; border-top: 1px solid #e0ecf6; }.contact-pro-panel-link > span { color: #6f88a2; font-size: .79rem; }.contact-pro-panel-link a { color: #166dc1; font-size: .82rem; font-weight: 900; }
.contact-pro-form-card { position: relative; overflow: hidden; }.contact-pro-form-card::before { content: ''; position: absolute; top: -7rem; right: -7rem; width: 14rem; height: 14rem; border-radius: 50%; background: radial-gradient(circle, rgba(94, 160, 255, .16), transparent 69%); pointer-events: none; }.contact-pro-form-heading,.contact-pro-form-card form { position: relative; z-index: 1; }.contact-pro-form-heading > span { color: #1b77c8; font-size: .66rem; font-weight: 900; letter-spacing: .14em; }.contact-pro-form-heading h2 { margin: .45rem 0; color: #12385f; font-family: Georgia, serif; font-size: clamp(1.6rem, 3vw, 2.25rem); letter-spacing: -.035em; }.contact-pro-form-heading p { margin: 0; color: #718aa4; font-size: .88rem; }.contact-pro-form-card form { margin-top: 1.5rem; }.contact-pro-form-card label { display: block; margin: .85rem 0 .38rem; color: #254e75; font-size: .79rem; font-weight: 900; }.contact-pro-form-card input,.contact-pro-form-card textarea { width: 100%; border: 1px solid #cfe2f1; border-radius: .8rem; background: #fbfdff; }.contact-pro-form-card textarea { min-height: 9rem; resize: vertical; }.contact-form-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }.contact-form-two-col label { margin-top: 0; }.contact-pro-form-bottom { display: flex; align-items: center; justify-content: space-between; gap: .8rem; margin-top: 1.2rem; }.contact-pro-form-bottom small { color: #6d879f; font-size: .72rem; }.contact-pro-form-bottom small span { color: #169778; font-weight: 900; }

/* Admin board workspace and telephone settings */
.board-manager-hero-v24 { position: relative; overflow: hidden; background: linear-gradient(120deg, #123e70, #2b74ad 58%, #7a60c9); }.board-manager-hero-v24::after { content: ''; position: absolute; width: 23rem; height: 23rem; right: -9rem; top: -13rem; border: 1px solid rgba(255,255,255,.22); border-radius: 50%; box-shadow: 0 0 0 2rem rgba(255,255,255,.05),0 0 0 4rem rgba(255,255,255,.035); }.board-manager-hero-v24 > * { position: relative; z-index: 1; }.board-manager-hero-v24 h1 em { display: inline; font-style: normal; color: #d7f5ff; }.board-manager-stats-v24 article { position: relative; overflow: hidden; }.board-manager-stats-v24 article:nth-child(3)::after { background: #eadbff; }.board-manager-stats-v24 article small { display: block; margin-top: .28rem; color: #7892ad; font-size: .68rem; }
.board-manager-grid-v24 { grid-template-columns: minmax(20rem, .78fr) minmax(0, 1.22fr); }.board-editor-v24 { align-self: start; border-top: 4px solid transparent; border-image: linear-gradient(90deg,#ef4f80,#7759ed,#1b87e4) 1; }.board-form-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: .8rem; }.board-form-bottom { align-items: end; }.board-editor-v24 label small { color: #7b92a6; font-size: .69rem; font-weight: 700; }.board-editor-v24 #phone { letter-spacing: .02em; }.board-members-panel-v24 { min-width: 0; }.board-pro-list-v24 article { grid-template-columns: 2rem 3.6rem minmax(0,1fr) auto; }.board-list-copy { min-width: 0; }.board-list-copy h3 { margin-bottom: .2rem; }.board-list-phone { display: inline-flex; align-items: center; gap: .28rem; margin-top: .42rem; color: #156dbc; font-size: .75rem; font-weight: 900; }.board-list-phone.is-empty { color: #94a5b4; font-weight: 700; }
.contact-settings-card { display: grid; grid-template-columns: auto minmax(0,1fr) minmax(23rem,.9fr); align-items: center; gap: 1rem 1.25rem; margin-top: 1.3rem; padding: 1.35rem; border: 1px solid #d3e6f3; border-radius: 1.35rem; background: linear-gradient(120deg,#fafdff,#f4f9ff); box-shadow: 0 .8rem 2rem rgba(23,77,128,.05); }.contact-settings-icon { width: 3.35rem; height: 3.35rem; display: grid; place-items: center; border-radius: 1.05rem; color: #fff; background: linear-gradient(135deg,#0f83d9,#584fe4); box-shadow: 0 .65rem 1.3rem rgba(39,94,215,.22); font-size: 1.4rem; font-weight: 900; }.contact-settings-copy h2 { margin: .25rem 0; color: #12385e; font-size: 1.18rem; }.contact-settings-copy p { margin: 0; color: #607b97; font-size: .88rem; line-height: 1.55; }.contact-settings-form { display: grid; gap: .35rem; margin: 0; }.contact-settings-form > label { color: #315d86; font-size: .72rem; font-weight: 900; }.contact-settings-form > div { display: flex; gap: .5rem; }.contact-settings-form input { min-width: 0; flex: 1; margin: 0; }.contact-settings-form button { white-space: nowrap; }.contact-settings-form small { color: #738da5; font-size: .69rem; }

html[data-theme="dark"] .board-page-pro,
html[data-theme="dark"] .contact-page-pro { background: radial-gradient(circle at 8% 12%,rgba(24,121,163,.19),transparent 26rem),radial-gradient(circle at 94% 77%,rgba(122,78,181,.17),transparent 29rem),#0b1929; }
html[data-theme="dark"] .board-pro-intro h2,
html[data-theme="dark"] .contact-pro-section-heading h2,
html[data-theme="dark"] .contact-pro-form-heading h2 { color: #edf7ff; }
html[data-theme="dark"] .board-pro-intro > p,
html[data-theme="dark"] .contact-pro-section-heading p { color: #acc3d8; }
html[data-theme="dark"] .board-pro-card,
html[data-theme="dark"] .contact-pro-info,
html[data-theme="dark"] .contact-pro-form-card,
html[data-theme="dark"] .contact-settings-card { border-color: #304e6a; background: linear-gradient(130deg,#10243a,#132a43); box-shadow: none; }
html[data-theme="dark"] .board-pro-card h3,
html[data-theme="dark"] .contact-pro-channel b { color: #eff8ff; }
html[data-theme="dark"] .board-pro-card p,
html[data-theme="dark"] .contact-pro-channel p,
html[data-theme="dark"] .contact-pro-panel-link > span,
html[data-theme="dark"] .contact-pro-form-heading p,
html[data-theme="dark"] .contact-pro-form-bottom small,
html[data-theme="dark"] .contact-settings-copy p,
html[data-theme="dark"] .contact-settings-form small { color: #aac2d8; }
html[data-theme="dark"] .board-pro-role { color: #b7e0ff; background: #1b4268; }
html[data-theme="dark"] .contact-pro-channel { border-color: #294863; background: linear-gradient(130deg,#0f263d,#122a44); }
html[data-theme="dark"] .contact-pro-form-card input,
html[data-theme="dark"] .contact-pro-form-card textarea { border-color: #355673; color: #ecf7ff; background: #0d2136; }
html[data-theme="dark"] .contact-pro-form-card label,
html[data-theme="dark"] .contact-settings-copy h2,
html[data-theme="dark"] .contact-settings-form > label { color: #e6f4ff; }

@media (max-width: 1000px) {
    .board-pro-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .board-manager-grid-v24 { grid-template-columns: 1fr; }
    .contact-settings-card { grid-template-columns: auto minmax(0,1fr); }
    .contact-settings-form { grid-column: 1 / -1; }
}

@media (max-width: 760px) {
    .board-pro-hero,
    .contact-pro-hero { grid-template-columns: 1fr; min-height: 0; padding: 1.5rem; border-radius: 1.45rem; }
    .board-pro-hero-mark,
    .contact-pro-identity { min-height: 12rem; }
    .board-pro-hero h1,
    .contact-pro-hero h1 { font-size: clamp(2.5rem,12vw,4rem); }
    .board-pro-intro { align-items: flex-start; flex-direction: column; gap: .75rem; }
    .contact-pro-layout { grid-template-columns: 1fr; }
    .board-pro-grid { grid-template-columns: 1fr; }
    .board-pro-card-media { height: 18rem; }
    .board-manager-stats-v24 { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .board-pro-list-v24 article { grid-template-columns: 2rem 3.2rem minmax(0,1fr); }.board-pro-list-v24 .board-card-actions { grid-column: 2 / -1; justify-content: flex-start; }
}

@media (max-width: 520px) {
    .board-page-pro,
    .contact-page-pro { padding-inline: .8rem; }
    .board-pro-hero-actions .button,
    .board-pro-hero-actions .outline-button { width: 100%; justify-content: center; }
    .contact-pro-hero-pills { display: grid; grid-template-columns: 1fr; }.contact-pro-hero-pills span { text-align: center; }
    .contact-form-two-col,
    .board-form-two-col { grid-template-columns: 1fr; }
    .contact-pro-form-bottom,
    .contact-pro-panel-link { align-items: flex-start; flex-direction: column; }
    .contact-pro-form-bottom .button { width: 100%; justify-content: center; }
    .contact-settings-card { grid-template-columns: 1fr; }.contact-settings-form > div { flex-direction: column; }.contact-settings-form button { width: 100%; justify-content: center; }
    .board-manager-stats-v24 { grid-template-columns: 1fr; }
}