/* Public Rayter Group site. Clinical workspaces use their own styles. */
:root {
  color-scheme: dark;
  --paper: #081122;
  --ink: #f5f8ff;
  --muted: #aabbd4;
  --line: #263a55;
  --green: #26e7e1;
  --gold: #66d9f0;
  --surface: #101f35;
  --radius: 16px;
  --site-gutter: clamp(20px, 3.6vw, 64px);
}

body { font-family: "Segoe UI", Arial, sans-serif; color: var(--ink); }
h1, h2, h3, h1 em, h2 em { font-family: inherit; font-weight: 680; }
h1 em, h2 em { color: #9edcfa; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible {
  outline: 2px solid #8bf8f4;
  outline-offset: 4px;
}
.skip { background: var(--surface); }
.eyebrow, .detail-number { color: #8fd4ee; font-weight: 650; }
.button, .button.ivory, .contact-section .button {
  background: var(--green);
  color: #071727;
  border-radius: 11px;
  border-color: transparent;
  font-weight: 650;
}
.button:hover, .button.ivory:hover, .contact-section .button:hover { background: #83f7ef; }
.button.outline {
  background: #08142575;
  border-color: #6783a5;
  color: var(--ink);
}
.button.outline:hover { background: #192d49; border-color: #c1e6ff; }
.text-link, .contact-section .text-link { color: #a9e5fa; border-color: #52758d; }
.text-link:hover, .contact-section .text-link:hover { color: #8af8f1; }

.header {
  width: min(1540px, calc(100% - var(--site-gutter) * 2));
  min-height: 72px;
  padding: 10px 0;
  gap: clamp(14px, 2vw, 34px);
  border: 0;
  z-index: 60;
}
.brand { gap: 14px; letter-spacing: .085em; font-weight: 700; white-space: nowrap; font-size: clamp(16px, 1.8vw, 27px); }
.brand img { width: 46px; height: 46px; flex: none; }
.header .brand > span { border-left: 1px solid #8fa8c4; padding-left: 18px; }
.brand-sub { display: inline; font: inherit; letter-spacing: inherit; margin: 0; }
.header nav { gap: clamp(12px, 2.5vw, 42px); margin: 0 auto; align-items: center; }
.header nav a { border: 0; border-radius: 7px; padding: 9px 5px; font-size: clamp(13px, 1.22vw, 18px); }
.header nav a:hover { background: #152842; }
.header .header-login {
  display: inline-flex !important;
  min-height: 42px;
  white-space: nowrap;
  gap: 9px;
  padding: 8px 13px;
  font-size: clamp(12px, 1.16vw, 17px) !important;
  font-weight: 600;
  border-radius: 10px !important;
  border-color: var(--green);
}
.header-login svg { flex: none; }
.header-login .header-login-short { display: none; }
.header-login span { font-size: inherit; }

.tech-hero {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: grid;
  align-items: center;
  min-height: clamp(460px, 38vw, 640px);
  background: #081425;
}
.tech-hero-art, .tech-hero::after { position: absolute; inset: 0; z-index: -1; }
.tech-hero-art { left: 0; }
.tech-hero-art img { width: 100%; height: 100%; object-fit: contain; object-position: right center; }
.tech-hero::after {
  content: "";
  background: linear-gradient(90deg, #060e20 0%, #060e20f2 24%, #060e2095 41%, #060e2025 60%, transparent 74%),
              linear-gradient(0deg, #081122 0%, transparent 12%);
  pointer-events: none;
}
.tech-hero-content { width: min(1540px, calc(100% - var(--site-gutter) * 2)); margin: 0 auto; padding: 54px 0 65px; }
.tech-hero h1 {
  margin: 0 0 clamp(28px, 3.4vw, 54px);
  font-size: clamp(54px, 5.85vw, 104px);
  line-height: .94;
  letter-spacing: -.052em;
  font-weight: 750;
  color: #fbfcff;
}
.tech-hero-actions { gap: 16px; }
.tech-hero-actions .button { min-height: 56px; gap: 12px; padding: 12px clamp(14px, 1.7vw, 27px); font-size: clamp(15px, 1.35vw, 21px); }
.tech-hero-actions .outline { border: 2px solid #e4efff; }

.tech-projects {
  width: min(1640px, calc(100% - clamp(24px, 3vw, 52px)));
  margin: 8px auto 0;
  display: grid;
  grid-template-columns: minmax(0, 1.7fr) minmax(0, 1fr);
  gap: 13px;
}
.tech-tile {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: block;
  min-width: 0;
  min-height: clamp(122px, 10.6vw, 190px);
  border: 1px solid #284267;
  border-radius: 19px;
  background: radial-gradient(ellipse at 100% 100%, #234f90, transparent 65%), #13213a;
  transition: border-color .18s, background-color .18s;
}
.tech-tile:hover { border-color: #60b6dd; background-color: #1a3050; }
.tech-tile-copy { position: relative; z-index: 1; padding: clamp(21px, 2.4vw, 38px); }
.tech-tile h2 { margin: 0; font-size: clamp(27px, 3vw, 49px); line-height: 1; letter-spacing: -.035em; }
.tech-tile p { margin: 10px 0 0; color: #c1d2e9; font-size: clamp(13px, 1.28vw, 19px); }
.tech-tile > img {
  position: absolute;
  right: -13px;
  bottom: -11%;
  width: min(53%, 350px);
  height: auto;
  object-fit: contain;
  filter: drop-shadow(0 16px 26px #070d21a0);
}
.tech-dental {
  grid-row: span 2;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  min-height: 280px;
  padding-bottom: 18px;
  background: radial-gradient(ellipse at 70% 90%, #214d76 0%, #111e35 69%);
}
.tech-dental .tech-tile-copy { padding-bottom: 14px; }
.tech-dental p { max-width: 260px; }
.tech-tile-link { display: inline-block; color: #90f8f3; font-weight: 650; font-size: 13px; margin-top: 12px; }
.tech-monitor {
  width: min(76%, 760px);
  margin: 0 18px 0 auto;
  border: 4px solid #51769d;
  border-radius: 15px;
  background: #0d1c34;
  box-shadow: 0 10px 28px #020c19a0;
  color: #d7e7fb;
}
.tech-monitor-top { display: flex; align-items: center; gap: 6px; border-bottom: 1px solid #2e4568; padding: 9px 12px; font-size: 12px; font-weight: 650; }
.tech-monitor-body { display: grid; grid-template-columns: 24% minmax(0,1fr); }
.tech-monitor-nav { display: grid; align-content: start; gap: 8px; border-right: 1px solid #314969; padding: 9px; font-size: clamp(6px, .7vw, 11px); }
.tech-monitor-nav b { color: #86e7fc; }
.tech-monitor-main { min-width: 0; padding: 10px 13px; font-size: clamp(8px, .85vw, 13px); }
.tech-monitor-times { display: grid; grid-template-columns: repeat(5, 1fr); color: #b2c8e3; font-size: .7em; margin-top: 6px; }
.tech-calendar {
  display: grid;
  grid-template-columns: repeat(10, 1fr);
  grid-auto-rows: 14px;
  gap: 7px 3px;
  min-height: 88px;
  margin-top: 6px;
  background: repeating-linear-gradient(90deg, #253b5a 0 1px, transparent 1px 20%),
              repeating-linear-gradient(#253b5a 0 1px, transparent 1px 21px);
}
.tech-calendar i { background: #33c8ce; border-radius: 3px; }
.tech-calendar i:nth-child(1) { grid-area: 1 / 2 / auto / span 3; }
.tech-calendar i:nth-child(2) { grid-area: 1 / 7 / auto / span 3; background: #517ac6; }
.tech-calendar i:nth-child(3) { grid-area: 2 / 4 / auto / span 3; background: #517ac6; }
.tech-calendar i:nth-child(4) { grid-area: 3 / 1 / auto / span 3; }
.tech-calendar i:nth-child(5) { grid-area: 3 / 8 / auto / span 3; }

.why-grid a:hover h3 { color: #83ecf1; }
.project-card, .event-card, .coming-card, .game-card, .soft-panel, .legal-copy, .document-offer {
  background: #101f35;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  color: var(--ink);
}
.academy-section, .document-section, .rest-section { background: #0c192d; border-color: var(--line); }
.dental-feature { background: linear-gradient(130deg, #142b4b, #0b182a); border: 1px solid #2b4969; border-radius: var(--radius); color: var(--ink); }
.feature-copy > p, .tick-list, .feature-price > span, .light-link,
.event-date > span, .event-meta, .event-card ul, .book-meta, .book-launch,
.book-subtitle, .detail-purchase > p, .book-more strong, .game-card p,
.author-copy > p.author-position, .author-principles b, .document-offer > p,
.document-offer ul, .legal-copy p, .legal-copy li { color: var(--muted); }
.event-date strong, .feature-price strong, .document-offer > strong { color: var(--ink); }
.event-meta, .detail-purchase, .book-launch, .book-inside, .book-more, .document-tags span { border-color: var(--line); }
.book-art, .detail-cover, .author-photo { background: #152844; }
.author-photo figcaption { color: #d5e5fa; background: #081425e8; }
.pill, .pill.light, .document-tags span, .language-chips span, .game-chips span, .game-badge {
  background: #162944;
  border-color: #365471;
  color: #b9d9ef;
}
.document-offer > .button:disabled, .detail-purchase button:disabled { background: #263b55; color: #c0cfe1; }
.project-icon { background: #183655; color: #7febeb; }
.ai-products .ai-product-art { background: radial-gradient(ellipse at 75% 90%, #234f90, transparent 75%), #13213a; object-fit: contain; }
.language-symbol, .language-symbol > span, .book-inside li span, .tick-list li::before { color: #81dfed; }
.game-art { background: #1c3251; }
.roulette-game-art { background: radial-gradient(ellipse, #315478, #13233b 72%); }
.footer.wrap, .footer .brand { color: #b9cbe3; }
.footer .brand img { width: 35px; height: 35px; }
.contact-section h2 em, .legal-copy a { color: #a0e8f6; }
.legal-copy h1 { font-family: inherit; }
.legal-copy table { overflow-wrap: anywhere; }
.access-grid input, .correspondence input:not([type=checkbox]), .correspondence select, .correspondence textarea {
  background: #0a1627;
  color: #f5f8ff;
  border-color: #496582;
}
.access-grid input::placeholder, .correspondence input::placeholder, .correspondence textarea::placeholder { color: #95a9c5; }
.correspondence h1 { font-size: clamp(34px, 5.4vw, 64px); letter-spacing: -.04em; overflow-wrap: anywhere; }
.cookie-notice { background: #111e33f5; border-color: #3f6080; border-radius: 12px; box-shadow: 0 12px 40px #02071190; }
.cookie-notice p { color: #d0def2; }

@media (max-width: 1030px) {
  .header { gap: 16px; }
  .header nav { gap: 10px; }
  .header .brand > span { padding-left: 10px; }
  .brand { gap: 8px; }
  .brand img { width: 39px; height: 39px; }
  .tech-hero::after { background: linear-gradient(90deg, #060e20 0%, #060e20e5 26%, #060e2088 47%, transparent 77%); }
}
@media (max-width: 800px) {
  .header { min-height: 65px; }
  .nav-toggle { display: inline-flex; align-items: center; gap: 6px; margin-left: auto; background: #10233a; border: 1px solid #45617e; color: var(--ink); border-radius: 8px; min-height: 42px; padding: 6px 10px; font-size: 12px; }
  .header nav { display: none; position: absolute; left: 0; right: 0; top: 100%; padding: 12px; background: #101f35; border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 18px 28px #0006; z-index: 50; }
  .header nav.open { display: flex; flex-direction: column; align-items: stretch; }
  .header nav a { padding: 10px 13px; font-size: 14px; }
}
@media (max-width: 720px) {
  .tech-hero { min-height: 0; display: flex; flex-direction: column; }
  .tech-hero-art { position: relative; inset: auto; order: 2; width: 100%; aspect-ratio: 4 / 3; overflow: hidden; }
  .tech-hero-art img { object-position: center; }
  .tech-hero::after { display: none; }
  .tech-hero-content { padding: 34px 0 22px; }
  .tech-hero h1 { font-size: clamp(42px, 10.8vw, 68px); margin: 0 0 22px; }
  .tech-hero-actions { gap: 9px; }
  .tech-hero-actions .button { min-height: 45px; font-size: 13px; padding: 9px 12px; gap: 7px; }
  .tech-hero-actions .button svg { width: 17px; height: 17px; }
  .tech-projects { margin-top: 11px; gap: 10px; grid-template-columns: 1fr; }
  .tech-tile { min-height: 118px; border-radius: 13px; }
  .tech-dental { grid-row: auto; min-height: 245px; }
  .tech-tile-copy { padding: 21px 19px; }
  .tech-tile > img { width: min(59%, 270px); }
  .tech-monitor { width: calc(100% - 36px); }
}
@media (max-width: 430px) {
  :root { --site-gutter: 14px; }
  .header { gap: 8px; }
  .header .brand > span { border: 0; padding-left: 0; }
  .header .brand { font-size: 14px; letter-spacing: .04em; gap: 5px; }
  .header .brand img { width: 31px; height: 31px; }
  .header .header-login { font-size: 11px !important; padding: 7px 8px; gap: 4px; }
  .header-login svg { width: 15px; height: 15px; }
  .nav-toggle { font-size: 0; min-width: 38px; justify-content: center; padding: 6px 8px; }
  .nav-toggle span { font-size: 16px; }
}
@media (max-width: 360px) {
  .header-login .header-login-full { display: none; }
  .header-login .header-login-short { display: inline; }
}