/* etiver.com front page: green field, white wordmark, one button. Other pages use site.css. */
@font-face { font-family: "Jost"; font-weight: 600; font-display: swap; src: url("/fonts/jost-latin-600-normal.woff2") format("woff2"); }
@font-face { font-family: "Jost"; font-weight: 700; font-display: swap; src: url("/fonts/jost-latin-700-normal.woff2") format("woff2"); }

:root { --green: #1b6139; --green-deep: #134a2a; --white: #ffffff; }
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; background: var(--green); }
body { font-family: "Jost", "Futura", "Century Gothic", "Helvetica Neue", Arial, sans-serif; -webkit-font-smoothing: antialiased; }

.splash {
  min-height: 100vh; min-height: 100svh; width: 100%;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: clamp(36px, 6vh, 56px); padding: 24px 16px;
  padding-bottom: max(24px, env(safe-area-inset-bottom));
}

.logo {
  margin: 0; color: var(--white); display: flex; align-items: center;
  gap: clamp(14px, 2.4vw, 22px);
  font: 700 clamp(40px, 9vw, 88px)/1 "Jost", "Futura", "Century Gothic", Arial, sans-serif;
  letter-spacing: .24em; margin-right: -.24em;   /* keep the tracked word optically centered */
}
.logo i { display: inline-block; width: .8em; height: .8em; background: var(--white); flex: none; }

.start {
  position: relative; overflow: hidden; isolation: isolate;
  display: inline-flex; align-items: center; gap: 6px;
  background: transparent; color: var(--white);
  font: 600 17px/1 "Jost", "Futura", Arial, sans-serif; letter-spacing: .02em;
  text-decoration: none; padding: 18px 30px 18px 34px; border: 1.5px solid var(--white);
  transition: color .3s cubic-bezier(.2, .7, .2, 1);
}
/* white fill sweeps in from the left; the text reverses to green */
.start::before {
  content: ""; position: absolute; inset: 0; z-index: -1; background: var(--white);
  transform: scaleX(0); transform-origin: left center;
  transition: transform .3s cubic-bezier(.2, .7, .2, 1);
}
.start .arr { display: inline-block; font-size: 18px; transition: transform .3s cubic-bezier(.2, .7, .2, 1); }
.start:hover, .start:focus-visible { color: var(--green); }
.start:hover::before, .start:focus-visible::before { transform: scaleX(1); }
.start:hover .arr, .start:focus-visible .arr { transform: translateX(4px); }
.start:focus-visible { outline: 2px solid var(--white); outline-offset: 4px; }

@media (prefers-reduced-motion: reduce) { .start, .start::before, .start .arr { transition: none; } }