/**
 * GetToWork public visual system.
 * Vibrant coffee sunset. Loaded on guest pages before publication.css.
 * Product-shell / Workday pages do not load this file.
 */

body.theme-publication {
  /* Colour */
  --gtw-paper: #f8f1e6;
  --gtw-cream: #fffaf3;
  --gtw-latte: #efe2d0;
  --gtw-sand: #e4d2b6;
  --gtw-peach: #f0c8a8;
  --gtw-sunset: #e89a62;
  --gtw-terracotta: #9a3b2f;
  --gtw-coral: #c14d3a;
  --gtw-coffee: #3c291f;
  --gtw-espresso: #241814;
  --gtw-ink: #1c1915;
  --gtw-muted: #5c4a3c;
  --gtw-line: #ddcbb6;
  --gtw-line-strong: #cbb59d;

  /* Career / outbound only. Not a page background. */
  --gtw-career: #12365a;
  --gtw-career-hover: #0c2844;

  /* Result state (calculator output), not a theme. */
  --gtw-ok-bg: #e7f3ea;
  --gtw-ok-line: #1f6b45;
  --gtw-ok-ink: #145c38;
  --gtw-err-bg: #fdecea;
  --gtw-err-ink: #7a221c;

  /* Width */
  --gtw-width-read: 46.25rem; /* 740px */
  --gtw-width-page: 77.5rem; /* 1240px */
  --gtw-width-workspace: 86.25rem; /* 1380px */
  --gtw-gutter: 1.375rem;

  /* Type */
  --gtw-font-display: "Fraunces", Georgia, "Times New Roman", serif;
  --gtw-font-body: "Literata", Georgia, "Times New Roman", serif;
  --gtw-font-ui: "IBM Plex Sans", "Segoe UI", system-ui, sans-serif;
  --gtw-type-display: clamp(2.05rem, 3.6vw, 2.75rem);
  --gtw-type-h1: clamp(1.85rem, 3.2vw, 2.5rem);
  --gtw-type-h2: clamp(1.3rem, 2vw, 1.7rem);
  --gtw-type-h3: 1.2rem;
  --gtw-type-body: 1.125rem;
  --gtw-type-ui: 1rem;
  --gtw-type-kicker: 0.78rem;
  --gtw-leading-body: 1.7;
  --gtw-leading-ui: 1.45;

  /* Space */
  --gtw-space-1: 0.25rem;
  --gtw-space-2: 0.5rem;
  --gtw-space-3: 0.75rem;
  --gtw-space-4: 1rem;
  --gtw-space-5: 1.5rem;
  --gtw-space-6: 2rem;
  --gtw-space-7: 3rem;
  --gtw-space-8: 4rem;

  /* Depth */
  --gtw-radius: 4px;
  --gtw-radius-action: 6px;
  --gtw-shadow: 0 1px 0 color-mix(in srgb, var(--gtw-espresso) 8%, transparent);
  --gtw-inset: inset 0 1px 0 color-mix(in srgb, #fff 55%, transparent);
  --gtw-focus: 0 0 0 2px var(--gtw-paper), 0 0 0 4px var(--gtw-espresso);

  /* Compat: existing publication / utility / home selectors. */
  --pub-paper: var(--gtw-paper);
  --pub-peach: var(--gtw-peach);
  --pub-terracotta: var(--gtw-terracotta);
  --pub-navy: var(--gtw-espresso);
  --pub-canvas: var(--gtw-paper);
  --pub-ink: var(--gtw-ink);
  --pub-body: var(--gtw-ink);
  --pub-muted: var(--gtw-muted);
  --pub-accent: var(--gtw-terracotta);
  --pub-accent-hover: #7c2e25;
  --pub-accent-soft: #f6e0d4;
  --pub-line: var(--gtw-line);
  --pub-line-strong: var(--gtw-line-strong);
  --pub-link: var(--gtw-coffee);
  --pub-link-hover: var(--gtw-terracotta);
  --pub-shell-max: var(--gtw-width-workspace);
  --pub-editorial-max: var(--gtw-width-page);
  --pub-article-grid-max: 73.75rem;
  --pub-reading-max: var(--gtw-width-read);
  --pub-measure: var(--gtw-width-read);
  --pub-measure-narrow: 42rem;
  --pub-space-1: var(--gtw-space-1);
  --pub-space-2: var(--gtw-space-2);
  --pub-space-3: var(--gtw-space-3);
  --pub-space-4: var(--gtw-space-4);
  --pub-space-5: var(--gtw-space-5);
  --pub-space-6: var(--gtw-space-6);
  --pub-space-7: var(--gtw-space-7);
  --pub-space-8: var(--gtw-space-8);
  --pub-space-9: 6rem;
  --pub-space-10: 8rem;
  --pub-radius-sm: 2px;
  --pub-radius: var(--gtw-radius);
  --pub-shadow-none: none;
  --pub-focus-ring: var(--gtw-focus);
  --pub-font-display: var(--gtw-font-display);
  --pub-font-body: var(--gtw-font-body);
  --pub-font-ui: var(--gtw-font-ui);
  --pub-body-size: var(--gtw-type-body);
  --pub-body-leading: var(--gtw-leading-body);
  --pub-nav-height: 3rem;
  --pub-masthead-pad-y: var(--gtw-space-5);
  --pub-sticky-offset: 0px;
  --pub-gutter: var(--gtw-gutter);
  --pub-brand-wash: linear-gradient(
    105deg,
    var(--gtw-paper) 0%,
    var(--gtw-peach) 52%,
    color-mix(in srgb, var(--gtw-terracotta) 38%, var(--gtw-peach)) 100%
  );

  --ink: var(--gtw-ink);
  --muted: var(--gtw-muted);
  --paper: var(--gtw-paper);
  --paper-deep: var(--gtw-latte);
  --panel: var(--gtw-latte);
  --panel-raised: var(--gtw-cream);
  --input-bg: var(--gtw-cream);
  --line: var(--gtw-line);
  --line-strong: var(--gtw-line-strong);
  --accent: var(--gtw-terracotta);
  --accent-ink: #7c2e25;
  --accent-soft: #f6e0d4;
  --focus-ring: var(--gtw-espresso);
  --info: var(--gtw-coffee);
  --info-soft: #f6e0d4;

  --home-cream: var(--gtw-paper);
  --home-coffee: var(--gtw-latte);
  --home-sunset: var(--gtw-peach);
  --home-paper: var(--gtw-cream);
  --home-ink: var(--gtw-ink);
  --home-coffee-deep: var(--gtw-coffee);
  --home-espresso: var(--gtw-espresso);
  --home-terracotta: var(--gtw-terracotta);
  --home-line: var(--gtw-line);
  --home-muted: var(--gtw-muted);

  color-scheme: light !important;
}

/* Widths */

.gtw-width-read,
.gtw-editorial {
  width: min(var(--gtw-width-read), calc(100% - 2 * var(--gtw-gutter)));
  margin-inline: auto;
}

.gtw-width-page {
  width: min(var(--gtw-width-page), calc(100% - 2 * var(--gtw-gutter)));
  margin-inline: auto;
}

.gtw-width-workspace {
  width: min(var(--gtw-width-workspace), calc(100% - 2 * var(--gtw-gutter)));
  margin-inline: auto;
}

.gtw-width-full {
  width: 100%;
  margin-inline: 0;
}

/* Section surfaces */

.gtw-section-paper,
.gtw-section-sand,
.gtw-section-peach,
.gtw-section-dark,
.gtw-related,
.gtw-promo {
  padding-block: var(--gtw-space-7);
}

.gtw-section-paper {
  background: var(--gtw-paper);
  color: var(--gtw-ink);
}

.gtw-section-sand {
  background: var(--gtw-sand);
  color: var(--gtw-ink);
}

.gtw-section-peach {
  background: var(--gtw-peach);
  color: var(--gtw-ink);
}

.gtw-section-dark {
  background: var(--gtw-espresso);
  color: var(--gtw-cream);
}

.gtw-section-dark a {
  color: var(--gtw-peach);
}

.gtw-workspace {
  padding: var(--gtw-space-5);
  background: var(--gtw-cream);
  border: 1px solid var(--gtw-line-strong);
  border-left: 4px solid var(--gtw-espresso);
  border-radius: var(--gtw-radius);
  box-shadow: var(--gtw-inset), var(--gtw-shadow);
}

.gtw-related {
  background: var(--gtw-latte);
  color: var(--gtw-ink);
  border-block: 1px solid var(--gtw-line);
}

.gtw-promo {
  background: var(--gtw-espresso);
  color: var(--gtw-cream);
}

/* Buttons */

body.theme-publication :is(a, button).gtw-btn,
body.theme-publication :is(a, button).gtw-btn-primary,
body.theme-publication :is(a, button).gtw-btn-secondary,
body.theme-publication :is(a, button).gtw-btn-dark,
body.theme-publication :is(a, button).gtw-btn-external {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 2.75rem;
  padding: 0.45rem 1rem;
  border: 2px solid var(--gtw-terracotta);
  border-radius: var(--gtw-radius-action);
  background: var(--gtw-terracotta);
  color: var(--gtw-cream);
  font: 600 var(--gtw-type-ui)/1 var(--gtw-font-ui);
  text-decoration: none;
  cursor: pointer;
}

body.theme-publication :is(a, button).gtw-btn:hover,
body.theme-publication :is(a, button).gtw-btn-primary:hover {
  background: #7c2e25;
  border-color: #7c2e25;
  color: var(--gtw-cream);
}

body.theme-publication :is(a, button).gtw-btn-secondary {
  background: transparent;
  border-color: var(--gtw-ink);
  color: var(--gtw-ink);
}

body.theme-publication :is(a, button).gtw-btn-secondary:hover {
  background: var(--gtw-espresso);
  border-color: var(--gtw-espresso);
  color: var(--gtw-cream);
}

body.theme-publication :is(a, button).gtw-btn-dark {
  background: var(--gtw-espresso);
  border-color: var(--gtw-espresso);
  color: var(--gtw-cream);
}

body.theme-publication :is(a, button).gtw-btn-dark:hover {
  background: var(--gtw-coffee);
  border-color: var(--gtw-coffee);
  color: var(--gtw-cream);
}

body.theme-publication :is(a, button).gtw-btn-external {
  background: var(--gtw-career);
  border-color: var(--gtw-career);
  color: var(--gtw-cream);
}

body.theme-publication :is(a, button).gtw-btn-external:hover {
  background: var(--gtw-career-hover);
  border-color: var(--gtw-career-hover);
  color: var(--gtw-cream);
}

body.theme-publication a.gtw-btn-text {
  display: inline-flex;
  align-items: center;
  min-height: 2.25rem;
  font: 600 var(--gtw-type-ui)/1.3 var(--gtw-font-ui);
  color: var(--gtw-coffee);
  text-decoration: none;
  border-bottom: 2px solid var(--gtw-terracotta);
}

body.theme-publication a.gtw-btn-text:hover {
  color: var(--gtw-terracotta);
}

/* Cards */

.gtw-card-tool,
.gtw-card-guide,
.gtw-card-article,
.gtw-card-app,
.gtw-card-career,
.gtw-card-result,
.gtw-card-related {
  display: flex;
  flex-direction: column;
  gap: 0.35rem;
  padding: 1rem 1rem 1.1rem;
  border-radius: var(--gtw-radius);
  text-decoration: none;
  color: inherit;
}

.gtw-card-tool {
  background: var(--gtw-cream);
  border: 1px solid var(--gtw-line-strong);
  border-left: 4px solid var(--gtw-espresso);
}

.gtw-card-guide {
  background: var(--gtw-paper);
  border: 1px solid var(--gtw-line);
  border-top: 3px solid var(--gtw-terracotta);
}

.gtw-card-article {
  background: transparent;
  border: 0;
  border-bottom: 1px solid var(--gtw-line);
  border-radius: 0;
  padding-inline: 0;
}

.gtw-card-app {
  background: var(--gtw-latte);
  border: 1px solid var(--gtw-line);
}

.gtw-card-career {
  background: var(--gtw-cream);
  border: 1px solid var(--gtw-career);
}

.gtw-card-result {
  background: var(--gtw-ok-bg);
  border: 1px solid var(--gtw-ok-line);
  color: var(--gtw-ok-ink);
}

.gtw-card-related {
  background: var(--gtw-latte);
  border: 1px solid var(--gtw-line);
}

@media (max-width: 720px) {
  .gtw-section-paper,
  .gtw-section-sand,
  .gtw-section-peach,
  .gtw-section-dark,
  .gtw-related,
  .gtw-promo {
    padding-block: var(--gtw-space-6);
  }

  .gtw-workspace {
    padding: var(--gtw-space-4);
  }
}