:root {
  --bg:#020914;
  --panel:#071626;
  --panel-2:#0b2034;
  --navy:#061425;
  --line:rgba(212,160,70,.28);
  --line-strong:rgba(229,181,92,.58);
  --gold:#d8a13a;
  --gold-2:#f0c56f;
  --text:#f7f0df;
  --muted:#b6c0cc;
  --blue:#123455;
  --green:#77d46b;
  --red:#ff6d54;
  --shadow:0 30px 90px rgba(0,0,0,.42);
  --radius:28px;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  color:var(--text);
  background:
    radial-gradient(circle at 15% 10%, rgba(38,91,126,.22), transparent 32%),
    radial-gradient(circle at 78% 18%, rgba(216,161,58,.10), transparent 26%),
    linear-gradient(180deg,#020914 0%,#061426 46%,#020914 100%);
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  overflow-x:hidden;
}

body:before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  opacity:.48;
  background:
    linear-gradient(rgba(216,161,58,.035) 1px, transparent 1px),
    linear-gradient(90deg, rgba(216,161,58,.028) 1px, transparent 1px);
  background-size:42px 42px;
  mask-image:linear-gradient(180deg,rgba(0,0,0,.95),rgba(0,0,0,.25));
}

body:after{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 0 18%, transparent 0 10%, rgba(216,161,58,.10) 10.2%, transparent 10.5%),
    radial-gradient(circle at 102% 38%, transparent 0 13%, rgba(216,161,58,.09) 13.2%, transparent 13.5%);
  opacity:.55;
}

a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}

.site-header{
  position:sticky;
  top:0;
  z-index:30;
  min-height:82px;
  padding:14px clamp(18px,4vw,64px);
  display:flex;
  align-items:center;
  gap:28px;
  border-bottom:1px solid var(--line);
  background:rgba(2,9,20,.86);
  backdrop-filter:blur(18px);
}

.brand{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:max-content;
}

.brand img{
  width:62px;
  height:62px;
  border-radius:50%;
  filter:drop-shadow(0 10px 24px rgba(0,0,0,.55));
}

.brand strong{
  display:block;
  font-size:30px;
  letter-spacing:.08em;
  line-height:1;
  color:#fff4d8;
}

.brand small{
  display:block;
  margin-top:5px;
  font-size:12px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--gold-2);
}

.nav{
  margin-left:auto;
  display:flex;
  align-items:center;
  gap:26px;
  font-weight:700;
  font-size:14px;
  color:#efe6d1;
}

.nav a:hover{color:var(--gold-2)}

.header-cta{
  padding:13px 20px;
  border:1px solid var(--line-strong);
  border-radius:999px;
  font-weight:800;
  background:rgba(216,161,58,.08);
}

.section-shell{
  position:relative;
  z-index:1;
  width:min(1420px, calc(100% - 44px));
  margin:0 auto;
  padding:82px 0;
}

.hero{
  min-height:calc(100vh - 82px);
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(420px,.86fr);
  align-items:center;
  gap:68px;
}

.eyebrow{
  margin:0 0 18px;
  color:var(--gold-2);
  letter-spacing:.34em;
  text-transform:uppercase;
  font-size:13px;
  font-weight:900;
}

h1,h2,h3,p{margin-top:0}
h1{
  max-width:780px;
  font-family:Georgia, "Times New Roman", serif;
  font-size:clamp(44px,6.2vw,92px);
  line-height:.96;
  letter-spacing:-.045em;
  margin-bottom:28px;
}

h2{
  font-family:Georgia, "Times New Roman", serif;
  font-size:clamp(34px,4.4vw,64px);
  line-height:1.02;
  letter-spacing:-.035em;
  margin-bottom:18px;
}

h3{font-size:22px;margin-bottom:10px}
p{color:var(--muted);line-height:1.64;font-size:18px}
.lead{font-size:22px;max-width:760px}

.button-row{
  display:flex;
  flex-wrap:wrap;
  gap:16px;
  margin-top:34px;
}

.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:54px;
  padding:0 28px;
  border-radius:12px;
  font-weight:900;
  letter-spacing:.04em;
  border:1px solid var(--line-strong);
}

.btn.primary{
  color:#06101c;
  background:linear-gradient(180deg,#f5cf7d,#c78a25);
  box-shadow:0 16px 36px rgba(216,161,58,.22), inset 0 1px 0 rgba(255,255,255,.55);
}

.btn.secondary{
  color:var(--gold-2);
  background:rgba(9,26,43,.72);
}

.trust-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:26px;
}

.trust-row span,.pill-grid span{
  padding:11px 15px;
  border-radius:999px;
  border:1px solid rgba(216,161,58,.24);
  background:rgba(8,28,45,.72);
  color:#f2d891;
  font-weight:800;
  font-size:13px;
}

.hero-badge-card{
  position:relative;
  display:grid;
  place-items:center;
  min-height:590px;
  border:1px solid var(--line-strong);
  border-radius:var(--radius);
  background:
    radial-gradient(circle at 50% 40%, rgba(216,161,58,.16), transparent 42%),
    linear-gradient(145deg,rgba(9,29,48,.96),rgba(3,12,22,.94));
  box-shadow:var(--shadow), inset 0 0 0 1px rgba(255,255,255,.035);
  overflow:hidden;
}

.hero-badge-card:before{
  content:"";
  position:absolute;
  inset:26px;
  border:1px solid rgba(216,161,58,.20);
  border-radius:22px;
}

.hero-badge-card img{
  width:min(76%,580px);
  border-radius:50%;
  filter:drop-shadow(0 24px 45px rgba(0,0,0,.62));
}

.section-heading{
  max-width:940px;
  margin-bottom:34px;
}

.app-showcase{
  border-top:1px solid rgba(216,161,58,.18);
}

.mockup-grid{
  display:grid;
  gap:34px;
}

.mockup-card{
  padding:24px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  background:linear-gradient(145deg,rgba(9,29,48,.86),rgba(2,10,18,.90));
  box-shadow:var(--shadow);
}

.mockup-label{
  display:flex;
  gap:18px;
  align-items:flex-start;
  margin-bottom:20px;
}

.mockup-label span{
  display:grid;
  place-items:center;
  width:48px;
  height:48px;
  border:1px solid var(--line-strong);
  border-radius:50%;
  color:#081220;
  background:linear-gradient(180deg,#f1c46c,#b77a21);
  font-weight:900;
}

.mockup-label h3{margin-bottom:4px}
.mockup-label p{font-size:15px;margin:0}

.mockup-card img{
  border-radius:20px;
  border:1px solid rgba(216,161,58,.28);
  box-shadow:0 24px 60px rgba(0,0,0,.38);
}

.modules{
  border-top:1px solid rgba(216,161,58,.18);
}

.module-grid,.roadmap-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:18px;
}

.module-grid article,.roadmap-grid article,.tica-panel,.request-card{
  min-height:220px;
  padding:24px;
  border:1px solid rgba(216,161,58,.26);
  border-radius:22px;
  background:linear-gradient(145deg,rgba(8,30,50,.82),rgba(3,12,22,.88));
  box-shadow:0 18px 42px rgba(0,0,0,.22);
}

.module-grid span{
  color:var(--gold-2);
  font-size:13px;
  letter-spacing:.22em;
  font-weight:900;
}

.module-grid p,.roadmap-grid p{font-size:15px;margin:0}

.split-section{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(360px,.7fr);
  gap:42px;
  align-items:center;
  border-top:1px solid rgba(216,161,58,.18);
}

.pill-grid{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:24px;
}

.tica-panel{
  min-height:420px;
}

.panel-top{
  display:flex;
  align-items:center;
  gap:16px;
  padding-bottom:20px;
  border-bottom:1px solid rgba(216,161,58,.22);
}

.panel-top img{
  width:82px;
  height:82px;
  border-radius:50%;
}

.panel-top strong{
  display:block;
  font-size:30px;
  color:var(--gold-2);
}

.panel-top small{color:var(--muted)}

.prompt-list{
  margin-top:24px;
  display:grid;
  gap:14px;
}

.prompt-list p{
  margin:0;
  padding:15px 17px;
  border:1px solid rgba(216,161,58,.22);
  border-radius:14px;
  background:rgba(2,9,20,.44);
  font-size:16px;
}

.roadmap{
  border-top:1px solid rgba(216,161,58,.18);
}

.roadmap-grid b{
  color:var(--gold-2);
  letter-spacing:.18em;
  text-transform:uppercase;
  font-size:12px;
}

.request-section{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(330px,.45fr);
  gap:32px;
  align-items:center;
  border-top:1px solid rgba(216,161,58,.18);
}

.request-card{
  min-height:260px;
}

.site-footer{
  position:relative;
  z-index:1;
  width:min(1420px,calc(100% - 44px));
  margin:20px auto 0;
  padding:34px 0 54px;
  border-top:1px solid rgba(216,161,58,.28);
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:center;
}

.footer-brand{
  display:flex;
  gap:14px;
  align-items:center;
}

.footer-brand img{
  width:74px;
  height:74px;
  border-radius:50%;
}

.footer-brand strong{
  display:block;
  font-size:18px;
}

.footer-brand small{
  color:var(--gold-2);
  letter-spacing:.1em;
  text-transform:uppercase;
  font-size:11px;
}

.site-footer p{
  font-size:14px;
  margin:0;
}

@media(max-width:1120px){
  .hero,.split-section,.request-section{grid-template-columns:1fr}
  .hero{min-height:auto}
  .module-grid,.roadmap-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:820px){
  .site-header{align-items:flex-start;flex-direction:column}
  .nav{margin-left:0;gap:14px;flex-wrap:wrap}
  .header-cta{display:none}
  .brand span small{letter-spacing:.12em}
  .section-shell{width:min(100% - 28px,1420px);padding:54px 0}
  .hero-badge-card{min-height:390px}
  .module-grid,.roadmap-grid{grid-template-columns:1fr}
  .site-footer{flex-direction:column;align-items:flex-start}
}


/* v24.7-logon-mockup-feature.1 - restored multi-page website support */
.content-page {
  position: relative;
  z-index: 1;
}

.page-hero {
  min-height: auto;
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(340px, .62fr);
  gap: 48px;
  align-items: center;
  border-bottom: 1px solid rgba(216,161,58,.18);
}

.page-hero h1 {
  font-size: clamp(42px, 5vw, 78px);
}

.page-badge-card {
  min-height: 360px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(145deg, rgba(9,29,48,.86), rgba(3,12,22,.90));
  display: grid;
  place-items: center;
  padding: 26px;
  box-shadow: var(--shadow);
  overflow: hidden;
}

.page-badge-card img {
  width: min(100%, 520px);
  border-radius: 22px;
  object-fit: contain;
}

.page-badge-card img[src*="tics-logo-approved-round"] {
  border-radius: 50%;
  width: min(88%, 440px);
}

.feature-stack {
  display: grid;
  gap: 18px;
}

.feature-stack article,
.faq-list article {
  padding: 24px;
  border: 1px solid rgba(216,161,58,.26);
  border-radius: 22px;
  background: linear-gradient(145deg, rgba(8,30,50,.82), rgba(3,12,22,.88));
}

.command-path {
  display: grid;
  grid-template-columns: repeat(3, minmax(0,1fr));
  gap: 18px;
}

.command-path div {
  padding: 24px;
  border: 1px solid rgba(216,161,58,.26);
  border-radius: 22px;
  background: linear-gradient(145deg, rgba(8,30,50,.82), rgba(3,12,22,.88));
}

.command-path strong {
  display: block;
  color: var(--gold-2);
  font-size: 22px;
  margin-bottom: 10px;
}

.command-path span {
  color: var(--muted);
  line-height: 1.55;
}

.faq-list {
  display: grid;
  gap: 18px;
}

@media(max-width: 1120px) {
  .page-hero {
    grid-template-columns: 1fr;
  }
  .command-path {
    grid-template-columns: 1fr;
  }
}


/* v24.7-logon-mockup-feature.1 - vision and sales sections */
.problem-section,
.comparison-section,
.command-chain-section,
.tica-examples-section,
.serious-operations-section,
.industry-sell-section,
.different-section {
  border-top: 1px solid rgba(216,161,58,.18);
}

.pain-grid,
.operations-grid,
.industry-grid,
.chain-grid {
  display: grid;
  gap: 18px;
}

.pain-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.operations-grid,
.chain-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.industry-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.pain-grid article,
.operations-grid article,
.industry-grid article,
.chain-grid article {
  padding: 24px;
  border: 1px solid rgba(216,161,58,.25);
  border-radius: 22px;
  background:
    radial-gradient(circle at 12% 0%, rgba(216,161,58,.10), transparent 28%),
    linear-gradient(145deg, rgba(8,30,50,.84), rgba(3,12,22,.90));
  box-shadow: 0 18px 42px rgba(0,0,0,.20);
}

.pain-grid h3,
.operations-grid h3,
.industry-grid h3,
.chain-grid h3 {
  color: #fff5dc;
}

.pain-grid p,
.operations-grid p,
.industry-grid p,
.chain-grid p {
  font-size: 15px;
  margin: 0;
}

.industry-grid span,
.chain-grid span {
  display: inline-block;
  margin-bottom: 12px;
  color: var(--gold-2);
  letter-spacing: .20em;
  text-transform: uppercase;
  font-size: 12px;
  font-weight: 900;
}

.comparison-table {
  overflow: hidden;
  border: 1px solid rgba(216,161,58,.30);
  border-radius: 24px;
  background: linear-gradient(145deg, rgba(8,30,50,.84), rgba(3,12,22,.90));
  box-shadow: var(--shadow);
}

.comparison-table > div {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.comparison-table > div > div {
  padding: 20px 24px;
  border-bottom: 1px solid rgba(216,161,58,.16);
  color: var(--muted);
  line-height: 1.55;
}

.comparison-table > div > div:first-child {
  border-right: 1px solid rgba(216,161,58,.16);
}

.comparison-head > div {
  color: #081220 !important;
  background: linear-gradient(180deg, #f0c56f, #c98c29);
  font-weight: 950;
  letter-spacing: .08em;
  text-transform: uppercase;
}

.tica-examples-section {
  display: grid;
  grid-template-columns: minmax(0, .82fr) minmax(420px, 1fr);
  gap: 38px;
  align-items: center;
}

.tica-question-grid {
  display: grid;
  gap: 12px;
}

.tica-question-grid div {
  padding: 16px 18px;
  border: 1px solid rgba(216,161,58,.28);
  border-radius: 16px;
  background: rgba(3,12,22,.70);
  color: #f4ddb0;
  font-weight: 800;
}

.different-card {
  padding: clamp(28px, 5vw, 58px);
  border: 1px solid rgba(216,161,58,.35);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 75% 20%, rgba(216,161,58,.14), transparent 35%),
    linear-gradient(145deg, rgba(9,29,48,.92), rgba(3,12,22,.96));
  box-shadow: var(--shadow);
}

.connected-line {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 28px;
}

.connected-line span {
  padding: 12px 15px;
  border: 1px solid rgba(216,161,58,.26);
  border-radius: 999px;
  color: #f2d891;
  background: rgba(8,28,45,.74);
  font-weight: 900;
}

@media(max-width:1120px) {
  .pain-grid,
  .operations-grid,
  .chain-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .tica-examples-section {
    grid-template-columns: 1fr;
  }
}

@media(max-width:760px) {
  .pain-grid,
  .operations-grid,
  .industry-grid,
  .chain-grid {
    grid-template-columns: 1fr;
  }

  .comparison-table > div {
    grid-template-columns: 1fr;
  }

  .comparison-table > div > div:first-child {
    border-right: 0;
  }
}


/* v24.7-logon-mockup-feature.1 - premium motion and visual effects */
html.js .section-shell,
html.js .module-grid article,
html.js .pain-grid article,
html.js .operations-grid article,
html.js .industry-grid article,
html.js .chain-grid article,
html.js .mockup-card,
html.js .tica-panel,
html.js .different-card {
  opacity: 0;
  transform: translateY(28px) scale(.985);
  transition:
    opacity .85s cubic-bezier(.16,1,.3,1),
    transform .85s cubic-bezier(.16,1,.3,1),
    border-color .35s ease,
    box-shadow .35s ease;
}

html.js .section-shell.is-visible,
html.js .module-grid article.is-visible,
html.js .pain-grid article.is-visible,
html.js .operations-grid article.is-visible,
html.js .industry-grid article.is-visible,
html.js .chain-grid article.is-visible,
html.js .mockup-card.is-visible,
html.js .tica-panel.is-visible,
html.js .different-card.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}

#ticsParticleField {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .42;
  mix-blend-mode: screen;
}

.cursor-spotlight {
  position: fixed;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  opacity: .52;
  background: radial-gradient(520px circle at var(--mx, 50%) var(--my, 20%), rgba(216,161,58,.13), transparent 45%);
  transition: opacity .35s ease;
}

.site-header {
  overflow: hidden;
}

.site-header::after {
  content: "";
  position: absolute;
  left: -35%;
  bottom: -1px;
  width: 35%;
  height: 1px;
  background: linear-gradient(90deg, transparent, rgba(240,197,111,.95), transparent);
  animation: headerScan 7s ease-in-out infinite;
}

.hero-badge-card::after,
.page-badge-card::after,
.mockup-card::after,
.different-card::after {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(120deg, transparent 12%, rgba(240,197,111,.20), transparent 38%);
  transform: translateX(-115%);
  animation: panelSheen 9s ease-in-out infinite;
}

.hero-badge-card,
.page-badge-card,
.mockup-card,
.different-card,
.module-grid article,
.pain-grid article,
.operations-grid article,
.industry-grid article,
.chain-grid article,
.tica-panel,
.request-form {
  position: relative;
  isolation: isolate;
}

.hero-badge-card img,
.page-badge-card img[src*="tics-logo-approved-round"],
.footer-brand img,
.brand img {
  animation: badgeBreath 6.5s ease-in-out infinite;
}

.brand img:hover,
.footer-brand img:hover,
.hero-badge-card img:hover,
.page-badge-card img:hover {
  filter:
    drop-shadow(0 20px 35px rgba(0,0,0,.62))
    drop-shadow(0 0 18px rgba(240,197,111,.35));
}

.mockup-card img {
  transition: transform .55s cubic-bezier(.16,1,.3,1), filter .55s ease;
}

.mockup-card:hover img {
  transform: translateY(-6px) scale(1.012);
  filter: saturate(1.08) contrast(1.04);
}

.module-grid article:hover,
.pain-grid article:hover,
.operations-grid article:hover,
.industry-grid article:hover,
.chain-grid article:hover,
.tica-panel:hover,
.request-form:hover {
  border-color: rgba(240,197,111,.60);
  box-shadow:
    0 28px 70px rgba(0,0,0,.35),
    inset 0 0 0 1px rgba(255,255,255,.035),
    0 0 45px rgba(216,161,58,.08);
  transform: translateY(-4px);
}

.connected-line span,
.trust-row span,
.pill-grid span {
  transition: transform .28s ease, border-color .28s ease, background .28s ease;
}

.connected-line span:hover,
.trust-row span:hover,
.pill-grid span:hover {
  transform: translateY(-2px);
  border-color: rgba(240,197,111,.72);
  background: rgba(216,161,58,.13);
}

.btn {
  position: relative;
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease, border-color .25s ease;
}

.btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 18px 40px rgba(216,161,58,.20);
}

.btn::before {
  content: "";
  position: absolute;
  top: 0;
  left: -90%;
  width: 70%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,.26), transparent);
  transform: skewX(-18deg);
  transition: left .65s ease;
}

.btn:hover::before {
  left: 120%;
}

.request-form-section {
  display: grid;
  grid-template-columns: minmax(0, .78fr) minmax(380px, .7fr);
  gap: 38px;
  align-items: start;
}

.request-form {
  padding: 28px;
  border: 1px solid rgba(216,161,58,.32);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 20% 0%, rgba(216,161,58,.12), transparent 30%),
    linear-gradient(145deg, rgba(8,30,50,.90), rgba(3,12,22,.96));
  box-shadow: var(--shadow);
}

.request-form h3 {
  color: var(--gold-2);
  font-size: 30px;
}

.request-form label {
  display: grid;
  gap: 7px;
  color: #f6e5c2;
  font-weight: 800;
  margin-bottom: 15px;
}

.request-form input,
.request-form select,
.request-form textarea {
  width: 100%;
  border: 1px solid rgba(216,161,58,.32);
  border-radius: 13px;
  background: rgba(2,9,20,.58);
  color: var(--text);
  padding: 14px 15px;
  font: inherit;
  outline: none;
}

.request-form input:focus,
.request-form select:focus,
.request-form textarea:focus {
  border-color: rgba(240,197,111,.84);
  box-shadow: 0 0 0 3px rgba(216,161,58,.14);
}

.request-form textarea {
  resize: vertical;
}

.form-note {
  font-size: 13px;
  margin-top: 12px;
}

.form-result {
  display: none;
  margin-top: 16px;
  padding: 16px;
  border: 1px solid rgba(119,212,107,.42);
  border-radius: 14px;
  background: rgba(119,212,107,.08);
  color: #d8ffd4;
  white-space: pre-wrap;
  line-height: 1.55;
}

.form-result.is-active {
  display: block;
}

@keyframes headerScan {
  0%, 15% { left: -35%; opacity: 0; }
  25% { opacity: 1; }
  55% { left: 100%; opacity: 1; }
  65%, 100% { left: 100%; opacity: 0; }
}

@keyframes panelSheen {
  0%, 42% { transform: translateX(-115%); opacity: 0; }
  50% { opacity: .8; }
  64% { transform: translateX(115%); opacity: 0; }
  100% { transform: translateX(115%); opacity: 0; }
}

@keyframes badgeBreath {
  0%, 100% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-2px) scale(1.012); }
}

@media(max-width:1120px) {
  .request-form-section {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation: none !important;
    transition: none !important;
    scroll-behavior: auto !important;
  }

  html.js .section-shell,
  html.js .module-grid article,
  html.js .pain-grid article,
  html.js .operations-grid article,
  html.js .industry-grid article,
  html.js .chain-grid article,
  html.js .mockup-card,
  html.js .tica-panel,
  html.js .different-card {
    opacity: 1 !important;
    transform: none !important;
  }

  #ticsParticleField,
  .cursor-spotlight {
    display: none !important;
  }
}


/* v24.7-logon-mockup-feature.1 - pre-launch beta sales website sections */
.beta-banner {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(320px, .42fr);
  gap: 28px;
  align-items: center;
  padding: clamp(28px, 5vw, 58px);
  border: 1px solid rgba(216,161,58,.38);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 78% 16%, rgba(240,197,111,.18), transparent 33%),
    linear-gradient(145deg, rgba(9,29,48,.94), rgba(3,12,22,.96));
  box-shadow: var(--shadow);
  position: relative;
  overflow: hidden;
}

.beta-banner::before {
  content: "";
  position: absolute;
  inset: 18px;
  border: 1px solid rgba(216,161,58,.16);
  border-radius: 20px;
  pointer-events: none;
}

.beta-status-card {
  padding: 24px;
  border: 1px solid rgba(240,197,111,.42);
  border-radius: 22px;
  background: rgba(2,9,20,.58);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.035);
}

.beta-status-card span {
  color: var(--gold-2);
  letter-spacing: .20em;
  text-transform: uppercase;
  font-weight: 900;
  font-size: 12px;
}

.beta-status-card strong {
  display: block;
  color: #fff4d8;
  font-size: 34px;
  margin: 10px 0;
  font-family: Georgia, "Times New Roman", serif;
}

.beta-fit-grid,
.early-grid,
.commercial-stage-grid,
.pricing-path-grid {
  display: grid;
  gap: 18px;
}

.beta-fit-grid,
.early-grid,
.commercial-stage-grid {
  grid-template-columns: repeat(4, minmax(0, 1fr));
}

.pricing-path-grid {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.beta-fit-grid article,
.early-grid article,
.commercial-stage-grid article,
.pricing-path-grid article {
  padding: 24px;
  border: 1px solid rgba(216,161,58,.25);
  border-radius: 22px;
  background:
    radial-gradient(circle at 10% 0%, rgba(240,197,111,.10), transparent 30%),
    linear-gradient(145deg, rgba(8,30,50,.84), rgba(3,12,22,.90));
  box-shadow: 0 18px 42px rgba(0,0,0,.20);
}

.early-grid span,
.commercial-stage-grid b,
.pricing-path-grid b {
  display: inline-block;
  margin-bottom: 12px;
  color: var(--gold-2);
  letter-spacing: .20em;
  text-transform: uppercase;
  font-size: 12px;
  font-weight: 900;
}

.stage-active,
.featured-price-card {
  border-color: rgba(240,197,111,.62) !important;
  box-shadow:
    0 28px 70px rgba(0,0,0,.35),
    0 0 55px rgba(216,161,58,.12) !important;
}

.beta-fit-grid p,
.early-grid p,
.commercial-stage-grid p,
.pricing-path-grid p {
  font-size: 15px;
  margin: 0;
}

.beta-banner-section,
.beta-fit-section,
.early-adopter-section,
.commercial-roadmap-section,
.pricing-path-section {
  border-top: 1px solid rgba(216,161,58,.18);
}

@media(max-width:1120px) {
  .beta-banner {
    grid-template-columns: 1fr;
  }
  .beta-fit-grid,
  .early-grid,
  .commercial-stage-grid,
  .pricing-path-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media(max-width:760px) {
  .beta-fit-grid,
  .early-grid,
  .commercial-stage-grid,
  .pricing-path-grid {
    grid-template-columns: 1fr;
  }
}


/* v24.7-logon-mockup-feature.1 - expanded industries and custom build options */
.industry-grid-expanded {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.custom-build-section {
  border-top: 1px solid rgba(216,161,58,.18);
}

.custom-build-card {
  padding: clamp(28px, 5vw, 58px);
  border: 1px solid rgba(216,161,58,.38);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 78% 16%, rgba(240,197,111,.16), transparent 33%),
    linear-gradient(145deg, rgba(9,29,48,.94), rgba(3,12,22,.96));
  box-shadow: var(--shadow);
  position: relative;
  overflow: hidden;
}

.custom-build-list,
.custom-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 18px;
  margin-top: 28px;
}

.custom-build-list article,
.custom-grid article,
.custom-build-inline {
  padding: 24px;
  border: 1px solid rgba(216,161,58,.25);
  border-radius: 22px;
  background:
    radial-gradient(circle at 10% 0%, rgba(240,197,111,.10), transparent 30%),
    linear-gradient(145deg, rgba(8,30,50,.84), rgba(3,12,22,.90));
  box-shadow: 0 18px 42px rgba(0,0,0,.20);
}

.custom-grid span {
  display: inline-block;
  margin-bottom: 12px;
  color: var(--gold-2);
  letter-spacing: .20em;
  text-transform: uppercase;
  font-size: 12px;
  font-weight: 900;
}

.custom-build-list p,
.custom-grid p {
  font-size: 15px;
  margin: 0;
}

.custom-build-inline {
  margin-top: 24px;
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 24px;
  align-items: center;
}

.custom-build-inline h3 {
  font-size: clamp(24px, 3vw, 38px);
  font-family: Georgia, "Times New Roman", serif;
  color: #fff4d8;
}

.custom-build-inline p {
  margin-bottom: 0;
}

@media(max-width:1120px) {
  .industry-grid-expanded,
  .custom-build-list,
  .custom-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .custom-build-inline {
    grid-template-columns: 1fr;
  }
}

@media(max-width:760px) {
  .industry-grid-expanded,
  .custom-build-list,
  .custom-grid {
    grid-template-columns: 1fr;
  }
}


/* v24.7-logon-mockup-feature.1 - prominent app logon mockup section */
.logon-preview-section {
  border-top: 1px solid rgba(216,161,58,.18);
}

.logon-preview-grid {
  display: grid;
  grid-template-columns: minmax(0, .62fr) minmax(460px, 1fr);
  gap: 42px;
  align-items: center;
}

.logon-mockup-frame {
  position: relative;
  padding: 18px;
  border: 1px solid rgba(216,161,58,.38);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 50% 0%, rgba(240,197,111,.16), transparent 35%),
    linear-gradient(145deg, rgba(9,29,48,.92), rgba(3,12,22,.96));
  box-shadow: var(--shadow);
  overflow: hidden;
}

.logon-mockup-frame::before {
  content: "";
  position: absolute;
  inset: 18px;
  border: 1px solid rgba(216,161,58,.14);
  border-radius: 20px;
  pointer-events: none;
  z-index: 1;
}

.logon-mockup-frame::after {
  content: "";
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  pointer-events: none;
  background: linear-gradient(120deg, transparent 12%, rgba(240,197,111,.20), transparent 38%);
  transform: translateX(-115%);
  animation: panelSheen 9s ease-in-out infinite;
}

.logon-mockup-frame img {
  position: relative;
  z-index: 2;
  width: 100%;
  border-radius: 20px;
  border: 1px solid rgba(216,161,58,.24);
  box-shadow: 0 26px 70px rgba(0,0,0,.42);
  transition: transform .55s cubic-bezier(.16,1,.3,1), filter .55s ease;
}

.logon-mockup-frame:hover img {
  transform: translateY(-6px) scale(1.012);
  filter: saturate(1.08) contrast(1.04);
}

html.js .logon-mockup-frame {
  opacity: 0;
  transform: translateY(28px) scale(.985);
  transition:
    opacity .85s cubic-bezier(.16,1,.3,1),
    transform .85s cubic-bezier(.16,1,.3,1),
    border-color .35s ease,
    box-shadow .35s ease;
}

html.js .logon-mockup-frame.is-visible {
  opacity: 1;
  transform: translateY(0) scale(1);
}

@media(max-width:1120px) {
  .logon-preview-grid {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  html.js .logon-mockup-frame {
    opacity: 1 !important;
    transform: none !important;
  }
}
