@charset "UTF-8";
/*-----------------------------------*\
		BASE
\*-----------------------------------*/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  display: block;
}

html {
  min-height: 100vh;
}

body {
  line-height: 1;
  margin: 0;
  padding: 0;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
}

ol, ul {
  list-style: none;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after, q:before, q:after {
  content: "";
  content: none;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

*, *:before, *:after {
  margin: 0;
  padding: 0;
  position: relative;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}

.content {
  width: 1200px;
  margin: auto;
  display: block;
}
@media screen and (max-width: 1200px) {
  .content {
    width: 100%;
  }
}

input {
  -webkit-appearance: none;
  border-radius: 0;
}

input:focus, select:focus, textarea:focus, button:focus {
  outline: none;
}

body, html {
  height: 100%;
  font-family: regular;
}

a {
  text-decoration: none;
}

.shake {
  animation: shake 150ms 2 linear;
  -moz-animation: shake 150ms 2 linear;
  -webkit-animation: shake 150ms 2 linear;
  -o-animation: shake 150ms 2 linear;
}

@keyframes shake {
  0% {
    transform: translate(10px, 0);
  }
  50% {
    transform: translate(-10px, 0);
  }
  100% {
    transform: translate(0, 0);
  }
}
@-moz-keyframes shake {
  0% {
    -moz-transform: translate(10px, 0);
  }
  50% {
    -moz-transform: translate(-10px, 0);
  }
  100% {
    -moz-transform: translate(0, 0);
  }
}
@-webkit-keyframes shake {
  0% {
    -webkit-transform: translate(10px, 0);
  }
  50% {
    -webkit-transform: translate(-10px, 0);
  }
  100% {
    -webkit-transform: translate(0, 0);
  }
}
@-ms-keyframes shake {
  0% {
    -ms-transform: translate(10px, 0);
  }
  50% {
    -ms-transform: translate(-10px, 0);
  }
  100% {
    -ms-transform: translate(0, 0);
  }
}
@-o-keyframes shake {
  0% {
    -o-transform: translate(10px, 0);
  }
  50% {
    -o-transform: translate(-10px, 0);
  }
  100% {
    -o-transform: translate(0, 0);
  }
}
/*-----------------------------------*\
		$_FONTS
	Placeholder font-face declarations. The `xxx*.woff` file paths are
	intentional "replace me" markers — the boilerplate ships with no real
	brand font. Pick one per-project via `teach` mode (see
	.claude/skills/front-end-design/), then either:
	  - Drop the actual .woff/.woff2 files into develop/assets/fonts/ using
	    the filenames below, OR
	  - Rename the families here (e.g. `$font-display`, `$font-body`) and
	    update consumers accordingly.

	DO NOT use any of these reflex-reject fonts (per the master skill):
	Inter, Roboto, Open Sans, Lato, Montserrat, Outfit, Fraunces,
	Newsreader, Lora, Crimson, Playfair Display, Cormorant, Syne,
	IBM Plex, Space Mono, Space Grotesk, DM Sans, DM Serif, Plus Jakarta
	Sans, Instrument Sans, Instrument Serif.

	See .claude/skills/static-site-implementation/reference/typography-in-scss.md
	for a vetted starter shortlist (all clear the reject list).
\*-----------------------------------*/
@font-face {
  font-family: "regular";
  src: url("../assets/fonts/xxx.woff") format("woff");
}
@font-face {
  font-family: "bold";
  src: url("../assets/fonts/xxx-bold.woff") format("woff");
}
@font-face {
  font-family: "headline";
  src: url("../assets/fonts/xxx-webfont.woff") format("woff");
}
body {
  -webkit-font-smoothing: antialiased;
}

.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.home {
  position: fixed;
  inset: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2rem 1.5rem 3rem;
  color: #fff;
  background: linear-gradient(130deg, #0f1a3a, #2a1757, #3d1e4a, #1a2a5c, #0b1e3f, #2d1b4e);
  background-size: 400% 400%;
  animation: home-gradient 28s ease-in-out infinite;
}
.home::before {
  content: "";
  position: absolute;
  inset: -20%;
  background: radial-gradient(circle at 30% 20%, rgba(255, 255, 255, 0.08), transparent 55%), radial-gradient(circle at 75% 80%, rgba(180, 150, 255, 0.1), transparent 50%);
  pointer-events: none;
}

.home__stage {
  position: relative;
  width: 100%;
  max-width: 1100px;
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.home__line {
  position: absolute;
  left: 0;
  right: 0;
  margin: 0 auto;
  padding: 0 0.5rem;
  font-family: "Spectral", Georgia, "Times New Roman", serif;
  font-weight: 300;
  font-style: italic;
  letter-spacing: 0.01em;
  line-height: 1.15;
  font-size: clamp(2.25rem, 8vw, 6rem);
  color: #fff;
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 1.2s ease, transform 1.4s ease;
  text-shadow: 0 2px 30px rgba(0, 0, 0, 0.25);
}
.home__line.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.home__footer {
  position: relative;
  margin: 0;
  padding-top: 2rem;
  font-family: "Work Sans", system-ui, -apple-system, sans-serif;
  font-weight: 400;
  font-size: 0.75rem;
  letter-spacing: 0.35em;
  text-transform: uppercase;
  color: rgba(255, 255, 255, 0.7);
  opacity: 0;
  transition: opacity 1.2s ease;
}
.home__footer.is-visible {
  opacity: 1;
}

@keyframes home-gradient {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}
@media (max-width: 600px) {
  .home {
    padding: 1.5rem 1.25rem 2rem;
  }
  .home__line {
    font-size: clamp(2rem, 9vw, 3.5rem);
    line-height: 1.2;
  }
  .home__footer {
    font-size: 0.7rem;
    letter-spacing: 0.3em;
  }
}
@media (prefers-reduced-motion: reduce) {
  .home {
    animation: none;
  }
  .home__line,
  .home__footer {
    transition: opacity 0.4s ease;
    transform: none;
  }
}
/*# sourceMappingURL=style.css.map */
