@charset "UTF-8";
/**
 * Anthropic theme for reveal.js.
 *
 * Based on Anthropic slide style
 */
@import "../../lib/fonts/Lora/lora.css";
@import "../../lib/fonts/Poppins/poppins.css";
section.has-light-background, section.has-light-background h1, section.has-light-background h2, section.has-light-background h3, section.has-light-background h4, section.has-light-background h5, section.has-light-background h6 {
  color: #111111;
}

/*********************************************
 * GLOBAL STYLES
 *********************************************/
:root {
  --r-background-color: #F5F5F3;
  --r-main-font: Lora, serif;
  --r-main-font-size: 3.4vh;
  --r-main-color: #111111;
  --r-block-margin: 20px;
  --r-heading-margin: 0 0 20px 0;
  --r-heading-font: Poppins, sans-serif;
  --r-heading-color: #111111;
  --r-heading-line-height: 1.2;
  --r-heading-letter-spacing: normal;
  --r-heading-text-transform: none;
  --r-heading-text-shadow: none;
  --r-heading-font-weight: 600;
  --r-heading1-text-shadow: none;
  --r-heading1-size: min(8vh, 5vw);
  --r-heading2-size: 5vh;
  --r-heading3-size: 4.2vh;
  --r-heading4-size: 2vh;
  --r-code-font: monospace;
  --r-link-color: #13DAEC;
  --r-link-color-dark: rgb(13.3, 152.6, 165.2);
  --r-link-color-hover: rgb(113.4, 232.8, 243.6);
  --r-selection-background-color: #FF5E99;
  --r-selection-color: #fff;
}

.reveal-viewport {
  background: #F5F5F3;
  background-color: var(--r-background-color);
}

.reveal {
  font-family: var(--r-main-font);
  font-size: var(--r-main-font-size);
  font-weight: normal;
  color: var(--r-main-color);
}

.reveal ::selection {
  color: var(--r-selection-color);
  background: var(--r-selection-background-color);
  text-shadow: none;
}

.reveal ::-moz-selection {
  color: var(--r-selection-color);
  background: var(--r-selection-background-color);
  text-shadow: none;
}

.reveal .slides section,
.reveal .slides section > section {
  line-height: 1.3;
  font-weight: inherit;
}

/*********************************************
 * HEADERS
 *********************************************/
.reveal h1,
.reveal h2,
.reveal h3,
.reveal h4,
.reveal h5,
.reveal h6 {
  margin: var(--r-heading-margin);
  color: var(--r-heading-color);
  font-family: var(--r-heading-font);
  font-weight: var(--r-heading-font-weight);
  line-height: var(--r-heading-line-height);
  letter-spacing: var(--r-heading-letter-spacing);
  text-transform: var(--r-heading-text-transform);
  text-shadow: var(--r-heading-text-shadow);
  word-wrap: break-word;
}

.reveal h1 {
  font-size: var(--r-heading1-size);
}

.reveal h2 {
  font-size: var(--r-heading2-size);
}

.reveal h3 {
  font-size: var(--r-heading3-size);
}

.reveal h4 {
  font-size: var(--r-heading4-size);
}

.reveal h1 {
  text-shadow: var(--r-heading1-text-shadow);
}

/*********************************************
 * OTHER
 *********************************************/
.reveal p {
  margin: var(--r-block-margin) 0;
  line-height: 1.3;
}

/* Remove trailing margins after titles */
.reveal h1:last-child,
.reveal h2:last-child,
.reveal h3:last-child,
.reveal h4:last-child,
.reveal h5:last-child,
.reveal h6:last-child {
  margin-bottom: 0;
}

/* Ensure certain elements are never larger than the slide itself */
.reveal img,
.reveal video,
.reveal iframe {
  max-width: 95%;
  max-height: 95%;
}

.reveal strong,
.reveal b {
  font-weight: bold;
}

.reveal em {
  font-style: italic;
}

.reveal ol,
.reveal dl,
.reveal ul {
  display: inline-block;
  text-align: left;
  margin: 0 0 0 1em;
}

.reveal ol {
  list-style-type: decimal;
}

.reveal ul {
  list-style-type: disc;
}

.reveal ul ul {
  list-style-type: square;
}

.reveal ul ul ul {
  list-style-type: circle;
}

.reveal ul ul,
.reveal ul ol,
.reveal ol ol,
.reveal ol ul {
  display: block;
  margin-left: 40px;
}

.reveal dt {
  font-weight: bold;
}

.reveal dd {
  margin-left: 40px;
}

.reveal blockquote {
  display: block;
  position: relative;
  width: 70%;
  margin: var(--r-block-margin) auto;
  padding: 5px;
  font-style: italic;
  background: rgba(255, 255, 255, 0.05);
  box-shadow: 0px 0px 2px rgba(0, 0, 0, 0.2);
}

.reveal blockquote p:first-child,
.reveal blockquote p:last-child {
  display: inline-block;
}

.reveal q {
  font-style: italic;
}

.reveal pre {
  display: block;
  position: relative;
  width: 90%;
  margin: var(--r-block-margin) auto;
  text-align: left;
  font-size: 0.55em;
  font-family: var(--r-code-font);
  line-height: 1.2em;
  word-wrap: break-word;
  box-shadow: 0px 5px 15px rgba(0, 0, 0, 0.15);
}

.reveal code {
  font-family: var(--r-code-font);
  text-transform: none;
  tab-size: 2;
}

.reveal pre code {
  display: block;
  padding: 5px;
  overflow: auto;
  max-height: 400px;
  word-wrap: normal;
}

.reveal .code-wrapper {
  white-space: normal;
}

.reveal .code-wrapper code {
  white-space: pre;
}

.reveal table {
  margin: auto;
  border-collapse: collapse;
  border-spacing: 0;
}

.reveal table th {
  font-weight: bold;
}

.reveal table th,
.reveal table td {
  text-align: left;
  padding: 0.2em 0.5em 0.2em 0.5em;
  border-bottom: 1px solid;
}

.reveal table th[align=center],
.reveal table td[align=center] {
  text-align: center;
}

.reveal table th[align=right],
.reveal table td[align=right] {
  text-align: right;
}

.reveal table tbody tr:last-child th,
.reveal table tbody tr:last-child td {
  border-bottom: none;
}

.reveal sup {
  vertical-align: super;
  font-size: smaller;
}

.reveal sub {
  vertical-align: sub;
  font-size: smaller;
}

.reveal small {
  display: inline-block;
  font-size: 0.6em;
  line-height: 1.2em;
  vertical-align: top;
}

.reveal small * {
  vertical-align: top;
}

.reveal img {
  margin: var(--r-block-margin) 0;
}

/*********************************************
 * LINKS
 *********************************************/
.reveal a {
  color: var(--r-link-color);
  text-decoration: none;
  transition: color 0.15s ease;
}

.reveal a:hover {
  color: var(--r-link-color-hover);
  text-shadow: none;
  border: none;
}

.reveal .roll span:after {
  color: #fff;
  background: var(--r-link-color-dark);
}

/*********************************************
 * Frame helper
 *********************************************/
.reveal .r-frame {
  border: 4px solid var(--r-main-color);
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.15);
}

.reveal a .r-frame {
  transition: all 0.15s linear;
}

.reveal a:hover .r-frame {
  border-color: var(--r-link-color);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.55);
}

/*********************************************
 * NAVIGATION CONTROLS
 *********************************************/
.reveal .controls {
  color: var(--r-link-color);
}

/*********************************************
 * PROGRESS BAR
 *********************************************/
.reveal .progress {
  background: rgba(0, 0, 0, 0.2);
  color: var(--r-link-color);
}

/*********************************************
 * PRINT BACKGROUND
 *********************************************/
@media print {
  .backgrounds {
    background-color: var(--r-background-color);
  }
}
.reveal div.slides {
  text-align: left;
}
.reveal .slides section {
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.reveal .slides > section.content-slide,
.reveal .slides > section > section.content-slide {
  height: 100vh;
  width: 86vw;
  padding: 7vh 8vw 8vh;
  overflow: hidden;
}
.reveal .slides > section.content-slide .content .two-column-table,
.reveal .slides > section.content-slide .content .three-column-table,
.reveal .slides > section > section.content-slide .content .two-column-table,
.reveal .slides > section > section.content-slide .content .three-column-table {
  border: none;
  margin: 0;
  padding: 0;
  background: transparent;
  vertical-align: top;
}
.reveal .slides > section.content-slide .content .two-column-table tr,
.reveal .slides > section.content-slide .content .two-column-table td,
.reveal .slides > section.content-slide .content .three-column-table tr,
.reveal .slides > section.content-slide .content .three-column-table td,
.reveal .slides > section > section.content-slide .content .two-column-table tr,
.reveal .slides > section > section.content-slide .content .two-column-table td,
.reveal .slides > section > section.content-slide .content .three-column-table tr,
.reveal .slides > section > section.content-slide .content .three-column-table td {
  border: none;
  margin: 0;
  padding: 0;
  background: transparent;
  vertical-align: top;
}
.reveal .slides > section.content-slide .content .two-column-table .left-column,
.reveal .slides > section > section.content-slide .content .two-column-table .left-column {
  padding-right: 4vw;
}
.reveal .slides > section.content-slide .content .three-column-table .left-column,
.reveal .slides > section.content-slide .content .three-column-table .middle-column,
.reveal .slides > section > section.content-slide .content .three-column-table .left-column,
.reveal .slides > section > section.content-slide .content .three-column-table .middle-column {
  padding-right: 2vw;
}

.reveal .col h3,
.reveal .left-column h3,
.reveal .right-column h3,
.reveal .middle-column h3 {
  font-family: "Poppins", sans-serif;
  font-size: 4.2vh;
  font-weight: 700;
  color: #111111;
  letter-spacing: -0.01em;
  text-transform: none;
  line-height: 1.2;
  margin-bottom: 4vh;
  position: relative;
  display: inline-block;
  padding-bottom: 1vh;
}
.reveal .col h3::after,
.reveal .left-column h3::after,
.reveal .right-column h3::after,
.reveal .middle-column h3::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 2.5vw;
  height: 0.3vh;
  background-color: #CC785C;
}

.reveal .spacer {
  flex: 1;
}

.reveal .content-slide {
  display: flex;
  flex-direction: column;
  height: 100vh;
  width: 86vw;
  padding: 7vh 8vw 8vh;
  overflow: hidden;
}
.reveal .content-slide .slide-header h1 {
  font-family: "Poppins", sans-serif;
  font-size: 5vh;
  font-weight: 600;
  color: #111111;
  letter-spacing: -0.01em;
  text-transform: none;
  line-height: 1.2;
  margin-bottom: 2vh;
  margin-top: 3vh;
}
.reveal .content-slide .slide-header .slide-subtitle {
  font-family: "Lora", serif;
  font-style: italic;
  font-size: 3.75vh;
  color: #383838;
  margin-bottom: 3vh;
  margin-top: 0;
  max-width: 100%;
}
.reveal .content-slide .slide-header h1:only-child {
  margin-bottom: 4.2vh;
}
.reveal .content-slide .content {
  font-family: "Lora", serif;
  font-size: 3.4vh;
  font-weight: 400;
  color: #111111;
  line-height: 1.5;
  width: 100%;
  margin-top: 1vh;
}
.reveal .content-slide p {
  margin: 0 0 2vh 0;
  color: #383838;
  max-width: 90%; /* Allow more space for content */
}
.reveal .slides .h1 {
  text-align: left;
}

.reveal .footer {
  position: absolute;
  bottom: 4vh;
  left: 8vw;
  right: 8vw;
  display: flex;
  justify-content: space-between;
  align-items: center;
  letter-spacing: 0.02em;
}
.reveal .footer .logo {
  display: flex;
  align-items: center;
}
.reveal .footer .logo .anthropic-wordmark {
  height: 1.8vh;
  width: auto;
  fill: #828179;
}
.reveal .footer .right-footer {
  display: flex;
  align-items: center;
}
.reveal .footer .confidential {
  font-family: "Poppins", sans-serif;
  font-size: 2vh;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.6);
  text-transform: uppercase;
  font-size: 1.6vh;
  margin-right: 1vw;
  opacity: 0.9;
}
.reveal .footer .page-number {
  font-family: "Poppins", sans-serif;
  font-size: 2vh;
  font-weight: 500;
  color: rgba(0, 0, 0, 0.6);
  margin-right: 0;
  opacity: 0.9;
}

.reveal .chapter-slide {
  color: rgba(0, 0, 0, 0.85);
  background-color: #CC785C;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100vh;
  position: relative;
  padding: 8vh 8vw;
}
.reveal .chapter-slide h3, .reveal .chapter-slide p, .reveal .chapter-slide i, .reveal .chapter-slide div {
  max-width: 90%;
  word-wrap: break-word;
  overflow-wrap: break-word;
  font-size: 3vh;
  margin-bottom: 2vh;
}
.reveal .chapter-slide .chapter-extra-content {
  max-width: 90%;
  margin-top: 3vh;
  word-wrap: break-word;
  overflow-wrap: break-word;
  width: 100%;
}
.reveal .chapter-slide .chapter-extra-content h3, .reveal .chapter-slide .chapter-extra-content p, .reveal .chapter-slide .chapter-extra-content i, .reveal .chapter-slide .chapter-extra-content div, .reveal .chapter-slide .chapter-extra-content span {
  max-width: 100%;
  word-wrap: break-word;
  overflow-wrap: break-word;
  font-size: 2.8vh;
  line-height: 1.4;
}
.reveal .chapter-slide .chapter-extra-content .italic, .reveal .chapter-slide .chapter-extra-content i {
  font-style: italic;
  opacity: 0.8;
}
.reveal .chapter-slide .anthropic-logo {
  position: absolute;
  bottom: 4vh;
  left: 8vw;
  display: flex;
  align-items: center;
}
.reveal .chapter-slide .anthropic-logo .anthropic-wordmark {
  height: 1.8vh;
  width: auto;
  fill: #141413;
}
.reveal .chapter-slide .chapter-content {
  max-width: 90%;
  text-align: left;
  margin-left: 0;
  word-wrap: break-word;
  overflow-wrap: break-word;
  width: 100%;
}
.reveal .chapter-slide .slide-subtitle {
  color: #111111;
  font-size: 3vh;
  margin-bottom: 2vh;
  font-family: "Lora", serif;
  font-weight: 400;
  opacity: 0.85;
}
.reveal .chapter-slide .slide-title {
  position: relative;
  display: block;
  color: rgba(0, 0, 0, 0.85);
  font-size: min(8vh, 5vw);
  line-height: 1.1;
  margin: 0;
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  text-transform: none;
  max-width: 100%;
  word-wrap: break-word;
  overflow-wrap: break-word;
}
.reveal .chapter-slide .slide-title::after {
  content: "";
  display: block;
  position: absolute;
  bottom: 0.15em;
  left: -0.1em;
  width: 100%;
  height: 0.3em;
  background-color: rgba(255, 255, 255, 0.35);
  z-index: -1;
}
.reveal .chapter-slide .confidential {
  position: absolute;
  bottom: 4vh;
  right: 12vw;
  font-family: "Poppins", sans-serif;
  font-weight: 500;
  font-size: 2vh;
  color: rgba(0, 0, 0, 0.85);
}
.reveal .chapter-slide .page-number {
  position: absolute;
  bottom: 4vh;
  right: 8vw;
  font-family: "Poppins", sans-serif;
  font-weight: 500;
  font-size: 2vh;
  color: rgba(0, 0, 0, 0.85);
}

.reveal .title-slide {
  background-color: #111111;
  color: #FFFFFF;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  height: 100vh;
}
.reveal .title-slide .anthropic-logo {
  position: absolute;
  top: 7vh;
  left: 8vw;
  display: flex;
  align-items: center;
}
.reveal .title-slide .anthropic-logo .anthropic-wordmark {
  height: 1.8vh;
  width: auto;
  fill: #FAFAF8;
}
.reveal .title-slide .title-content {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 0 8vw;
  height: 80vh;
  text-align: center;
}
.reveal .title-slide h1, .reveal .title-slide h2, .reveal .title-slide h3, .reveal .title-slide p {
  color: #FFFFFF;
  margin: 1vh 0;
}
.reveal .title-slide h1 {
  font-family: "Poppins", sans-serif;
  font-size: min(8vh, 5vw);
  font-weight: 600;
  color: #FFFFFF;
  letter-spacing: -0.01em;
  text-transform: none;
  line-height: 1.2;
  line-height: 1.2;
  margin-bottom: 2vh;
}
.reveal .title-slide h2 {
  font-family: "Poppins", sans-serif;
  font-size: 4.2vh;
  font-weight: 600;
  color: #FFFFFF;
  letter-spacing: -0.01em;
  text-transform: none;
  line-height: 1.2;
  margin-top: 2vh;
}
.reveal .title-slide h3 {
  font-family: "Poppins", sans-serif;
  font-size: 4.2vh;
  font-weight: 500;
  color: #FFFFFF;
  letter-spacing: -0.01em;
  text-transform: none;
  line-height: 1.2;
  font-size: 3.5vh;
  opacity: 0.9;
}
.reveal .title-slide h5 {
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  font-size: 2vh;
  color: #FFFFFF;
  opacity: 0.7;
  margin-top: 2vh;
}
.reveal .title-slide p {
  font-family: "Lora", serif;
  font-size: 2vh;
  font-weight: 400;
  color: #111111;
  line-height: 1.5;
}
.reveal .title-slide .footer {
  width: 100%;
  padding: 4vh 8vw;
  text-align: center;
  font-family: "Poppins", sans-serif;
  font-size: 2vh;
  font-weight: 400;
  opacity: 0.7;
}

.reveal .slide-header {
  margin-bottom: 2.4vh;
}

.reveal .content {
  flex: 1;
}

.reveal ul {
  list-style-type: none;
  margin-left: 0;
  margin-top: 0;
}
.reveal ul li {
  position: relative;
  padding-left: 3vh;
  margin-bottom: 3.15vh;
  font-family: "Lora", serif;
}
.reveal ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1.9vh;
  width: 1.5vh;
  height: 1.5vh;
  background-color: #CC785C;
  border-radius: 50%;
  opacity: 1;
  box-shadow: 0 0.1vh 0.2vh rgba(0, 0, 0, 0.15);
}
.reveal ul li ul {
  list-style-type: none;
  margin-top: 1.8vh;
  font-size: 3vh;
  margin-left: 1.95vh;
}
.reveal ul li ul li {
  padding-left: 3vh;
  margin-bottom: 1.17vh;
}
.reveal ul li ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1.75vh;
  width: 1vh;
  height: 1vh;
  border: 0.18vh solid #CC785C;
  background-color: transparent;
  border-radius: 50%;
  opacity: 1;
  box-shadow: 0 0.1vh 0.2vh rgba(0, 0, 0, 0.1);
}
.reveal ul.squeeze li {
  margin-bottom: 2.3625vh;
}
.reveal ul.squeeze li ul {
  margin-top: 1.35vh;
  margin-left: 1.95vh;
}
.reveal ul.squeeze li ul li {
  padding-left: 3vh;
  margin-bottom: 0.8775vh;
}
.reveal ul.squeeze li ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1.75vh;
  width: 1vh;
  height: 1vh;
  border: 0.18vh solid #CC785C;
  background-color: transparent;
  border-radius: 50%;
  opacity: 1;
  box-shadow: 0 0.1vh 0.2vh rgba(0, 0, 0, 0.1);
}
.reveal ul.squeeze-more {
  font-size: 2.89vh;
}
.reveal ul.squeeze-more li {
  margin-bottom: 1.575vh;
  padding-left: 2.55vh;
}
.reveal ul.squeeze-more li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1.615vh;
  width: 1.275vh;
  height: 1.275vh;
  background-color: #CC785C;
  border-radius: 50%;
  opacity: 1;
  box-shadow: 0 0.1vh 0.2vh rgba(0, 0, 0, 0.15);
}
.reveal ul.squeeze-more li ul {
  margin-top: 0.9vh;
  margin-left: 1.95vh;
  font-size: 0.9em;
}
.reveal ul.squeeze-more li ul li {
  padding-left: 2.55vh;
  margin-bottom: 0.585vh;
}
.reveal ul.squeeze-more li ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1.4875vh;
  width: 0.85vh;
  height: 0.85vh;
  border: 0.153vh solid #CC785C;
  background-color: transparent;
  border-radius: 50%;
  opacity: 1;
  box-shadow: 0 0.1vh 0.2vh rgba(0, 0, 0, 0.1);
}
.reveal .anthropic-bullets li::before {
  box-shadow: 0 0.2vh 0.3vh rgba(0, 0, 0, 0.15);
}

.reveal .toc-slide {
  display: flex;
  flex-direction: column;
  height: 100vh;
  width: 86vw;
  padding: 7vh 8vw 8vh;
  overflow: hidden;
}
.reveal .toc-slide h1 {
  font-family: "Poppins", sans-serif;
  font-size: 5vh;
  font-weight: 600;
  color: #111111;
  letter-spacing: -0.01em;
  text-transform: none;
  line-height: 1.2;
  font-size: 4.5vh;
  margin-bottom: 4vh;
}
.reveal .toc-slide ul {
  font-size: 3.4vh;
  margin-left: 0;
}
.reveal .toc-slide ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1.3vh;
  width: 1.5vh;
  height: 1.5vh;
  background-color: #CC785C;
  border-radius: 50%;
  opacity: 1;
  box-shadow: 0 0.1vh 0.2vh rgba(0, 0, 0, 0.15);
}
.reveal .toc-slide ul ul {
  font-size: calc(3.4vh - 0.2vh);
  margin-top: 2.25vh;
  margin-bottom: 2vh;
  margin-left: 2vw;
}
.reveal .toc-slide ul ul li::before {
  content: "";
  position: absolute;
  left: 0;
  top: 1.6vh;
  width: 1.2vh;
  height: 1.2vh;
  background-color: #CC785C;
  border-radius: 50%;
  opacity: 1;
  box-shadow: 0 0.1vh 0.2vh rgba(0, 0, 0, 0.15);
}

.reveal pre {
  background-color: #f5f5f5;
  border-radius: 1vh;
  border: 1px solid rgba(224, 224, 224, 0.7);
  box-shadow: 0 0.4vh 1.2vh rgba(0, 0, 0, 0.07);
  font-size: calc(3.4vh * 0.6); /* Smaller for code */
  overflow: hidden; /* Ensure code stays within rounded corners */
  transition: box-shadow 0.2s ease;
}
.reveal pre:hover {
  box-shadow: 0 0.5vh 1.5vh rgba(0, 0, 0, 0.1);
}

.reveal pre code {
  padding: 2.2vh 2.5vw;
  font-size: 1.8vh;
  line-height: 1.5;
  max-height: 75vh;
  border-radius: 0.8vh; /* Inner radius for code */
}

/* Override all non-viewport font sizes */
.reveal sup,
.reveal sub,
.reveal small {
  font-size: 1.5vh;
}

.reveal .slides {
  margin: 0;
}

/* Override styles from print stylesheets */
@media print {
  .reveal {
    font-size: 2.2vh !important;
  }
  .reveal pre,
  .reveal code {
    font-size: 1.8vh !important;
  }
  .reveal small {
    font-size: 1.5vh !important;
  }
}
/* Custom navigation controls */
.reveal .controls {
  color: #CC785C;
}
.reveal .controls button {
  opacity: 0.7 !important;
}
.reveal .controls button:hover {
  opacity: 1 !important;
  color: rgb(186.6121495327, 90.4439252336, 58.3878504673);
}
.reveal .controls .controls-arrow::before,
.reveal .controls .controls-arrow::after {
  background-color: currentColor;
}

/* Custom progress bar */
.reveal .progress {
  height: 0.4vh;
  background-color: rgba(201, 201, 201, 0.4);
}
.reveal .progress span {
  background-color: #CC785C;
}

/* Aspect ratio warning */
.reveal .aspect-ratio-warning {
  position: fixed;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  background-color: rgba(204, 120, 92, 0.95);
  color: white;
  padding: 1.5vh 2vw;
  border-radius: 0.6vh;
  font-family: "Poppins", sans-serif;
  font-size: 2vh;
  line-height: 1.4;
  text-align: center;
  z-index: 9999;
  box-shadow: 0 0.4vh 1.2vh rgba(0, 0, 0, 0.2);
  opacity: 0;
  transition: opacity 0.5s ease;
  pointer-events: none;
  max-width: 80vw;
  width: auto;
  display: flex;
  align-items: center;
}
.reveal .aspect-ratio-warning::before {
  content: "⚠️";
  font-size: 2.5vh;
  margin-right: 1vw;
}
.reveal .aspect-ratio-warning.visible {
  opacity: 1;
}

.reveal .my-code {
  border-radius: 1vh;
  box-shadow: 0 0.4vh 1.2vh rgba(0, 0, 0, 0.07);
  border: 1px solid rgba(224, 224, 224, 0.7);
  overflow: hidden;
  transition: box-shadow 0.2s ease;
}
.reveal .my-code:hover {
  box-shadow: 0 0.5vh 1.5vh rgba(0, 0, 0, 0.1);
}

.reveal table {
  border-collapse: collapse;
  border: none;
  margin: 2vh 0;
}

.reveal table th {
  background-color: #f0f0f0;
  color: #111111;
  font-weight: 600;
  padding: 1.5vh 1.5vw;
  font-family: "Poppins", sans-serif;
}

.reveal table td {
  padding: 1.5vh 1.5vw;
  border-bottom: 0.1vh solid #e0e0e0;
}

.reveal .contact-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5em;
}

.reveal .contact-info p {
  margin: 0;
}

.reveal blockquote {
  position: relative;
  background-color: rgba(204, 120, 92, 0.05);
  border-left: 0.6vh solid #CC785C;
  border-radius: 0.6vh;
  padding: 2.5vh 3vw;
  padding-top: 3.5vh;
  margin: 10vh 0 3vh 0; /* increased top margin to 10vh for more separation */
  font-family: "Poppins", sans-serif;
  font-weight: 400;
  font-size: 0.9em;
  line-height: 1.5;
  font-style: normal;
  box-shadow: 0 0.4vh 1.2vh rgba(0, 0, 0, 0.07);
  border: 1px solid rgba(204, 120, 92, 0.1);
}
.reveal blockquote::before {
  content: "Quote";
  position: absolute;
  top: 0;
  left: 1.5vw;
  transform: translateY(-50%);
  background-color: #CC785C;
  color: white;
  font-family: "Poppins", sans-serif;
  font-weight: 500;
  font-size: 0.65em;
  padding: 0.25vh 0.9vw;
  border-radius: 0.45vh;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  box-shadow: 0 0.2vh 0.5vh rgba(0, 0, 0, 0.1);
}
.reveal blockquote::after {
  content: '"';
  position: absolute;
  right: 2vw;
  bottom: 0.5vh;
  font-family: Georgia, serif;
  font-size: 7vh;
  line-height: 1;
  color: rgba(204, 120, 92, 0.15);
}
.reveal blockquote cite {
  display: block;
  margin-top: 0.5vh;
  font-weight: 500;
  font-style: normal;
  color: #383838;
  font-size: 0.8em;
  text-align: right;
}
.reveal blockquote cite::before {
  content: "— ";
}

.reveal .vcenter-box {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.reveal .vcenter-element {
  margin: 0 auto;
  max-width: 75%;
}

.reveal .key-takeaway {
  position: relative;
  background-color: rgba(204, 120, 92, 0.12);
  border-left: 0.6vh solid #CC785C;
  border-radius: 0.6vh;
  padding: 3vh 3vw;
  margin: 4vh 0;
  font-family: "Poppins", sans-serif;
  font-weight: 500;
  font-size: 0.95em;
  line-height: 1.5;
  box-shadow: 0 0.5vh 1.5vh rgba(0, 0, 0, 0.1);
}
.reveal .key-takeaway::before {
  content: "Key Takeaway";
  position: absolute;
  top: 0;
  left: 1.5vw;
  transform: translateY(-50%);
  background-color: #CC785C;
  color: white;
  font-family: "Poppins", sans-serif;
  font-weight: 500;
  font-size: 0.7em;
  padding: 0.3vh 1vw;
  border-radius: 0.5vh;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  box-shadow: 0 0.2vh 0.5vh rgba(0, 0, 0, 0.1);
}
.reveal .key-takeaway::after {
  content: "!";
  position: absolute;
  right: 2vw;
  bottom: 0.5vh;
  font-family: "Poppins", sans-serif;
  font-size: 7vh;
  font-weight: 700;
  line-height: 1;
  color: rgba(204, 120, 92, 0.15);
}
.reveal .key-takeaway p {
  margin: 0;
  color: #111111 !important;
}

.reveal .prompt-quote {
  position: relative;
  background-color: rgba(204, 120, 92, 0.07);
  border-radius: 1vh;
  padding: 2.5vh 3vw;
  padding-top: 4vh;
  margin: 3vh 0;
  font-family: "Poppins", sans-serif;
  font-size: 0.95em;
  line-height: 1.5;
  box-shadow: 0 0.4vh 1.2vh rgba(0, 0, 0, 0.07);
  border: 1px solid rgba(204, 120, 92, 0.1);
}
.reveal .prompt-quote::before {
  content: "Prompt";
  position: absolute;
  top: 0;
  left: 1.5vw;
  transform: translateY(-50%);
  background-color: #CC785C;
  color: white;
  font-family: "Poppins", sans-serif;
  font-weight: 500;
  font-size: 0.7em;
  padding: 0.3vh 1vw;
  border-radius: 0.5vh;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  box-shadow: 0 0.2vh 0.5vh rgba(0, 0, 0, 0.1);
}
.reveal .prompt-quote::after {
  content: '"';
  position: absolute;
  right: 2vw;
  bottom: 0.5vh;
  font-family: Georgia, serif;
  font-size: 8vh;
  line-height: 1;
  color: rgba(204, 120, 92, 0.2);
}

.reveal img {
  border: none;
  box-shadow: none;
  max-height: 65vh;
}

.reveal .video-crop-container {
  width: 70%; /* Container width */
  border-radius: 17px;
  margin: 0 auto; /* Center the container */
  overflow: hidden; /* Hide overflowing video content */
  position: relative;
  display: flex; /* Use flexbox for proper containment */
  align-items: center;
  justify-content: center;
  /* Set a specific height for the container to ensure proper containment */
  max-height: 75vh;
  transform: translateY(-5vh);
  /* Add aesthetically pleasing shadow that matches Anthropic style */
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.1), 0 5px 15px rgba(204, 120, 92, 0.07), 0 2px 5px rgba(0, 0, 0, 0.08); /* Crisp close shadow */
  /* Add a subtle border for definition */
  border: 1px solid rgba(201, 201, 201, 0.3);
}

.reveal .video-crop-container video {
  width: 120%; /* Video is wider than container */
  max-width: none;
  /* Use object-fit to ensure the video maintains aspect ratio 
     while still filling the container */
  object-fit: cover;
  object-position: center;
  /* Ensure the video doesn't exceed the container height */
  max-height: 100%;
  /* Set vertical alignment */
  vertical-align: middle;
  /* Position relative for the controls to work */
  position: relative;
}

.reveal .custom-video-controls {
  position: absolute;
  bottom: 20px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: rgba(0, 0, 0, 0.5);
  /* Make padding equal on all sides to ensure visual balance */
  padding: 10px;
  /* Ensure the play/pause button is exactly in the center */
  padding-left: 12px;
  padding-right: 12px;
  border-radius: 30px;
  transition: all 0.3s ease;
  opacity: 0.7;
  /* Add subtle glow to match video container */
  box-shadow: 0 0 15px rgba(204, 120, 92, 0.2);
  /* Add subtle border for definition */
  border: 1px solid rgba(255, 255, 255, 0.1);
  /* Add equal gap between buttons */
  gap: 12px;
  /* Extra spacing to account for different button sizes */
  box-sizing: content-box;
}

.reveal .custom-video-controls:hover {
  opacity: 1;
  box-shadow: 0 0 20px rgba(204, 120, 92, 0.25);
}

/* Shared button styles */
.reveal .video-btn, .reveal .rewind-btn, .reveal .forward-btn, .reveal .play-pause-btn {
  background-color: #CC785C;
  color: white;
  border: none;
  width: 40px;
  height: 40px;
  border-radius: 50%;
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: all 0.2s ease;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2), 0 0 8px rgba(204, 120, 92, 0.25);
  position: relative;
  overflow: hidden;
  /* Prevent text selection */
  user-select: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  /* Remove focus outline */
  outline: none;
  /* Prevent touch highlight on mobile */
  -webkit-tap-highlight-color: transparent;
}
.reveal .video-btn::after, .reveal .rewind-btn::after, .reveal .forward-btn::after, .reveal .play-pause-btn::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 40%;
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0.2), rgba(255, 255, 255, 0));
  border-radius: 50% 50% 0 0;
  pointer-events: none;
}
.reveal .video-btn:hover, .reveal .rewind-btn:hover, .reveal .forward-btn:hover, .reveal .play-pause-btn:hover {
  background-color: rgb(197.9228971963, 103.9135514019, 72.5771028037);
  transform: translateY(-1px);
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.25), 0 0 12px rgba(204, 120, 92, 0.35);
}
.reveal .video-btn:active, .reveal .rewind-btn:active, .reveal .forward-btn:active, .reveal .play-pause-btn:active {
  transform: translateY(1px);
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.2), 0 0 5px rgba(204, 120, 92, 0.2);
}

.reveal .play-pause-btn {
  /* Center button is slightly larger to create visual hierarchy */
  width: 44px;
  height: 44px;
  margin: 0 2px; /* Add a slight margin to improve visual centering */
}

.reveal .rewind-btn, .reveal .forward-btn {
  /* Slightly smaller size for the navigation buttons */
  width: 36px;
  height: 36px;
}

.reveal .fragment.highlight-current-red.current-fragment, .reveal ul li.highlight-current-red.current-fragment:not(.no-fragment) {
  color: #CC785C;
}

.reveal .split-50 {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 3rem;
  width: 100%;
  height: 100%;
}

.reveal .split-50 .content-col {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.reveal .split-50 .image-col {
  display: flex;
  justify-content: center;
  align-items: center;
}

.reveal .split-50 .image-col img {
  max-width: 100%;
  max-height: 60vh;
  object-fit: contain;
}

.reveal .people-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 6vh 4vw;
  text-align: center;
  margin-top: 2vh;
}

.reveal .people-grid .person {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.reveal .people-grid .person img {
  width: 15vh;
  height: 15vh;
  border-radius: 50%;
  object-fit: cover;
  border: 0.3vh solid #F5F5F3;
  box-shadow: 0 0.4vh 1.2vh rgba(0, 0, 0, 0.1);
}

.reveal .people-grid .person .name {
  font-family: "Poppins", sans-serif;
  font-weight: 600;
  font-size: 3.4vh;
  margin: 2vh 0 0.5vh 0;
  color: #111111;
}

.reveal .people-grid .person .role {
  font-family: "Lora", serif;
  font-size: 2vh;
  margin: 0;
  color: #888888;
}

.reveal code.no-numbers {
  padding: 1vh 1.5vw;
}

.reveal .spaced-list-50 > li {
  margin-top: 5vh;
}

.reveal .twitter-tweet-rendered > iframe {
  margin: 0 auto;
}

.reveal .download-button {
  display: inline-flex;
  align-items: center;
  background-color: #CC785C;
  color: #FFFFFF;
  font-family: "Poppins", sans-serif;
  font-weight: 500;
  font-size: 2.2vh;
  padding: 1.2vh 2vw;
  border-radius: 0.5vh;
  text-decoration: none;
  transition: background-color 0.2s ease, transform 0.2s ease, box-shadow 0.2s ease;
  box-shadow: 0 0.3vh 0.5vh rgba(0, 0, 0, 0.15);
  cursor: pointer;
  margin: 2vh 0;
}
.reveal .download-button:hover {
  background-color: rgb(186.6121495327, 90.4439252336, 58.3878504673);
  transform: translateY(-0.2vh);
  box-shadow: 0 0.5vh 0.8vh rgba(0, 0, 0, 0.2);
}
.reveal .download-button:active {
  transform: translateY(0);
  box-shadow: 0 0.2vh 0.3vh rgba(0, 0, 0, 0.15);
}
.reveal .download-button::before {
  content: "↓";
  margin-right: 1vw;
  font-weight: 700;
}

.cute-trick-text {
  font-style: italic;
}

.italic {
  font-style: italic;
}

.cute-trick-text code {
  font-style: normal;
}