:root {
  --landing-bg: #f6f1e5;
  --landing-text: #17221e;
  --landing-line: #9c7a32;
  --landing-accent-one: #e5ad38;
  --landing-accent-two: #7f9b67;
  --landing-status: #2f8a57;
}

* { box-sizing: border-box; }
html { min-height: 100%; background: var(--landing-bg); }
body { min-height: 100%; margin: 0; background: var(--landing-bg); color: var(--landing-text); font: 16px/1.5 system-ui, -apple-system, "Segoe UI", sans-serif; }
a { color: inherit; text-underline-offset: 4px; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline: 3px solid var(--landing-accent-one); outline-offset: 4px; }

.landing-home { min-height: 100dvh; overflow-x: hidden; position: relative; }
.landing-flash { position: fixed; z-index: 110; top: 18px; left: 50%; width: min(560px, calc(100% - 36px)); transform: translateX(-50%); padding: 12px 16px; border: 1px solid var(--landing-status); border-radius: 10px; background: var(--landing-bg); box-shadow: 0 12px 35px color-mix(in srgb, var(--landing-text) 12%, transparent); text-align: center; font-size: .85rem; }
.landing-flash.warning { border-color: var(--landing-accent-one); }
.landing-flash.error { border-color: #a64a3f; }
.landing-hero { min-height: 70dvh; display: grid; place-items: center; position: relative; isolation: isolate; padding: 80px 24px 28px; }
.landing-honeycomb { position: absolute; inset: -6vh -4vw -11vh; z-index: -1; pointer-events: none; opacity: var(--landing-pattern-opacity, .76); -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 7%, #000 76%, transparent 100%); mask-image: linear-gradient(to bottom, transparent 0, #000 7%, #000 76%, transparent 100%); }
.landing-honeycomb svg { width: 100%; height: 100%; overflow: visible; }
.landing-hex { fill: transparent; stroke: var(--landing-line); stroke-width: 1.15; opacity: 0; transform-box: fill-box; transform-origin: center; animation: landing-grow var(--hex-duration, 1.4s) var(--arrival) cubic-bezier(.2,.8,.2,1) forwards; }
.landing-hex.fill-one { fill: var(--landing-accent-one); fill-opacity: .36; }
.landing-hex.fill-two { fill: var(--landing-accent-two); fill-opacity: .3; }
.landing-hex-number { fill: var(--landing-text); opacity: 0; font: 650 13px/1 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: -.04em; animation: landing-number var(--number-duration, 1s) var(--arrival) ease forwards; }
.landing-honeycomb.is-complete .landing-hex { animation: none; opacity: .63; transform: scale(1); transition: opacity .18s ease, transform .18s ease, stroke-width .18s ease; }
.landing-honeycomb.is-complete .landing-hex-number { animation: none; opacity: .64; transform: none; }
.landing-honeycomb.is-complete .landing-hex.is-hovered { opacity: .9; transform: scale(1.075); stroke-width: 1.5; }
@keyframes landing-grow { from { opacity: 0; transform: scale(.2); } to { opacity: .63; transform: scale(1); } }
@keyframes landing-number { from { opacity: 0; transform: translateY(5px); } to { opacity: .64; transform: none; } }
@keyframes landing-copy { from { opacity: 0; transform: translateY(9px); } to { opacity: 1; transform: none; } }

.landing-center { width: min(960px, 94vw); text-align: center; }
.landing-hero.hero-left .landing-center { justify-self: start; text-align: left; }
.landing-hero.hero-right .landing-center { justify-self: end; text-align: right; }
.landing-hero.hero-left .landing-tagline { margin-left: 0; }
.landing-hero.hero-right .landing-tagline { margin-right: 0; }
.landing-hero.hero-high .landing-center { transform: translateY(-6vh); }
.landing-hero.hero-low .landing-center { transform: translateY(6vh); }
.landing-center h1 { margin: 0; opacity: 1; font: 700 clamp(4.5rem, 12vw, 10rem)/.84 Georgia, "Times New Roman", serif; letter-spacing: -.075em; text-transform: lowercase; text-wrap: balance; }
.landing-js .landing-center h1 { opacity: 0; }
.landing-home.is-title-visible .landing-center h1 { animation: landing-copy .9s ease forwards; }
.landing-count { margin: 11px 0 0; opacity: 1; font-size: clamp(1rem, 2.2vw, 1.45rem); font-weight: 720; letter-spacing: -.025em; }
.landing-js .landing-count { opacity: 0; }
.landing-home.is-count-visible .landing-count { animation: landing-copy .8s ease forwards; }
.landing-count-label { font-weight: 470; }
.landing-count-short { display: none; }
.landing-tagline { margin: 11px auto 0; max-width: 620px; opacity: 1; color: color-mix(in srgb, var(--landing-text) 73%, transparent); font-size: clamp(.92rem, 1.7vw, 1.08rem); }
.landing-js .landing-tagline { opacity: 0; }
.landing-home.is-support-visible .landing-tagline { animation: landing-copy .8s ease forwards; }
.landing-center h1 + .landing-count, .landing-center h1 + .landing-tagline { margin-top: 34px; }

.landing-lower { position: relative; z-index: 1; padding-top: 8px; background: linear-gradient(to bottom, color-mix(in srgb, var(--landing-bg) 20%, transparent), var(--landing-bg) 120px); }
.landing-projects { width: min(1040px, calc(100% - 40px)); margin: 0 auto; padding: 12px 0 28px; opacity: 1; text-align: center; }
.landing-js .landing-projects { opacity: 0; }
.landing-home.is-support-visible .landing-projects { animation: landing-copy .85s ease forwards; }
.landing-projects h2 { margin: 0 0 16px; color: color-mix(in srgb, var(--landing-text) 56%, transparent); font-size: .7rem; letter-spacing: .19em; text-transform: uppercase; }
.landing-projects ul { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 14px 24px; margin: 0 auto; padding: 0; list-style: none; }
.landing-projects li { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-width: 0; font: 650 .94rem/1.2 ui-monospace, SFMono-Regular, Menlo, monospace; overflow-wrap: anywhere; }
.landing-projects li > span:last-child { max-width: min(420px, calc(100vw - 90px)); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.landing-projects ul.is-rotating { display: block; position: relative; width: min(520px, 100%); height: 24px; }
.landing-projects ul.is-rotating li { position: absolute; inset: 0; opacity: 0; transform: translateY(5px); transition: opacity .65s ease, transform .65s ease; }
.landing-projects ul.is-rotating li.is-active { opacity: 1; transform: none; }
.landing-lower.lower-left .landing-projects { text-align: left; }
.landing-lower.lower-right .landing-projects { text-align: right; }
.landing-lower.lower-left .landing-projects ul.is-rotating li { justify-content: flex-start; }
.landing-lower.lower-right .landing-projects ul.is-rotating li { justify-content: flex-end; }
.landing-lower.lower-left .landing-projects ul.is-rotating { margin-left: 0; }
.landing-lower.lower-right .landing-projects ul.is-rotating { margin-right: 0; }
.landing-status { display: inline-grid; place-items: center; width: 19px; height: 19px; border: 1px solid currentColor; border-radius: 50%; color: #8a8e88; font: 800 12px/1 system-ui, sans-serif; }
.landing-status.good { border-color: var(--landing-status); background: var(--landing-status); color: var(--landing-bg); }
.landing-status.issue, .landing-status.offline { color: #a64a3f; }
.landing-status.pending { color: #8a792d; }
.landing-project-empty { color: color-mix(in srgb, var(--landing-text) 55%, transparent); }

.landing-actions { width: min(1040px, calc(100% - 40px)); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 11px; margin: 0 auto; padding: 12px 0 22px; opacity: 1; font-size: .82rem; }
.landing-js .landing-actions { opacity: 0; }
.landing-home.is-support-visible .landing-actions { animation: landing-copy .85s ease forwards; }
.landing-public-actions { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 12px 22px; }
.landing-private-actions { min-height: 20px; display: flex; align-items: center; justify-content: center; }
.landing-lower.lower-left .landing-actions { align-items: flex-start; }
.landing-lower.lower-right .landing-actions { align-items: flex-end; }
.landing-lower.lower-left .landing-public-actions, .landing-lower.lower-left .landing-private-actions { justify-content: flex-start; }
.landing-lower.lower-right .landing-public-actions, .landing-lower.lower-right .landing-private-actions { justify-content: flex-end; }
.landing-actions a { text-decoration: none; }
.landing-actions a:not(.landing-contact-button):hover { text-decoration: underline; }
.landing-contact-button, .landing-contact-form button { display: inline-flex; justify-content: center; align-items: center; min-height: 42px; padding: 0 22px; border: 1px solid var(--landing-text); border-radius: 999px; background: var(--landing-text); color: var(--landing-bg); font-weight: 750; text-decoration: none; }
.landing-account { opacity: .68; }
.landing-owner-access { position: relative; }
.landing-owner-access summary { cursor: pointer; list-style: none; opacity: .68; }
.landing-owner-access summary::-webkit-details-marker { display: none; }
.landing-owner-access[open] summary { opacity: 1; }
.landing-login { display: flex; align-items: center; gap: 6px; }
.landing-owner-access .landing-login { position: absolute; left: 50%; bottom: calc(100% + 12px); width: 255px; padding: 10px; border: 1px solid color-mix(in srgb, var(--landing-text) 18%, transparent); border-radius: 999px; background: var(--landing-bg); box-shadow: 0 12px 34px color-mix(in srgb, var(--landing-text) 13%, transparent); transform: translateX(-50%); }
.landing-login input[type="email"] { width: 130px; padding: 7px 10px; border: 1px solid color-mix(in srgb, var(--landing-text) 28%, transparent); border-radius: 999px; background: transparent; color: var(--landing-text); font: inherit; font-size: .75rem; }
.landing-owner-access .landing-login input[type="email"] { flex: 1; min-width: 0; width: auto; }
.landing-login button { padding: 7px 3px; border: 0; background: transparent; color: var(--landing-text); font: inherit; font-size: .78rem; cursor: pointer; }
.landing-login button:hover { text-decoration: underline; }
.landing-footer { width: min(1040px, calc(100% - 40px)); margin: 0 auto; padding: 5px 0 30px; opacity: 1; color: color-mix(in srgb, var(--landing-text) 45%, transparent); text-align: center; font-size: .7rem; letter-spacing: .035em; }
.landing-lower.lower-left .landing-footer { text-align: left; }
.landing-lower.lower-right .landing-footer { text-align: right; }
.landing-js .landing-footer { opacity: 0; }
.landing-home.is-support-visible .landing-footer { animation: landing-copy .85s ease forwards; }

.landing-page { width: min(760px, calc(100% - 40px)); margin: 0 auto; padding: 42px 0 90px; }
.landing-back { font-weight: 720; text-decoration: none; }
.landing-page section, .landing-page article { margin-top: clamp(70px, 12vh, 130px); }
.landing-kicker { margin: 0 0 12px; color: var(--landing-line); font-size: .73rem; font-weight: 800; letter-spacing: .17em; text-transform: uppercase; }
.landing-page h1 { margin: 0 0 18px; font: 700 clamp(3.4rem, 9vw, 6.5rem)/.9 Georgia, "Times New Roman", serif; letter-spacing: -.06em; }
.landing-page section > p, .landing-terms { max-width: 650px; color: color-mix(in srgb, var(--landing-text) 76%, transparent); font-size: 1.05rem; line-height: 1.75; }
.landing-terms p { margin: 0 0 1.15em; }
.landing-contact-form { display: grid; gap: 17px; margin-top: 36px; padding: clamp(22px, 5vw, 38px); border: 1px solid color-mix(in srgb, var(--landing-line) 48%, transparent); border-radius: 18px; background: color-mix(in srgb, var(--landing-bg) 88%, white); }
.landing-contact-form label { display: grid; gap: 7px; font-size: .82rem; font-weight: 760; }
.landing-contact-form input, .landing-contact-form select, .landing-contact-form textarea { width: 100%; padding: 12px 13px; border: 1px solid color-mix(in srgb, var(--landing-text) 30%, transparent); border-radius: 9px; background: var(--landing-bg); color: var(--landing-text); font: inherit; }
.landing-contact-form button { width: max-content; border: 0; cursor: pointer; }
.landing-trap { position: absolute !important; left: -10000px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.landing-notice { margin: 22px 0; padding: 13px 15px; border-left: 4px solid var(--landing-status); background: color-mix(in srgb, var(--landing-status) 10%, var(--landing-bg)); }
.landing-notice.error { border-color: #a64a3f; }

body.landing-overlay-open { overflow: hidden; }
.landing-overlay[hidden] { display: none; }
.landing-overlay { position: fixed; inset: 0; z-index: 100; display: grid; place-items: center; padding: 24px; }
.landing-overlay-backdrop { position: absolute; inset: 0; width: 100%; border: 0; background: color-mix(in srgb, var(--landing-text) 30%, transparent); opacity: 0; cursor: default; -webkit-backdrop-filter: blur(7px); backdrop-filter: blur(7px); transition: opacity .28s ease; }
.landing-overlay-panel { position: relative; width: min(720px, 100%); max-height: min(820px, calc(100dvh - 48px)); overflow: auto; padding: clamp(28px, 5vw, 54px); border: 1px solid color-mix(in srgb, var(--landing-line) 38%, transparent); border-radius: 22px; background: var(--landing-bg); box-shadow: 0 28px 90px color-mix(in srgb, var(--landing-text) 24%, transparent); opacity: 0; transform: translateY(18px) scale(.985); transition: opacity .28s ease, transform .28s ease; }
.landing-overlay.is-open .landing-overlay-backdrop { opacity: 1; }
.landing-overlay.is-open .landing-overlay-panel { opacity: 1; transform: none; }
.landing-overlay-close { position: absolute; top: 14px; right: 16px; display: grid; place-items: center; width: 38px; height: 38px; border: 0; border-radius: 50%; background: transparent; color: var(--landing-text); font: 300 1.75rem/1 system-ui, sans-serif; cursor: pointer; }
.landing-overlay-close:hover { background: color-mix(in srgb, var(--landing-text) 7%, transparent); }
.landing-overlay-content .landing-kicker { margin-top: 0; }
.landing-overlay-content h1 { max-width: 600px; margin: 0 40px 18px 0; font: 700 clamp(2.7rem, 7vw, 5.2rem)/.92 Georgia, "Times New Roman", serif; letter-spacing: -.055em; }
.landing-overlay-content > p:not(.landing-kicker) { max-width: 610px; color: color-mix(in srgb, var(--landing-text) 76%, transparent); font-size: 1.02rem; line-height: 1.7; }
.landing-overlay-content .landing-terms { max-width: 640px; }
.landing-overlay-content .landing-contact-form { margin-top: 28px; }

@media (max-width: 680px) {
  .landing-hero { min-height: 64svh; padding: 52px 16px 18px; }
  .landing-honeycomb { inset: -4vh -42vw -8vh; opacity: .58; -webkit-mask-image: linear-gradient(to bottom, transparent 0, #000 5%, #000 73%, transparent 100%); mask-image: linear-gradient(to bottom, transparent 0, #000 5%, #000 73%, transparent 100%); }
  .landing-center { width: calc(100vw - 32px); }
  .landing-center h1 { font-size: clamp(3.1rem, 16vw, 4.65rem); letter-spacing: -.07em; }
  .landing-center h1 + .landing-count, .landing-center h1 + .landing-tagline { margin-top: 27px; }
  .landing-hero.hero-high .landing-center { transform: translateY(-3vh); }
  .landing-hero.hero-low .landing-center { transform: translateY(3vh); }
  .landing-count-full { display: none; }
  .landing-count-short { display: inline; }
  .landing-lower { padding-top: 0; }
  .landing-projects { padding-top: 4px; }
  .landing-actions { padding-bottom: 20px; }
  .landing-owner-access .landing-login { width: min(285px, calc(100vw - 32px)); }
  .landing-footer { padding-bottom: 28px; }
  .landing-overlay { align-items: end; padding: 0; }
  .landing-overlay-panel { width: 100%; max-height: 91dvh; padding: 34px 22px max(30px, env(safe-area-inset-bottom)); border-width: 1px 0 0; border-radius: 22px 22px 0 0; transform: translateY(24px); }
  .landing-overlay-content h1 { margin-right: 38px; font-size: clamp(2.55rem, 13vw, 4.1rem); }
  .landing-overlay-content .landing-contact-form { padding: 20px; }
}

@media (prefers-reduced-motion: reduce) {
  .landing-hex, .landing-hex-number { animation: none; opacity: .62; }
  .landing-js .landing-center h1, .landing-js .landing-count, .landing-js .landing-tagline, .landing-js .landing-projects, .landing-js .landing-actions, .landing-js .landing-footer { animation: none; opacity: 1; }
  .landing-honeycomb.is-complete .landing-hex { transition: none; }
  .landing-projects ul.is-rotating li { transition: none; }
  .landing-overlay-backdrop, .landing-overlay-panel { transition: none; }
}
