/* Difficulty Demon — main.css
 * Compiled from aaa/style/scss/main.scss by CodeKit.
 * Do not edit directly. Edit the SCSS source files.
 * ─────────────────────────────────────────────── */

/* ── Variables / Custom Properties ──────────────── */
:root,
[data-theme="dark"] {
  --dd-bg:            #111111;
  --dd-bg-alt:        #1a1a1a;
  --dd-surface:       #333333;
  --dd-surface-alt:   #2a2a2a;
  --dd-text:          #d8d8d8;
  --dd-text-muted:    #888888;
  --dd-accent:        #c0392b;
  --dd-accent-hover:  #e04030;
  --dd-accent-subtle: rgba(192,57,43,.15);
  --dd-cta:           #d4881a;
  --dd-cta-hover:     #e89c20;
  --dd-border:        rgba(255,255,255,.10);
  --dd-border-strong: rgba(255,255,255,.20);
  --dd-nav-bg:        rgba(17,17,17,.96);
  --dd-input-bg:      #222222;
  --dd-overlay:       rgba(0,0,0,.65);
  --dd-shadow:        0 4px 24px rgba(0,0,0,.6);
  --dd-shadow-sm:     0 2px 8px  rgba(0,0,0,.4);
  --dd-toggler-filter: invert(1);
}

[data-theme="light"] {
  --dd-bg:            #f5f5f5;
  --dd-bg-alt:        #ebebeb;
  --dd-surface:       #ffffff;
  --dd-surface-alt:   #f0f0f0;
  --dd-text:          #1a1a1a;
  --dd-text-muted:    #666666;
  --dd-accent:        #9e2318;
  --dd-accent-hover:  #c0392b;
  --dd-accent-subtle: rgba(158,35,24,.10);
  --dd-cta:           #b8720e;
  --dd-cta-hover:     #d4881a;
  --dd-border:        rgba(0,0,0,.12);
  --dd-border-strong: rgba(0,0,0,.25);
  --dd-nav-bg:        rgba(245,245,245,.96);
  --dd-input-bg:      #ffffff;
  --dd-overlay:       rgba(0,0,0,.45);
  --dd-shadow:        0 4px 24px rgba(0,0,0,.15);
  --dd-shadow-sm:     0 2px 8px  rgba(0,0,0,.10);
  --dd-toggler-filter: none;
}

/* ── Base ────────────────────────────────────────── */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }

body {
  font-family:      'Roboto', system-ui, -apple-system, sans-serif;
  font-size:        1rem;
  font-weight:      400;
  line-height:      1.7;
  color:            var(--dd-text);
  background-color: var(--dd-bg);
  transition:       background-color 400ms ease, color 400ms ease;
  -webkit-font-smoothing:  antialiased;
  -moz-osx-font-smoothing: grayscale;
}

h1, h2, h3, h4, h5, h6 {
  font-family:   'Lora', Georgia, serif;
  font-weight:   700;
  line-height:   1.2;
  color:         var(--dd-text);
  margin-bottom: .75rem;
}

a {
  color:           var(--dd-accent);
  text-decoration: none;
  transition:      color 200ms ease;
}
a:hover, a:focus-visible {
  color:           var(--dd-accent-hover);
  text-decoration: underline;
}
a:focus-visible {
  outline:        3px solid var(--dd-cta);
  outline-offset: 3px;
  border-radius:  2px;
}

p { margin-bottom: 1rem; color: var(--dd-text); }

blockquote {
  border-left:   4px solid var(--dd-accent);
  padding:       1rem 1.5rem;
  margin:        2rem 0;
  background:    var(--dd-surface);
  border-radius: 0 4px 4px 0;
  font-style:    italic;
  color:         var(--dd-text-muted);
}

address { font-style: normal; line-height: 1.8; }
img     { max-width: 100%; height: auto; }

.skip-link {
  position:    absolute;
  top:         -100%;
  left:        1rem;
  z-index:     9999;
  padding:     .5rem 1rem;
  background:  var(--dd-cta);
  color:       #fff;
  font-weight: 700;
  border-radius: 0 0 4px 4px;
}
.skip-link:focus { top: 0; }

/* ── Layout ──────────────────────────────────────── */
.dd-section         { padding: 5rem 0; }
.dd-section--alt    { background-color: var(--dd-bg-alt); }
.dd-section--surface{ background-color: var(--dd-surface); }
.dd-section--sm     { padding: 3rem 0; }

.dd-page-header {
  padding:          3rem 0;
  background-color: var(--dd-bg-alt);
  border-bottom:    1px solid var(--dd-border);
}
.dd-page-header__eyebrow {
  font-size:      .8125rem;
  font-weight:    700;
  letter-spacing: .15em;
  text-transform: uppercase;
  color:          var(--dd-accent);
  margin-bottom:  .5rem;
}
.dd-page-header__title {
  font-size:    clamp(2rem, 5vw, 3rem);
  margin-bottom: 0;
}
.dd-page-header__subtitle {
  font-size:     1.125rem;
  color:         var(--dd-text-muted);
  margin-top:    .5rem;
  margin-bottom: 0;
}
.dd-divider {
  border:     none;
  height:     1px;
  background: var(--dd-border);
  margin:     3rem 0;
}
.dd-hashtag {
  font-family:    'Lora', Georgia, serif;
  font-size:      clamp(1.25rem,3vw,1.75rem);
  font-weight:    700;
  color:          var(--dd-accent);
  letter-spacing: .05em;
}

/* ── Navbar ──────────────────────────────────────── */
.dd-navbar {
  position:          sticky;
  top:               0;
  z-index:           1030;
  min-height:        70px;
  background-color:  var(--dd-nav-bg);
  border-bottom:     1px solid var(--dd-border);
  backdrop-filter:   blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition:        background-color 400ms ease;
}
.dd-navbar .navbar-toggler {
  color:        var(--dd-text-muted);
  border-color: var(--dd-border-strong);
  font-size:    1.375rem;
  line-height:  1;
  padding:      .375rem .5rem;
}
.dd-navbar .nav-link {
  font-size:      .9375rem;
  font-weight:    500;
  color:          var(--dd-text-muted);
  padding:        .5rem .75rem;
  border-radius:  4px;
  transition:     color 200ms ease, background-color 200ms ease;
  position:       relative;
}
.dd-navbar .nav-link::after {
  content:          '';
  position:         absolute;
  bottom:           0;
  left:             .75rem;
  right:            .75rem;
  height:           2px;
  background-color: var(--dd-accent);
  transform:        scaleX(0);
  transition:       transform 200ms ease;
  border-radius:    1px;
}
.dd-navbar .nav-link:hover,
.dd-navbar .nav-link:focus-visible {
  color:            var(--dd-text);
  background-color: var(--dd-accent-subtle);
  text-decoration:  none;
}
.dd-navbar .nav-link:hover::after,
.dd-navbar .nav-link:focus-visible::after,
.dd-navbar .nav-link.active::after { transform: scaleX(1); }
.dd-navbar .nav-link.active        { color: var(--dd-text); }

.dd-brand {
  display:        flex;
  flex-direction: column;
  line-height:    1.1;
  text-decoration: none;
}
.dd-brand:hover, .dd-brand:focus-visible { text-decoration: none; }
.dd-brand__logo-wrap {
  display: grid;
  width:   246px;
  height:  40px;
}
.dd-brand__logo {
  grid-area:  1 / 1;
  width:      246px;
  height:     40px;
  transition: opacity 200ms ease;
}
.dd-brand__logo--hover { opacity: 0; }
.dd-brand:hover .dd-brand__logo--default,
.dd-brand:focus-visible .dd-brand__logo--default { opacity: 0; }
.dd-brand:hover .dd-brand__logo--hover,
.dd-brand:focus-visible .dd-brand__logo--hover   { opacity: 1; }
.dd-brand__sub {
  padding-top: .5rem;
  font-size:      .6875rem;
  font-weight:    700;
  letter-spacing: .12em;
  text-transform: uppercase;
  color:          var(--dd-accent);
}

.dd-theme-toggle {
  display:         flex;
  align-items:     center;
  justify-content: center;
  width:           2.25rem;
  height:          2.25rem;
  padding:         0;
  border:          1px solid var(--dd-border-strong);
  border-radius:   50%;
  color:           var(--dd-text-muted);
  background:      transparent;
  transition:      color 200ms ease, border-color 200ms ease, background-color 200ms ease;
  font-size:       1rem;
}
.dd-theme-toggle:hover,
.dd-theme-toggle:focus-visible {
  color:            var(--dd-cta);
  border-color:     var(--dd-cta);
  background-color: var(--dd-accent-subtle);
  outline:          none;
  box-shadow:       0 0 0 3px rgba(212,136,26,.25);
}

/* ── Hero ────────────────────────────────────────── */
.dd-hero {
  position:        relative;
  min-height:      100svh;
  display:         flex;
  align-items:     center;
  overflow:        hidden;
  background-color: var(--dd-bg);
}
.dd-hero__video {
  position:        absolute;
  inset:           0;
  width:           100%;
  height:          100%;
  object-fit:      cover;
  object-position: center;
  z-index:         0;
}
.dd-hero__overlay {
  position:         absolute;
  inset:            0;
  background-color: var(--dd-overlay);
  z-index:          1;
}
.dd-hero__content {
  position:  relative;
  z-index:   2;
  text-align: center;
  padding:   6rem 0 4rem;
  width:     100%;
}
.dd-hero__eyebrow {
  display:        inline-block;
  font-size:      .8125rem;
  font-weight:    700;
  letter-spacing: .18em;
  text-transform: uppercase;
  color:          var(--dd-cta);
  margin-bottom:  1.25rem;
}
.dd-hero__title {
  font-family:   'Lora', Georgia, serif;
  font-size:     clamp(2.5rem, 7vw, 5rem);
  font-weight:   700;
  color:         #ffffff;
  line-height:   1.05;
  margin-bottom: 1.25rem;
  text-shadow:   0 2px 16px rgba(0,0,0,.5);
}
.dd-hero__subtitle {
  font-size:     clamp(1rem, 2.5vw, 1.375rem);
  font-weight:   400;
  color:         rgba(216,216,216,.90);
  max-width:     48rem;
  margin:        0 auto 2.5rem;
  line-height:   1.6;
}
.dd-hero__actions {
  display:         flex;
  gap:             1rem;
  justify-content: center;
  flex-wrap:       wrap;
}
.dd-hero__scroll-hint {
  position:  absolute;
  bottom:    2rem;
  left:      50%;
  transform: translateX(-50%);
  z-index:   2;
  color:     rgba(216,216,216,.5);
  font-size: 1.5rem;
  animation: dd-bounce 2s infinite;
}
@media (prefers-reduced-motion: reduce) {
  .dd-hero__scroll-hint { animation: none; }
}
@keyframes dd-bounce {
  0%, 100% { transform: translateX(-50%) translateY(0); }
  50%       { transform: translateX(-50%) translateY(8px); }
}

/* ── Cards ───────────────────────────────────────── */
.dd-card {
  background:    var(--dd-surface);
  border:        1px solid var(--dd-border);
  border-radius: 6px;
  padding:       2rem;
  box-shadow:    var(--dd-shadow-sm);
  transition:    box-shadow 200ms ease, border-color 200ms ease;
  height:        100%;
}
.dd-card:hover {
  border-color: var(--dd-border-strong);
  box-shadow:   var(--dd-shadow);
}
.dd-card__image-wrap { margin-bottom: 1.5rem; text-align: center; }
.dd-card__image {
  width:         180px;
  height:        180px;
  border-radius: 50%;
  object-fit:    cover;
  object-position: top;
  border:        3px solid var(--dd-accent);
  box-shadow:    0 0 0 4px var(--dd-accent-subtle);
}
.dd-card__name  { font-size: 1.375rem; margin-bottom: .25rem; }
.dd-card__role  {
  font-size:     .875rem;
  font-weight:   500;
  color:         var(--dd-cta);
  text-transform: uppercase;
  letter-spacing: .08em;
  margin-bottom:  1rem;
}
.dd-card__bio   { font-size: .9375rem; color: var(--dd-text-muted); line-height: 1.75; }
.dd-card__links { margin-top: 1.25rem; display: flex; flex-wrap: wrap; gap: .5rem; }

.dd-book-card { display: flex; gap: 2.5rem; align-items: flex-start; }
@media (max-width: 767.98px) {
  .dd-book-card { flex-direction: column; align-items: center; text-align: center; }
}
.dd-book-card__cover { flex-shrink: 0; width: 220px; }
.dd-book-card__cover img { border-radius: 4px; box-shadow: var(--dd-shadow); width: 100%; }
@media (max-width: 767.98px) { .dd-book-card__cover { width: 180px; } }
.dd-book-card__body  { flex: 1; }

.dd-door-list         { list-style: none; padding: 0; margin: 0; }
.dd-door-list__item   {
  display:       flex;
  align-items:   flex-start;
  gap:           .75rem;
  padding:       .625rem 0;
  border-bottom: 1px solid var(--dd-border);
  font-size:     .9375rem;
}
.dd-door-list__item:last-child { border-bottom: none; }
.dd-door-list__number {
  flex-shrink:     0;
  width:           1.75rem;
  height:          1.75rem;
  border-radius:   50%;
  background:      var(--dd-accent);
  color:           #fff;
  font-size:       .75rem;
  font-weight:     700;
  display:         flex;
  align-items:     center;
  justify-content: center;
  margin-top:      .1rem;
}
.dd-door-list__door  { font-style: italic; color: var(--dd-text-muted); font-size: .875em; }
.dd-door-list__demon { font-weight: 600; color: var(--dd-text); }

.dd-definition {
  background:    var(--dd-surface-alt);
  border-left:   4px solid var(--dd-accent);
  border-radius: 0 6px 6px 0;
  padding:       1.75rem 2rem;
  margin:        2rem 0;
}
.dd-definition__term {
  font-family:   'Lora', Georgia, serif;
  font-size:     1.5rem;
  font-weight:   700;
  color:         var(--dd-text);
  margin-bottom: .25rem;
}
.dd-definition__term em { font-style: normal; color: var(--dd-accent); }
.dd-definition__pronunciation { font-size: .875rem; color: var(--dd-text-muted); margin-bottom: 1rem; }
.dd-definition__defs {
  list-style:   decimal;
  padding-left: 1.25rem;
  margin-bottom: 1rem;
}
.dd-definition__defs li { margin-bottom: .5rem; font-size: .9375rem; }
.dd-definition__origin {
  font-size:   .8125rem;
  color:       var(--dd-text-muted);
  font-style:  italic;
  border-top:  1px solid var(--dd-border);
  padding-top: .75rem;
  margin-top:  .75rem;
}

/* ── Forms ───────────────────────────────────────── */
.dd-form__group   { margin-bottom: 1.25rem; }
.dd-form__label   {
  display:       block;
  font-size:     .875rem;
  font-weight:   600;
  color:         var(--dd-text);
  margin-bottom: .4rem;
}
.dd-form__label .required-mark { color: var(--dd-accent); margin-left: .2rem; }
.dd-form__control {
  display:          block;
  width:            100%;
  padding:          .625rem .875rem;
  font-family:      'Roboto', system-ui, sans-serif;
  font-size:        1rem;
  color:            var(--dd-text);
  background-color: var(--dd-input-bg);
  border:           1px solid var(--dd-border-strong);
  border-radius:    4px;
  transition:       border-color 200ms ease, box-shadow 200ms ease;
  -webkit-appearance: none;
  appearance:       none;
}
.dd-form__control::placeholder { color: var(--dd-text-muted); }
.dd-form__control:focus {
  outline:    none;
  border-color: var(--dd-cta);
  box-shadow: 0 0 0 3px rgba(212,136,26,.20);
}
textarea.dd-form__control { resize: vertical; min-height: 140px; }
.dd-form__hint  { font-size: .8125rem; color: var(--dd-text-muted); margin-top: .25rem; }
.dd-form__error { font-size: .8125rem; color: var(--dd-accent); margin-top: .25rem; font-weight: 500; }

.dd-form__honeypot {
  position:    absolute;
  left:        -9999px;
  top:         -9999px;
  width:       1px;
  height:      1px;
  overflow:    hidden;
  clip:        rect(0,0,0,0);
  white-space: nowrap;
  border:      0;
}

.dd-alert {
  padding:       1rem 1.25rem;
  border-radius: 4px;
  margin-bottom: 1.5rem;
  font-size:     .9375rem;
  display:       flex;
  align-items:   flex-start;
  gap:           .75rem;
}
.dd-alert--success {
  background-color: rgba(39,174,96,.15);
  border:           1px solid rgba(39,174,96,.35);
  color:            var(--dd-text);
}
.dd-alert--error {
  background-color: var(--dd-accent-subtle);
  border:           1px solid rgba(192,57,43,.35);
  color:            var(--dd-text);
}
.dd-alert i { font-size: 1.125rem; flex-shrink: 0; margin-top: .1rem; }

/* ── Buttons ─────────────────────────────────────── */
.dd-btn,
.dd-btn--primary,
.dd-btn--cta,
.dd-btn--outline,
.dd-btn--ghost {
  display:         inline-flex;
  align-items:     center;
  gap:             .5rem;
  padding:         .6875rem 1.625rem;
  font-family:     'Roboto', system-ui, sans-serif;
  font-size:       .9375rem;
  font-weight:     600;
  line-height:     1.4;
  text-align:      center;
  text-decoration: none;
  border:          2px solid transparent;
  border-radius:   4px;
  cursor:          pointer;
  transition:      background-color 200ms ease, color 200ms ease,
                   border-color 200ms ease, box-shadow 200ms ease,
                   transform 200ms ease;
  white-space:     nowrap;
}
.dd-btn--primary,
.dd-btn--cta,
.dd-btn--outline,
.dd-btn--ghost {
  &:focus-visible {
    outline:    none;
    box-shadow: 0 0 0 3px rgba(212,136,26,.4);
  }
  &:active { transform: translateY(1px); }
}

.dd-btn--primary {
  background-color: var(--dd-accent);
  border-color:     var(--dd-accent);
  color:            #ffffff;
}
.dd-btn--primary:hover,
.dd-btn--primary:focus-visible {
  background-color: var(--dd-accent-hover);
  border-color:     var(--dd-accent-hover);
  color:            #ffffff;
  text-decoration:  none;
}

.dd-btn--cta {
  background-color: var(--dd-cta);
  border-color:     var(--dd-cta);
  color:            #ffffff;
  font-size:        1.0625rem;
  padding:          .8125rem 2rem;
}
.dd-btn--cta:hover,
.dd-btn--cta:focus-visible {
  background-color: var(--dd-cta-hover);
  border-color:     var(--dd-cta-hover);
  color:            #ffffff;
  text-decoration:  none;
}

.dd-btn--outline {
  background-color: transparent;
  border-color:     var(--dd-border-strong);
  color:            var(--dd-text);
}
.dd-btn--outline:hover,
.dd-btn--outline:focus-visible {
  border-color:    var(--dd-text);
  color:           var(--dd-text);
  text-decoration: none;
}

.dd-btn--ghost {
  background-color: transparent;
  border-color:     transparent;
  color:            var(--dd-accent);
  padding-left:     0;
  padding-right:    0;
}
.dd-btn--ghost:hover,
.dd-btn--ghost:focus-visible {
  color:           var(--dd-accent-hover);
  text-decoration: underline;
}

.dd-link-badge {
  display:         inline-flex;
  align-items:     center;
  gap:             .4rem;
  padding:         .3rem .75rem;
  font-size:       .8125rem;
  font-weight:     600;
  color:           var(--dd-accent);
  border:          1px solid var(--dd-accent-subtle);
  border-radius:   20px;
  text-decoration: none;
  transition:      background-color 200ms ease, color 200ms ease;
}
.dd-link-badge:hover,
.dd-link-badge:focus-visible {
  background-color: var(--dd-accent-subtle);
  color:            var(--dd-accent-hover);
  text-decoration:  none;
}

/* ── Utilities ───────────────────────────────────── */
.text-accent   { color: var(--dd-accent) !important; }
.text-cta      { color: var(--dd-cta) !important; }
.text-muted-dd { color: var(--dd-text-muted) !important; }

.dd-section-heading {
  font-size:     clamp(1.75rem, 4vw, 2.5rem);
  color:         var(--dd-text);
  margin-bottom: .5rem;
}
.dd-section-heading span { color: var(--dd-accent); }

.dd-section-subheading {
  font-size:   1.0625rem;
  color:       var(--dd-text-muted);
  max-width:   36rem;
  line-height: 1.65;
}

.dd-eyebrow {
  display:        inline-block;
  font-size:      .75rem;
  font-weight:    700;
  letter-spacing: .15em;
  text-transform: uppercase;
  color:          var(--dd-accent);
  margin-bottom:  .6rem;
}

.dd-rule {
  display:       block;
  width:         3rem;
  height:        3px;
  background:    var(--dd-accent);
  border:        none;
  margin:        1rem 0 1.75rem;
  border-radius: 2px;
}
.dd-rule--center { margin-left: auto; margin-right: auto; }

.dd-testimonials-placeholder {
  text-align: center;
  padding:    3rem 1rem;
  color:      var(--dd-text-muted);
  font-style: italic;
}
.dd-testimonials-placeholder i {
  font-size:     2.5rem;
  display:       block;
  margin-bottom: 1rem;
  color:         var(--dd-border-strong);
}

.dd-contact-info__item {
  display:       flex;
  align-items:   flex-start;
  gap:           .75rem;
  margin-bottom: 1rem;
}
.dd-contact-info__icon {
  flex-shrink: 0;
  font-size:   1.125rem;
  color:       var(--dd-accent);
  margin-top:  .15rem;
}
.dd-contact-info__text {
  font-size:   .9375rem;
  line-height: 1.6;
  color:       var(--dd-text);
}
.dd-contact-info__text a        { color: var(--dd-text); }
.dd-contact-info__text a:hover  { color: var(--dd-accent); }

/* ── Footer ──────────────────────────────────────── */
.dd-footer {
  background-color: var(--dd-bg-alt);
  border-top:       1px solid var(--dd-border);
  padding:          4rem 0 2rem;
  margin-top:       auto;
}
.dd-footer__brand {
  font-family:   'Lora', Georgia, serif;
  font-size:     1.25rem;
  font-weight:   700;
  color:         var(--dd-text);
  margin-bottom: .4rem;
}
.dd-footer__tagline { font-size: .9375rem; color: var(--dd-text-muted); line-height: 1.6; }
.dd-footer__heading {
  font-size:     .875rem;
  font-weight:   700;
  letter-spacing: .1em;
  text-transform: uppercase;
  color:          var(--dd-text-muted);
  margin-bottom:  .75rem;
}
.dd-footer__address { font-size: .9375rem; }
.dd-footer__address a { color: var(--dd-text-muted); }
.dd-footer__address a:hover { color: var(--dd-accent); }
.dd-footer__nav li { margin-bottom: .35rem; }
.dd-footer__nav a  { font-size: .9375rem; color: var(--dd-text-muted); }
.dd-footer__nav a:hover { color: var(--dd-accent); text-decoration: none; }
.dd-footer__bottom {
  border-top:  1px solid var(--dd-border);
  margin-top:  2.5rem;
  padding-top: 1.5rem;
  display:     flex;
  flex-wrap:   wrap;
  gap:         .75rem;
  align-items: center;
  justify-content: space-between;
}
.dd-footer__copy    { font-size: .8125rem; color: var(--dd-text-muted); margin: 0; }
.dd-footer__privacy { font-size: .8125rem; color: var(--dd-text-muted); margin: 0; }
.dd-footer__privacy-link { color: var(--dd-accent); }
