/* ============================================================================
     Eastall Software Systems Stylesheets | Coming soon
     Version: 1.0.0 2026
     Author: Eastall Software Systems / Kaedyn Eastall

     The placeholder served on newly created domains on the Plesk server.
     Standalone page (no shared header/footer include), so it loads the base
     stylesheet plus this one straight from the CDN.
============================================================================ */

:root                     { --dot:rgba(255,255,255,.05); --grad-sep:#ffffff; }
:root[data-theme="light"] { --dot:rgba(0,0,0,.05);       --grad-sep:#0e1116; }

/* Gradient heading accent (blue, red, yellow; neutral flips per theme). */
.grad-text{
  background:linear-gradient(95deg,
    var(--grad-sep) 0%, var(--ess-blue) 16.67%, var(--grad-sep) 33.33%,
    var(--ess-red) 50%, var(--grad-sep) 66.67%, var(--ess-yellow) 83.33%, var(--grad-sep) 100%);
  -webkit-background-clip:text; background-clip:text; color:transparent; -webkit-text-fill-color:transparent;
}

/* ── Page shell ─────────────────────────────────────────────────────────── */
.cs-main{
  flex:1 1 auto; display:grid; place-items:center;
  padding:clamp(40px,8vw,92px) 24px;
  background:radial-gradient(var(--dot) 1px, transparent 1.7px) 0 0 / 24px 24px, var(--bg);
}
.cs-inner{ width:100%; max-width:680px; text-align:center; }

.cs-logo{ height:clamp(52px,9vw,68px); width:auto; margin:0 auto 26px; display:block; transition:opacity .14s; }
.cs-logo:hover{ opacity:.85; }

.cs-pill{
  display:inline-flex; align-items:center; gap:8px; margin:0 0 22px;
  padding:7px 15px; border-radius:999px;
  background:var(--overlay-3); border:1px solid var(--panel-brd);
  color:var(--grey-m); font-size:.8rem; font-weight:700; letter-spacing:.02em;
  transition:background .14s, border-color .14s, color .14s;
}
.cs-pill:hover{ background:var(--overlay-2); border-color:var(--btn-brd-h); color:var(--text-hi); }
.cs-pill .material-symbols-rounded{ font-size:16px; color:var(--ess-blue); }

.cs-title{
  margin:0 0 20px; font-weight:900; letter-spacing:-.02em; line-height:1.05;
  font-size:clamp(2.2rem,6vw,3.6rem); color:var(--text-hi);
}

.cs-domain{
  display:inline-block; margin:0 0 22px; padding:9px 17px; border-radius:12px;
  background:var(--menu); border:1px solid var(--panel-brd); box-shadow:0 1px 2px rgba(0,0,0,.18);
  font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  font-size:.95rem; font-weight:600; color:var(--text-hi); word-break:break-all;
}
/* Filled in by JS; keep it out of the flow until it has a value. */
.cs-domain[hidden]{ display:none; }

.cs-lead{ margin:0 auto; max-width:46ch; color:var(--grey-m); font-size:1.05rem; line-height:1.65; }

/* ── Footer: copyright left, theme toggle centre, legal right ───────────── */
.cs-footer{ margin-top:auto; background:var(--bg-2); }
.cs-footer-inner{
  max-width:1120px; margin:0 auto; padding:16px 24px;
  display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:16px;
}
.cs-copy{ color:var(--grey-m); font-size:.8rem; line-height:1.5; }
.cs-theme{ display:flex; justify-content:center; }
.cs-legal{ display:flex; justify-content:flex-end; gap:20px; }
.cs-legal a{ color:var(--grey-m); font-size:.8rem; font-weight:600; white-space:nowrap; transition:color .13s; }
.cs-legal a:hover{ color:var(--text-hi); }

@media (max-width:720px){
  .cs-footer-inner{ grid-template-columns:1fr; justify-items:center; text-align:center; gap:14px; padding:20px 20px 22px; }
  .cs-legal{ justify-content:center; }
}