/* Extracted from Home Redesign. Tokens alone do not restyle Lightning. */
:root {
    --hmt-color-primary: #125cbd;
    --hmt-color-primary-dark: #0c468f;
    --hmt-color-accent: #9ac7ff;
    --hmt-color-text: #152b42;
    --hmt-color-text-muted: #43566a;
    --hmt-color-background: #fff;
    --hmt-color-surface: #f2f6fa;
    --hmt-color-border: #dde5ee;
    --hmt-color-focus: #b35400;
    --hmt-color-hero-start: #f2f7fd;
    --hmt-color-cta: #eaf2fc;
    --hmt-color-panel-next: #203a54;
    --hmt-color-panel-border: #65788d;
    --hmt-color-panel-heading: #b8d8ff;
    --hmt-color-tag-border: #73879d;
    --hmt-color-note-inverse: #dbe7f5;
    --hmt-color-diagram-border: #cad9ea;
    --hmt-color-node-border: #c9ddf5;
    --hmt-color-diagram-label: #536a81;
    --hmt-color-connector: #6886a6;
    --hmt-color-strength-border: #cbd8e5;
    --hmt-color-list-border: #d5e0eb;
    --hmt-font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP", "Yu Gothic", Meiryo, sans-serif;
    --hmt-font-body: 17px;
    --hmt-font-body-mobile: 16px;
    --hmt-font-h1: clamp(32px, 3.4vw, 52px);
    --hmt-font-h1-mobile: clamp(22px, 6.4vw, 32px);
    --hmt-font-h2: clamp(26px, 2.8vw, 38px);
    --hmt-font-h3: 21px;
    --hmt-font-label: 13px;
    --hmt-font-label-mobile: 12px;
    --hmt-font-lead-mobile: 15px;
    --hmt-font-small: 14px;
    --hmt-font-panel-heading: 18px;
    --hmt-font-diagram-caption: 22px;
    --hmt-line-body: 1.9;
    --hmt-line-h1: 1.5;
    --hmt-line-h1-mobile: 1.6;
    --hmt-line-h2: 1.55;
    --hmt-line-h3: 1.6;
    --hmt-line-lead-mobile: 1.95;
    --hmt-container-width: 1200px;
    --hmt-gutter-desktop: 80px;
    --hmt-gutter-tablet: 48px;
    --hmt-gutter-mobile: 36px;
    --hmt-section-space: 96px;
    --hmt-section-space-tablet: 72px;
    --hmt-section-space-mobile: 56px;
    --hmt-hero-space: 100px;
    --hmt-grid-gap: 24px;
    --hmt-grid-gap-split: 80px;
    --hmt-grid-gap-tablet: 36px;
    --hmt-grid-gap-mobile: 28px;
    --hmt-hero-grid-gap: 64px;
    --hmt-hero-grid-gap-tablet: 40px;
    --hmt-radius-small: 3px;
    --hmt-radius-card: 4px;
    --hmt-radius-diagram: 12px;
    --hmt-shadow-diagram: 0 20px 60px #183c6610;
    --hmt-focus-width: 3px;
    --hmt-focus-offset: 5px;
    --hmt-tap-button-height: 52px;
    --hmt-space-5: 5px;
    --hmt-space-8: 8px;
    --hmt-space-10: 10px;
    --hmt-space-12: 12px;
    --hmt-space-14: 14px;
    --hmt-space-16: 16px;
    --hmt-space-18: 18px;
    --hmt-space-20: 20px;
    --hmt-space-22: 22px;
    --hmt-space-24: 24px;
    --hmt-space-26: 26px;
    --hmt-space-28: 28px;
    --hmt-space-32: 32px;
    --hmt-space-36: 36px;
    --hmt-space-40: 40px;
    --hmt-space-56: 56px;
    --hmt-space-64: 64px;
    --hmt-space-72: 72px;
    --hmt-space-80: 80px;
    --hmt-space-96: 96px;
    --hmt-space-100: 100px;
}

/* Only new opt-in .hmt-site content uses the system. Header/footer are untouched. */
.hmt-site {
    color: var(--hmt-color-text);
    background: var(--hmt-color-background);
    font-family: var(--hmt-font-family);
    font-size: var(--hmt-font-body);
    line-height: var(--hmt-line-body);
    overflow-wrap: anywhere;
}
.hmt-site *, .hmt-site *::before, .hmt-site *::after { box-sizing: border-box; }
.hmt-site .hmt-container { width: min(var(--hmt-container-width), calc(100% - var(--hmt-gutter-desktop))); margin-inline: auto; }
.hmt-site h1, .hmt-site h2, .hmt-site h3 { padding: 0; border: 0; background: none; color: inherit; font-weight: 700; }
.hmt-site h1::before, .hmt-site h1::after, .hmt-site h2::before, .hmt-site h2::after, .hmt-site h3::before, .hmt-site h3::after { display: none; }
.hmt-site h1 { margin: var(--hmt-space-20) 0 var(--hmt-space-28); font-size: var(--hmt-font-h1); line-height: var(--hmt-line-h1); letter-spacing: -.035em; text-wrap: balance; }
.hmt-site h2 { margin: var(--hmt-space-12) 0 var(--hmt-space-24); font-size: var(--hmt-font-h2); line-height: var(--hmt-line-h2); letter-spacing: -.02em; }
.hmt-site h3 { margin: 0 0 var(--hmt-space-18); font-size: var(--hmt-font-h3); line-height: var(--hmt-line-h3); }
.hmt-site p { margin: 0 0 var(--hmt-space-24); }
.hmt-site .hmt-section-label { margin: 0; color: var(--hmt-color-primary); font-size: var(--hmt-font-label); font-weight: 700; letter-spacing: .12em; }
.hmt-site .hmt-section { padding: var(--hmt-section-space) 0; scroll-margin-top: var(--hmt-space-100); }
.hmt-site .hmt-section--muted { background: var(--hmt-color-surface); }
.hmt-site .hmt-page-hero { padding: var(--hmt-hero-space) 0; background: linear-gradient(120deg, var(--hmt-color-hero-start), var(--hmt-color-background) 70%); }
.hmt-site .hmt-lead { max-width: 680px; color: var(--hmt-color-text-muted); }
.hmt-site .hmt-actions { display: flex; flex-wrap: wrap; gap: var(--hmt-grid-gap); align-items: center; }
.hmt-site .hmt-button { display: inline-flex; justify-content: center; align-items: center; gap: var(--hmt-space-12); min-height: var(--hmt-tap-button-height); max-width: 100%; padding: var(--hmt-space-14) var(--hmt-space-24); border: 2px solid var(--hmt-color-primary); border-radius: var(--hmt-radius-card); background: var(--hmt-color-primary); color: var(--hmt-color-background); font-size: var(--hmt-font-lead-mobile); font-weight: 700; text-decoration: none; line-height: 1.7; }
.hmt-site .hmt-button:hover { background: var(--hmt-color-primary-dark); border-color: var(--hmt-color-primary-dark); color: var(--hmt-color-background); }
.hmt-site .hmt-button--outline { color: var(--hmt-color-primary); background: transparent; }
.hmt-site .hmt-text-link { display: inline-block; padding-block: var(--hmt-space-10); color: var(--hmt-color-primary); text-underline-offset: var(--hmt-space-5); font-weight: 700; font-size: var(--hmt-font-lead-mobile); }
.hmt-site a:focus-visible { outline: var(--hmt-focus-width) solid var(--hmt-color-focus); outline-offset: var(--hmt-focus-offset); }
.hmt-site .hmt-grid--split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--hmt-grid-gap-split); align-items: center; }
.hmt-site .hmt-intro { max-width: 720px; color: var(--hmt-color-text-muted); }
.hmt-site .hmt-grid:not(.hmt-grid--split):not(.hmt-grid--technology) { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--hmt-grid-gap); margin-top: var(--hmt-space-40); }
.hmt-site .hmt-card { padding: var(--hmt-space-32) var(--hmt-space-28); background: var(--hmt-color-background); border: 1px solid var(--hmt-color-border); border-radius: var(--hmt-radius-card); }
.hmt-site .hmt-card p:last-child { margin-bottom: 0; }
.hmt-site .hmt-card-label { font-size: var(--hmt-font-label-mobile); color: var(--hmt-color-primary); font-weight: 700; letter-spacing: .08em; }
.hmt-site .hmt-section--dark { background: var(--hmt-color-text); color: var(--hmt-color-background); }
.hmt-site .hmt-section--dark .hmt-section-label { color: var(--hmt-color-accent); }
.hmt-site .hmt-grid--technology { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--hmt-grid-gap-mobile); margin-top: var(--hmt-space-40); }
.hmt-site .hmt-tech-panel { padding: var(--hmt-space-32); border: 1px solid var(--hmt-color-panel-border); border-radius: var(--hmt-radius-card); }
.hmt-site .hmt-tech-panel h3 { color: var(--hmt-color-panel-heading); font-size: var(--hmt-font-panel-heading); letter-spacing: .06em; }
.hmt-site .hmt-tech-panel--next { background: var(--hmt-color-panel-next); }
.hmt-site .hmt-tags { display: flex; flex-wrap: wrap; gap: var(--hmt-space-10); padding: 0; margin: var(--hmt-space-24) 0; list-style: none; }
.hmt-site .hmt-tags li { margin: 0; padding: var(--hmt-space-5) var(--hmt-space-12); border: 1px solid var(--hmt-color-tag-border); border-radius: var(--hmt-radius-small); font-size: var(--hmt-font-small); }
.hmt-site .hmt-note--inverse { margin-bottom: 0; font-size: var(--hmt-font-lead-mobile); color: var(--hmt-color-note-inverse); }
.hmt-site .hmt-cta { text-align: center; background: var(--hmt-color-cta); }
.hmt-site .hmt-cta-note { margin: var(--hmt-space-18) 0 0; font-size: var(--hmt-font-small); color: var(--hmt-color-text-muted); }
@media (max-width: 1023px) {
    .hmt-site .hmt-container { width: calc(100% - var(--hmt-gutter-tablet)); }
    .hmt-site .hmt-grid--split { gap: var(--hmt-grid-gap-tablet); }
    .hmt-site .hmt-grid:not(.hmt-grid--split):not(.hmt-grid--technology) { grid-template-columns: 1fr; }
    .hmt-site .hmt-section { padding: var(--hmt-section-space-tablet) 0; }
    .hmt-site .hmt-page-hero { padding: var(--hmt-section-space-tablet) 0; }
}
@media (max-width: 767px) {
    .hmt-site { font-size: var(--hmt-font-body-mobile); }
    .hmt-site .hmt-page-hero h1 { font-size: var(--hmt-font-h1-mobile); line-height: var(--hmt-line-h1-mobile); letter-spacing: -.025em; }
    .hmt-site .hmt-hero-phrase { display: block; white-space: nowrap; }
    .hmt-site .hmt-page-hero .hmt-lead { font-size: var(--hmt-font-lead-mobile); line-height: var(--hmt-line-lead-mobile); letter-spacing: .01em; overflow-wrap: normal; word-break: auto-phrase; text-wrap: pretty; }
    .hmt-site .hmt-lead-phrase { white-space: nowrap; }
    .hmt-site .hmt-container { width: calc(100% - var(--hmt-gutter-mobile)); }
    .hmt-site .hmt-section, .hmt-site .hmt-page-hero { padding: var(--hmt-section-space-mobile) 0; }
    .hmt-site .hmt-grid--split, .hmt-site .hmt-grid--technology { grid-template-columns: 1fr; gap: var(--hmt-grid-gap-mobile); }
    .hmt-site .hmt-actions { align-items: stretch; flex-direction: column; gap: var(--hmt-space-12); }
    .hmt-site .hmt-card, .hmt-site .hmt-tech-panel { padding: var(--hmt-space-24); }
    .hmt-site .hmt-section-label { font-size: var(--hmt-font-label-mobile); }
    .hmt-site .hmt-cta .hmt-button { font-size: var(--hmt-font-small); padding-inline: var(--hmt-space-14); }
}
.hmt-site .hmt-card--service { border-top: 3px solid var(--hmt-color-primary); }
.hmt-site .hmt-grid--split { margin-top: 0; }
.hmt-site .hmt-section-header { max-width: 720px; }
.hmt-site .hmt-section-header > :last-child { margin-bottom: 0; }
.hmt-site .hmt-badge { display: inline-block; padding: var(--hmt-space-5) var(--hmt-space-12); border: 1px solid var(--hmt-color-border); border-radius: var(--hmt-radius-small); font-size: var(--hmt-font-small); }

.hmt-site .hmt-small, .hmt-site .hmt-note { font-size: var(--hmt-font-small); color: var(--hmt-color-text-muted); }
.hmt-site button:focus-visible, .hmt-site input:focus-visible, .hmt-site textarea:focus-visible, .hmt-site select:focus-visible { outline: var(--hmt-focus-width) solid var(--hmt-color-focus); outline-offset: var(--hmt-focus-offset); }

/* Opt-in definition list for company and other factual information. */
.hmt-site .hmt-definition-list { margin: 0; border: 1px solid var(--hmt-color-border); border-radius: var(--hmt-radius-card); }
.hmt-site .hmt-definition-list__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 3fr); }
.hmt-site .hmt-definition-list__row + .hmt-definition-list__row { border-top: 1px solid var(--hmt-color-border); }
.hmt-site .hmt-definition-list dt, .hmt-site .hmt-definition-list dd { margin: 0; min-width: 0; padding: var(--hmt-space-24) var(--hmt-space-28); border: 0; overflow-wrap: anywhere; }
.hmt-site .hmt-definition-list dt { background: var(--hmt-color-surface); font-weight: 700; }
@media (max-width: 767px) {
    .hmt-site .hmt-definition-list__row { grid-template-columns: minmax(0, 1fr); }
    .hmt-site .hmt-definition-list dt, .hmt-site .hmt-definition-list dd { padding: var(--hmt-space-18) var(--hmt-space-24); }
}
