/* September 13: a restrained refinement of the existing Signal identity. */
:root {
  --fg-dim: #a09e9a;
  --fg-dimmer: #85827d;
  --border: rgba(240,237,232,.10);
  --border-2: rgba(240,237,232,.21);
}
html { scroll-padding-top: 96px; }
#grain { opacity: .019; animation: none; }
#nav { padding-top: 1.65rem; padding-bottom: 1.65rem; }
#nav.scrolled {
  background: rgba(8,8,8,.89);
  border-bottom-color: rgba(240,237,232,.09);
  backdrop-filter: blur(18px);
}
#hero {
  min-height: max(620px, calc(100svh - 100px));
  padding: 8rem 0 2.5rem;
}
.hero-brand { font-size: 1rem; color: #bbb4a9; }
.hero-brand-rule { background: var(--accent); opacity: .45; margin-bottom: 1.9rem; }
.hero-headline { font-size: 7rem; line-height: .98; letter-spacing: 0; margin-bottom: 1.7rem; }
.hero-headline em { color: #d0c8bb; }
.hero-line { display: block; overflow: clip; padding-bottom: .13em; margin-bottom: -.13em; }
.hero-line > * { display: block; }
.hero-sub { font-size: 1rem; line-height: 1.85; max-width: 510px; margin: 0 auto 2.25rem; color: #aaa7a2; }
.hero-scroll-indicator { margin-top: 2.4rem; gap: .65rem; }
.scroll-line { height: 28px; }
.hero-inner .hero-headline.reveal { filter: none; transform: none; }
.hero-headline.reveal .hero-line > * {
  transform: translateY(112%);
  transition: transform 1.65s cubic-bezier(.16,1,.3,1);
  transition-delay: .15s;
}
.hero-headline.reveal .hero-line:nth-child(2) > * { transition-delay: .31s; }
.hero-headline.reveal.in-view .hero-line > * { transform: translateY(0); }
.section-headline { font-size: 4.4rem; letter-spacing: 0; text-wrap: balance; }
.section-sub, .engines-desc, .bd-cap-body, .pillar-desc { text-wrap: pretty; }
#engines { padding-top: 3.25rem; padding-bottom: 7rem; }
.engines-intro.reveal { opacity: 1; transform: none; }
.engines-lead { font-size: 1.7rem; letter-spacing: 0; }
.engines-grid { gap: 0 2rem; }
.engines-col { padding: 0 1rem; }
.engines-name { font-size: 2.3rem; letter-spacing: 0; }
.engines-num, .pillar-num, .bd-cap-num { color: #b7a180; }
.engines-desc { font-size: .92rem; }
.pillar-desc, .bd-cap-body { font-size: .86rem; }
.engines-line { background: rgba(201,169,110,.17); }
.engines-name, .pillar-name, .bd-cap-title {
  transition: color .45s ease;
}
.engines-col:hover .engines-name,
.pillar:hover .pillar-name,
.bd-cap:hover .bd-cap-title { color: #d6be97; }
.engines-col .pillar-spark { opacity: .7; }
.section-headline.reveal { filter: none; }
.reveal { transition-timing-function: cubic-bezier(.16,1,.3,1); }
.section-divider { background: rgba(201,169,110,.15); }
.btn-primary {
  min-height: 52px;
  border: 1px solid #e4ded4;
  background: #e4ded4;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.75), 0 3px 18px rgba(0,0,0,.15);
  transition: background .4s ease, border-color .4s ease, box-shadow .4s ease;
}
.btn-primary:hover {
  background: #f5f0e7;
  border-color: #f5f0e7;
  box-shadow: inset 0 1px 0 #fff, 0 6px 28px rgba(201,169,110,.10);
}
.nav-cta { min-height: 42px; display: inline-flex; align-items: center; }
.nav-cta:hover { border-color: #b7a180; color: #e4d3b6; }
.handle-list li { transition: color .4s ease, padding-left .5s cubic-bezier(.16,1,.3,1); }
.handle-list li:hover { padding-left: 1.9rem; }
.contact-form { max-width: 480px; gap: 1.1rem; }
.form-input {
  min-height: 56px;
  font-size: 1rem;
  font-weight: 400;
  background: rgba(255,255,255,.022);
  border-color: rgba(240,237,232,.18);
  border-radius: 0;
  transition: border-color .4s ease, background .4s ease, box-shadow .4s ease;
}
.form-input::placeholder { color: #a09b92; letter-spacing: 0; }
.form-input:focus {
  border-color: #bca37d;
  background: rgba(201,169,110,.035);
  box-shadow: inset 2px 0 #bca37d;
}
.contact-note { color: #a09b92; }
#form-success { color: #d6be97 !important; }
@media (min-width: 1600px) {
  .hero-headline { font-size: 8rem; }
}
@media (max-width: 1100px) {
  .hero-headline { font-size: 6rem; }
  .section-headline { font-size: 3.6rem; }
  .engines-grid { gap: 0 1.25rem; }
  .engines-col { padding: 0 .5rem; }
  .engines-name { font-size: 2rem; }
  .pillar { padding: 2rem 1.25rem; }
}
@media (max-width: 768px) {
  #hero { min-height: max(610px, calc(100svh - 88px)); padding: 7rem 0 2.4rem; }
  #nav { padding: 1.2rem 1.5rem; }
  .hero-brand { font-size: .86rem; }
  .hero-headline { font-size: 5rem; }
  .section-headline { font-size: 3.2rem; }
  .hero-sub { max-width: 420px; font-size: .95rem; }
  #engines { padding-top: 2.6rem; }
  .engines-col { padding: 0; }
  .engines-name { font-size: 2.4rem; }
  .engines-lead { font-size: 1.55rem; }
  .engines-line { margin: 2.5rem 0; }
}
@media (max-width: 500px) {
  .hero-headline { font-size: 4.1rem; }
  .hero-brand { font-size: .8rem; }
  .hero-sub { max-width: 340px; }
  .section-headline { font-size: 2.75rem; }
  .hero-scroll-indicator { margin-top: 2rem; }
  .engines-lead { font-size: 1.45rem; }
  .bd-cap-title { font-size: 1.4rem; }
  .pillar-desc, .bd-cap-body { font-size: .9rem; }
}
@media (max-width: 360px) {
  .hero-headline { font-size: 3.5rem; }
  .hero-brand { font-size: .72rem; }
  .section-headline { font-size: 2.35rem; }
  #nav { padding-left: 1rem; padding-right: 1rem; }
}
@media (min-width: 769px) and (max-height: 800px) {
  #hero { padding-top: 6.25rem; padding-bottom: 1.5rem; }
  .hero-headline { font-size: 6.25rem; margin-bottom: 1.3rem; }
  .hero-brand { margin-bottom: 1rem; }
  .hero-brand-rule { margin-bottom: 1.35rem; }
  .hero-sub { margin-bottom: 1.6rem; }
  .hero-scroll-indicator { margin-top: 1.5rem; }
}
@media (prefers-reduced-motion: reduce) {
  .hero-headline.reveal .hero-line > * { transform: none; transition: none; }
  .handle-list li:hover { padding-left: 1.5rem; }
}
