/* White, silver and pale-blue light continue the DEGICA workspace palette. */
.message-window-content { background: #fbfdff; }
.message-page { --message-cyan: #4a7396; --message-ink: #304965; --message-muted: #59728b; position: relative; isolation: isolate; container-type: inline-size; min-height: 100%; overflow: hidden; color: var(--message-ink); background: #fbfdff; font-size: 14px; }
.message-page *, .message-page *::before, .message-page *::after { box-sizing: border-box; }
.message-page h1, .message-page h2, .message-page h3, .message-page p { margin: 0; }
.message-page button { font: inherit; }
.message-page ::selection { color: #2f4c6a; background: #cde4f7; }
.message-hero { position: relative; isolation: isolate; min-height: 570px; padding: 31px 38px 24px; display: flex; flex-direction: column; overflow: hidden; background: radial-gradient(ellipse at 83% 34%, #e0edf9 0, #f1f7fd 36%, #fbfdff 72%); }
.message-hero::before { content: ''; position: absolute; inset: 0; z-index: -1; opacity: .26; background-image: linear-gradient(#7e9cba18 1px, transparent 1px), linear-gradient(90deg, #7e9cba18 1px, transparent 1px); background-size: 48px 48px; mask-image: linear-gradient(130deg, transparent, #000); }
.message-topline { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.message-wordmark { font-size: 17px; font-weight: 750; letter-spacing: .12em; }
.message-edition { color: #5e7892; font-size: 8px; letter-spacing: .18em; }
.message-hero-copy { position: relative; z-index: 2; margin-top: 174px; }
.message-eyebrow { display: flex; align-items: center; gap: 9px; color: var(--message-cyan); font-size: 8px; letter-spacing: .24em; font-weight: 500; }
.message-eyebrow > span { width: 5px; height: 5px; border-radius: 50%; background: #559bd3; box-shadow: 0 0 12px #76b9eaa1; }
.message-hero h1 { margin-top: 22px; font-size: clamp(30px, 5.7cqw, 52px); font-weight: 450; letter-spacing: -.045em; line-height: 1.6; text-shadow: 0 3px 28px #ffffffcc; overflow-wrap: anywhere; }
.message-portrait { position: absolute; z-index: 0; right: -12px; top: 62px; bottom: 0; width: 51%; margin: 0; pointer-events: none; }
.message-portrait img { display: block; width: 100%; height: 100%; object-fit: contain; object-position: center bottom; }
.message-portrait-default { mask-image: linear-gradient(#000 72%, transparent 100%); }
.message-portrait-custom { right: 30px; top: 88px; bottom: 70px; width: 37%; padding: 8px; border: 1px solid #c1d7ea; border-radius: 100px 100px 12px 12px; background: #ffffffb3; box-shadow: 0 16px 50px -25px #789dc85c; overflow: hidden; }
.message-portrait-custom img { border-radius: 94px 94px 6px 6px; object-position: center; }
.server-content .server-message-image { display: block; max-height: 440px; width: auto; max-width: 100%; object-fit: contain; margin-inline: auto; }
.message-hero-jp { display: flex; gap: 18px; align-items: center; margin-top: 22px !important; font-size: 11px; letter-spacing: .12em; }
.message-hero-jp span { color: #58728c; font-size: 10px; letter-spacing: .05em; }
.message-hero-foot { position: relative; z-index: 2; margin-top: auto; padding-top: 56px; display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: 7px; letter-spacing: .14em; color: #5c7690; }
.message-read-cue { display: flex; align-items: center; gap: 9px; color: #487496; }
.message-read-cue svg { transform: rotate(90deg); }
.message-portal { position: absolute; z-index: -1; width: 500px; aspect-ratio: 1; right: -102px; top: 3px; perspective: 900px; pointer-events: none; }
.message-portal-aura { position: absolute; inset: 13%; border-radius: 50%; background: radial-gradient(circle, #ffffffa6 0, transparent 47%, #7db8e92f 64%, #a8c9ed14 68%, transparent 73%); filter: blur(5px); }
.message-portal-map { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; transform: rotate(-28deg); }
.message-portal-grid { stroke: #82a4c0; stroke-width: .45; opacity: .27; }
.message-portal-ticks { stroke: #6c92b4; stroke-width: .8; opacity: .6; }
.message-portal-track { stroke: #6ca1ca; stroke-width: .6; opacity: .65; }
.message-portal-arc { stroke: #589ed8; stroke-width: 1.8; filter: drop-shadow(0 0 5px #8dceffb0); }
.message-portal-inner-track { stroke: #a4b7d8; stroke-width: .5; opacity: .45; }
.message-portal-inner-arc { stroke: #8a9fc9; stroke-width: 1.2; filter: drop-shadow(0 0 3px #bbcaec99); }
.message-portal-satellite { fill: #4e99d4; filter: drop-shadow(0 0 6px #89c8f8); }
.message-portal-stars { fill: #73a4cd; opacity: .8; }
.message-portal-reticle { stroke: #6a9abd; stroke-width: .7; opacity: .65; }
.message-portal-rotate, .message-portal-counter { transform-origin: 260px 260px; animation: message-orbit-turn 30s linear infinite; }
.message-portal-counter { animation-duration: 22s; animation-direction: reverse; }
.message-portal-plane { position: absolute; inset: 13%; border: 1px solid #7cadd174; border-radius: 50%; box-shadow: inset 0 0 9px #ffffffd9, 0 0 13px #90bde738; }
.message-portal-plane-one { transform: rotateX(66deg) rotateY(-17deg) rotateZ(-29deg); }
.message-portal-plane-two { inset: 5%; transform: rotateX(68deg) rotateY(42deg) rotateZ(23deg); border-color: #acb9d887; }
.message-portal-plane::after { content: ''; position: absolute; inset: -1px; border-radius: 50%; border: 2px solid transparent; border-top-color: #84b9e3; animation: message-orbit-turn 9s linear infinite; filter: drop-shadow(0 0 5px #b3dcfc); }
.message-portal-plane-two::after { animation-duration: 13s; animation-direction: reverse; border-top-color: #a2b4d9; }
.message-portal-core { position: absolute; inset: 46%; border-radius: 50%; background: radial-gradient(circle, #ffffff 0, #73b8edb8 8%, #9cc9ee38 32%, transparent 72%); box-shadow: 0 0 70px 35px #a8c9ef2e; }
.message-portal-caption, .message-portal-coordinate { position: absolute; left: 42%; top: 11%; color: #6283a0; font-size: 7px; letter-spacing: .16em; white-space: nowrap; }
.message-portal-coordinate { left: 20%; top: auto; bottom: 10%; font-size: 6px; letter-spacing: .2em; }
.message-letter { position: relative; padding: 42px 38px 45px; background: linear-gradient(125deg, #ffffff, #f4f8fd 70%); border-top: 1px solid #bed0e452; }
.message-section-label { display: flex; align-items: center; gap: 20px; color: #526f8b; font-size: 8px; letter-spacing: .18em; }
.message-section-label > span:first-child { flex-shrink: 0; }
.message-section-line { display: block; height: 1px; flex: 1; background: linear-gradient(90deg, #93b3d174, transparent); }
.message-letter-layout { display: grid; grid-template-columns: minmax(100px, .73fr) minmax(0, 2fr); gap: 30px; padding-top: 35px; }
.message-letter-aside h2 { font-size: 17px; line-height: 1.85; font-weight: 400; letter-spacing: .02em; }
.message-letter-aside > p { margin-top: 22px; color: #5e7892; font-size: 8px; letter-spacing: .16em; line-height: 2; }
.message-letter-body { min-width: 0; }
.message-letter-body > p { color: #4c647b; font-size: 13px; line-height: 2.35; letter-spacing: .03em; overflow-wrap: anywhere; }
.message-letter-body > p + p { margin-top: 23px; }
.message-signature { margin-top: 38px; display: grid; grid-template-columns: auto 1fr; align-items: baseline; gap: 10px 17px; max-width: 280px; }
.message-signature-company { grid-column: 1 / -1; color: #58738d; font-size: 10px; letter-spacing: .09em; }
.message-signature-role { color: #58728b; font-size: 11px; letter-spacing: .12em; }
.message-signature strong { font-size: 25px; font-weight: 400; letter-spacing: .19em; overflow-wrap: anywhere; }
/* Handwritten signature: multiply drops a white scan background onto the page colour. */
.message-signature.has-signature-image { max-width: 340px; align-items: end; }
.message-signature-image { display: block; width: auto; height: 66px; max-width: 230px; object-fit: contain; object-position: left bottom; mix-blend-mode: multiply; }
.message-signature-line { grid-column: 1 / -1; height: 1px; margin-top: 9px; background: linear-gradient(90deg, #789fbd99, #a5b7d34d, transparent); }
.message-values { padding: 38px; background: #f9fbfe; }
.message-values-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 26px; }
.message-value { position: relative; padding: 23px 16px 24px; border: 1px solid #b7cbe366; border-radius: 3px; background: linear-gradient(145deg, #ffffffdb, #e9f1fb7a); }
.message-value-number { color: #5b7690; font-size: 8px; letter-spacing: .13em; }
.message-value h3 { display: flex; align-items: center; justify-content: space-between; gap: 5px; margin-top: 16px; font-size: 21px; letter-spacing: -.02em; font-weight: 400; }
.message-value-light { flex-shrink: 0; width: 4px; height: 4px; border-radius: 50%; background: #6aa5ce; box-shadow: 0 0 11px #9fcbeb99; }
.message-value:nth-child(2) .message-value-light { background: #99aed6; box-shadow: 0 0 11px #99aed6; }
.message-value strong { display: block; margin-top: 20px; font-size: 11px; letter-spacing: .03em; font-weight: 400; }
.message-value > p { margin-top: 9px; color: #546e88; font-size: 10px; line-height: 1.9; }
.message-next { position: relative; isolation: isolate; overflow: hidden; padding: 48px 38px 39px; border-top: 1px solid #bed0e45e; background: radial-gradient(ellipse at 85% 115%, #d7e9fcad, transparent 64%), #f4f9fe; }
.message-next h2 { margin-top: 22px; font-weight: 400; font-size: clamp(24px, 4.5cqw, 38px); line-height: 1.65; letter-spacing: .04em; }
.message-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 29px; }
.message-button { display: inline-flex; justify-content: space-between; align-items: center; gap: 20px; min-height: 46px; padding: 13px 16px; border: 1px solid #a8c2dc8c; border-radius: 3px; color: #385c7d; background: #ffffffab; font-size: 11px !important; text-align: left; transition: background .2s ease, border-color .2s ease; }
.message-button-primary { background: #d8eaf9; border-color: #d8eaf9; color: #2f526f; }
.message-button:hover { background: #eaf4fd; border-color: #7fa8cb; }
.message-button-primary:hover { background: #c6e1f6; border-color: #c6e1f6; }
.message-button:focus-visible, .message-about-link:focus-visible { outline-color: #507ca8; outline-offset: 4px; }
.message-about-link { display: inline-flex; align-items: center; gap: 8px; min-height: 40px; padding: 0; margin-top: 22px; background: transparent; color: #57768f; font-size: 10px !important; }
.message-about-link:hover { color: #2d658d; }
.message-footer-word { position: absolute; z-index: -1; right: -12px; bottom: -25px; color: #7e9db31a; font-size: clamp(80px, 22cqw, 160px); line-height: 1; font-weight: 750; letter-spacing: -.045em; pointer-events: none; }

/* Entry card is used by the company application, without changing its layout rules. */
.message-entry { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-direction: column; gap: 12px; width: 100%; margin: 32px 0; padding: 28px 68px 28px 26px; border: 1px solid #bccfe1; border-radius: 10px; text-align: left; color: #34516d !important; background: radial-gradient(ellipse at 84% 50%, #daeafa, transparent 55%), #f8fbff; box-shadow: 0 12px 28px -20px #7293b336; }
.message-entry::before, .message-entry::after { content: ''; position: absolute; z-index: -1; width: 170px; height: 170px; border: 1px solid #95b7d773; border-radius: 50%; right: -10px; top: -18px; transform: rotate(-25deg) scaleY(.65); }
.message-entry::after { right: 9px; top: -30px; transform: rotate(45deg) scaleY(.68); border-color: #b1c1df80; }
.message-entry-orbit { position: absolute; z-index: -1; right: 40px; top: 24px; width: 106px; height: 106px; border: 1px solid #9dbfda63; border-radius: 50%; box-shadow: inset 0 0 26px #ffffffb8; }
.message-entry-orbit::after { content: ''; position: absolute; top: 11px; left: 17px; width: 4px; height: 4px; background: #71a8d2; border-radius: 50%; box-shadow: 0 0 12px #a1cfef; }
.message-entry-copy { display: flex; flex-direction: column; align-items: flex-start; gap: 10px; color: #5b7590; font-size: 10px; line-height: 1.7; }
.message-entry-copy > span { font-size: 8px; letter-spacing: .15em; color: #536f8a; }
.message-entry-copy > strong { font-size: 20px; font-weight: 400; letter-spacing: .04em; color: #34516d; text-wrap: balance; word-break: keep-all; overflow-wrap: anywhere; }
.message-entry-copy > small { font-size: 10px; letter-spacing: .1em; }
.message-entry > svg { position: absolute; right: 25px; top: 50%; transform: translateY(-50%); color: #527b9d; }
.message-entry:hover { border-color: #8aacca; background-color: #eef6fe; }
.message-entry:focus-visible { outline-color: #507ca8; }

@keyframes message-orbit-turn { to { transform: rotate(360deg); } }
.message-motion-paused *, .message-motion-paused *::before, .message-motion-paused *::after { animation-play-state: paused !important; }
html[data-reduced-motion="true"] .message-page *, html[data-reduced-motion="true"] .message-page *::before, html[data-reduced-motion="true"] .message-page *::after { animation-play-state: paused !important; transition: none; }
@media (prefers-reduced-motion: reduce) {
  html:not([data-reduced-motion="false"]) .message-page *, html:not([data-reduced-motion="false"]) .message-page *::before, html:not([data-reduced-motion="false"]) .message-page *::after { animation-play-state: paused !important; transition: none; }
}
@container (max-width: 540px) {
  .message-hero { min-height: 600px; padding: 25px 25px 22px; }
  .message-portal { width: 415px; top: 24px; right: -130px; opacity: .9; }
  .message-hero-copy { margin-top: 277px; }
  .message-portrait { width: 280px; height: 350px; top: 46px; right: -4px; bottom: auto; }
  .message-portrait-custom { width: 232px; height: 276px; top: 53px; right: calc(50% - 116px); border-radius: 74px 74px 12px 12px; }
  .message-portrait-custom img { border-radius: 68px 68px 6px 6px; }
  .message-hero h1 { font-size: clamp(28px, 7.9cqw, 43px); margin-top: 20px; line-height: 1.65; }
  .message-hero-jp { align-items: flex-start; flex-direction: column; gap: 9px; margin-top: 18px !important; }
  .message-hero-jp span { font-size: 9px; }
  .message-hero-foot { padding-top: 36px; font-size: 6px; letter-spacing: .1em; }
  .message-read-cue { gap: 5px; }
  .message-read-cue svg { width: 12px; }
  .message-letter { padding: 32px 25px; }
  .message-letter-layout { display: block; padding-top: 25px; }
  .message-letter-aside { display: flex; justify-content: space-between; gap: 15px; align-items: center; margin-bottom: 26px; }
  .message-letter-aside h2 { font-size: 20px; }
  .message-letter-aside > p { margin-top: 0; text-align: right; font-size: 7px; }
  .message-letter-body > p { font-size: 13px; line-height: 2.2; }
  .message-signature { margin-top: 30px; }
  .message-signature strong { font-size: 24px; }
  .message-signature-image { height: 56px; max-width: 190px; }
  .message-values { padding: 32px 25px; }
  .message-values-grid { grid-template-columns: 1fr; gap: 10px; }
  .message-value { display: grid; grid-template-columns: 83px minmax(0, 1fr); align-items: start; gap: 6px 15px; padding: 20px 16px; }
  .message-value-number { grid-column: 1; }
  .message-value h3 { grid-column: 1; grid-row: 2 / 4; margin-top: 0; font-size: 20px; }
  .message-value-light { display: none; }
  .message-value strong { grid-column: 2; grid-row: 1 / 3; margin-top: 2px; font-size: 11px; }
  .message-value > p { grid-column: 2; grid-row: 3; margin-top: 0; font-size: 10px; }
  .message-next { padding: 36px 25px 28px; }
  .message-next h2 { font-size: 27px; }
  .message-actions { flex-direction: column; }
  .message-button { width: 100%; min-height: 48px; }
  .message-edition { font-size: 7px; letter-spacing: .1em; }
}
@container (max-width: 340px) {
  .message-hero { padding-inline: 21px; }
  .message-hero h1 { font-size: 26px; }
  .message-hero-foot { font-size: 5.6px; }
  .message-letter, .message-values, .message-next { padding-inline: 21px; }
  .message-letter-aside > p { display: none; }
  .message-signature strong { letter-spacing: .13em; }
  .message-next h2 { font-size: 25px; }
}