:root{
  /* WARDEN PALETTE (steel / navy / ice / brass) */
  --bg:#020611;
  --bg2:#030a17;

  --card:#071224;
  --card2:#06101f;

  --steel:#b9c7d6;
  --ice:#d9f0ff;
  --mut:#9aa7b6;
  --soft:#6f7c8c;

  --line:rgba(185,199,214,.14);
  --line2:rgba(185,199,214,.22);

  /* accents */
  --warden:#4aa3ff;      /* primary warden blue */
  --warden2:#9bd6ff;     /* ice highlight */
  --brass:#d8b66a;       /* prestige */
  --brass2:#f0d79b;

  --rad:20px;
  --rad2:16px;

  --shadow: 0 20px 60px rgba(0,0,0,.78);
  --glow: 0 0 50px rgba(74,163,255,.14);
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;scroll-behavior:smooth}
body{
  font-family: system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
  background:
    radial-gradient(1100px 650px at 20% 10%, rgba(74,163,255,.12), transparent 60%),
    radial-gradient(900px 600px at 80% 20%, rgba(155,214,255,.08), transparent 62%),
    radial-gradient(1000px 700px at 50% 90%, rgba(216,182,106,.06), transparent 65%),
    linear-gradient(180deg,var(--bg), #000);
  color: var(--ice);
  overflow-x:hidden;
}

a{color:inherit;text-decoration:none}
code{font-family: ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}

.wrap{max-width:1180px;margin:0 auto;padding:0 22px}

.noise{
  position:fixed;inset:0;pointer-events:none;z-index:2;
  opacity:.085;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.65'/%3E%3C/svg%3E");
  background-size:180px 180px;
}

#fx{position:fixed;inset:0;z-index:1;pointer-events:none}

.cursor-glow{
  position:fixed;left:0;top:0;width:50px;height:50px;border-radius:999px;z-index:3;
  pointer-events:none;
  transform:translate(-50%,-50%);
  background:
    radial-gradient(circle at 35% 30%, rgba(74,163,255,.22), transparent 55%),
    radial-gradient(circle at 70% 60%, rgba(155,214,255,.14), transparent 55%),
    radial-gradient(circle at 50% 80%, rgba(216,182,106,.10), transparent 60%);
  filter: blur(35px);
  opacity:0;
  transition: opacity .25s ease-out;
}

.scrollbar{
  position:fixed;left:0;top:0;right:0;height:3px;z-index:50;
  background: rgba(185,199,214,.10);
}
.scrollbar__fill{
  height:100%;width:0%;
  background: linear-gradient(90deg, var(--warden), var(--warden2), var(--brass));
  box-shadow: 0 0 18px rgba(74,163,255,.25);
}

/* TOPBAR */
.topbar{
  position:sticky;top:0;z-index:40;
  backdrop-filter: blur(16px);
  background: linear-gradient(180deg, rgba(2,6,17,.92), rgba(2,6,17,.70));
  border-bottom:1px solid rgba(185,199,214,.12);
}
.topbar__inner{
  display:flex;align-items:center;gap:16px;
  padding:12px 0;
}

.brand{display:flex;align-items:center;gap:12px;min-width:260px}
.brand__mark{
  display:inline-flex;align-items:center;justify-content:center;
  width:44px;height:44px;border-radius:18px;
  background:
    radial-gradient(circle at 30% 20%, #ffffff, var(--warden2) 36%, #06223a 75%, #01060f 100%);
  color:#03131f;font-weight:950;letter-spacing:.10em;
  box-shadow: var(--glow);
  border: 1px solid rgba(155,214,255,.22);
}
.brand__text{display:flex;flex-direction:column;line-height:1.1}
.brand__title{font-weight:800;font-size:.95rem}
.brand__sub{font-size:.78rem;color:var(--soft)}

.nav{margin-left:auto;display:flex;align-items:center;gap:12px}
.nav__toggle{
  display:none;width:38px;height:38px;border-radius:999px;
  border:1px solid rgba(185,199,214,.18);
  background: rgba(7,18,36,.55);
  cursor:pointer;align-items:center;justify-content:center;flex-direction:column;gap:4px;
}
.nav__toggle span{display:block;width:16px;height:2px;border-radius:999px;background:var(--ice);transition:.18s}
.nav__toggle.is-open span:nth-child(1){transform: translateY(4px) rotate(45deg)}
.nav__toggle.is-open span:nth-child(2){opacity:0;width:0}
.nav__toggle.is-open span:nth-child(3){transform: translateY(-4px) rotate(-45deg)}

.nav__panel{display:flex;gap:16px;align-items:center}
.nav__link{
  font-size:.86rem;color:rgba(185,199,214,.72);
  position:relative;padding:6px 2px;
  transition: color .15s ease-out;
}
.nav__link:hover{color:var(--ice)}
.nav__link::after{
  content:"";position:absolute;left:0;bottom:0;height:2px;width:0%;
  background: linear-gradient(90deg, var(--warden2), var(--brass));
  border-radius:999px;transition: width .22s ease-out;
}
.nav__link.is-active{color:var(--warden2)}
.nav__link.is-active::after{width:100%}

.topbar__cta{display:flex;align-items:center;gap:10px}

/* BUTTONS */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  padding:10px 14px;border-radius:999px;border:1px solid transparent;
  font-weight:800;letter-spacing:.01em;cursor:pointer;
  transition: transform .10s ease-out, box-shadow .18s ease-out, background .18s ease-out, border-color .18s ease-out;
}
.btn--xl{padding:12px 18px;font-size:.95rem}
.btn--full{width:100%}

.btn--primary{
  color:#02101a;
  background: linear-gradient(135deg, var(--warden2), var(--warden));
  box-shadow: 0 0 45px rgba(74,163,255,.20);
  border-color: rgba(155,214,255,.25);
}
.btn--primary:hover{transform: translateY(-1px); box-shadow: 0 0 60px rgba(74,163,255,.26)}
.btn--ghost{
  color:var(--ice);
  background: rgba(7,18,36,.40);
  border-color: rgba(185,199,214,.18);
}
.btn--ghost:hover{transform: translateY(-1px); border-color: rgba(185,199,214,.28); background: rgba(7,18,36,.62)}

/* BADGE / TEXT */
.badge{
  display:inline-flex;align-items:center;gap:8px;
  padding:7px 10px;border-radius:999px;
  background: rgba(7,18,36,.55);
  border: 1px solid rgba(185,199,214,.16);
  color:rgba(217,240,255,.92);font-size:.78rem;font-weight:850;
}
.badge--soft{background: rgba(7,18,36,.35); color:rgba(185,199,214,.78)}
.dot{width:6px;height:6px;border-radius:999px;background: var(--warden2); box-shadow: 0 0 16px rgba(74,163,255,.55)}
.muted{color:rgba(185,199,214,.78)}
.tiny{font-size:.78rem}

.grad{
  background: linear-gradient(120deg, var(--warden2), var(--brass2));
  -webkit-background-clip:text;color:transparent;
}

/* HERO */
.hero{position:relative;padding: 84px 0 40px;overflow:hidden;}
.hero__bg{position:absolute;inset:0;z-index:0;pointer-events:none}
.hero__ring{position:absolute;border-radius:999px;filter: blur(65px);opacity:.62;}
.hero__ring--a{width:760px;height:760px;left:-250px;top:-290px;background: radial-gradient(circle, rgba(74,163,255,.22), transparent 62%)}
.hero__ring--b{width:840px;height:840px;right:-300px;top:-260px;background: radial-gradient(circle, rgba(155,214,255,.18), transparent 64%)}

.hero__grid{
  position:absolute;inset:-40% -20%;
  background:
    linear-gradient(rgba(185,199,214,.07) 1px, transparent 1px),
    linear-gradient(90deg, rgba(185,199,214,.07) 1px, transparent 1px);
  background-size: 46px 46px;
  transform: rotate(9deg);
  opacity:.26;
  mask-image: radial-gradient(circle at 40% 20%, #000 0, transparent 62%);
}
.hero__flare{
  position:absolute;inset:-30%;
  background:
    radial-gradient(circle at 50% 40%, rgba(74,163,255,.10), transparent 58%),
    radial-gradient(circle at 45% 35%, rgba(155,214,255,.08), transparent 58%),
    radial-gradient(circle at 50% 70%, rgba(216,182,106,.06), transparent 64%);
  opacity:.85;
  animation: flare 9s ease-in-out infinite;
}
@keyframes flare{0%,100%{transform: translate3d(0,0,0) scale(1)}50%{transform: translate3d(10px,-12px,0) scale(1.05)}}

.hero__inner{
  position:relative;z-index:4;
  display:grid;grid-template-columns: minmax(0,1.2fr) minmax(0,1fr);
  gap:26px;align-items:start;
}
.kicker{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.hero__title{margin:14px 0 10px;font-size: clamp(2.2rem, 4vw, 3.35rem);line-height:1.05;letter-spacing:-.02em}
.hero__lead{margin:0 0 16px;font-size:1.03rem;color:rgba(217,240,255,.88);max-width: 60ch}
.hero__actions{display:flex;gap:12px;flex-wrap:wrap;margin: 16px 0 18px}
.hero__highlights{display:grid;grid-template-columns: repeat(3,minmax(0,1fr));gap:10px;margin-top:10px}

.pill{
  padding:10px 12px;border-radius: 16px;
  border:1px solid rgba(185,199,214,.16);
  background:
    radial-gradient(circle at 20% 10%, rgba(74,163,255,.10), transparent 60%),
    rgba(7,18,36,.46);
  box-shadow: var(--glow);
}
.pill__k{display:block;font-weight:900;font-size:.86rem;color:var(--warden2)}
.pill__v{display:block;font-size:.78rem;color:rgba(185,199,214,.78);margin-top:2px}

/* CONSOLE */
.console{
  border-radius: var(--rad);
  border:1px solid rgba(185,199,214,.16);
  background: linear-gradient(145deg, rgba(7,18,36,.78), rgba(6,16,31,.70));
  box-shadow: var(--shadow);
  overflow:hidden;
}
.console__top{
  display:flex;align-items:center;gap:8px;
  padding:12px 14px;border-bottom:1px solid rgba(185,199,214,.12);
  background: rgba(2,6,17,.42);
}
.console__lamp{width:9px;height:9px;border-radius:999px;background: rgba(185,199,214,.36)}
.console__title{margin-left:6px;font-size:.8rem;color:rgba(185,199,214,.75)}
.console__body{padding:14px}
.stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.stat{padding:10px 12px;border-radius:16px;border:1px solid rgba(185,199,214,.12);background: rgba(7,18,36,.46)}
.stat__k{font-size:.78rem;color:rgba(185,199,214,.74)}
.stat__v{font-size:1.25rem;font-weight:950;color:var(--warden2);margin-top:4px}
.console__divider{
  height:1px;margin:12px 0;
  background: linear-gradient(90deg, transparent, rgba(185,199,214,.24), transparent);
}
.signal{display:flex;flex-direction:column;gap:8px}
.signal__line{display:flex;gap:10px;align-items:center}
.signal__tag{
  font-size:.72rem;font-weight:950;letter-spacing:.08em;
  padding:4px 8px;border-radius:999px;
  border:1px solid rgba(74,163,255,.22);
  background: rgba(74,163,255,.10);
  color:rgba(217,240,255,.92);
}
.signal__txt{color:rgba(185,199,214,.78);font-size:.84rem}

.cta-card{
  margin-top:12px;
  padding:12px;border-radius:16px;
  border:1px solid rgba(216,182,106,.22);
  background:
    radial-gradient(circle at 18% 12%, rgba(216,182,106,.12), transparent 60%),
    rgba(7,18,36,.46);
}
.cta-card__title{font-weight:950}
.cta-card__sub{color:rgba(185,199,214,.78);font-size:.86rem;margin:4px 0 10px}

/* MARQUEE */
.hero__bottom{margin-top:24px}
.marquee{
  border:1px solid rgba(185,199,214,.12);
  background: rgba(7,18,36,.24);
  border-radius: 999px;
  overflow:hidden;
}
.marquee__track{
  display:flex;gap:22px;white-space:nowrap;
  padding:10px 0;
  animation: marquee 18s linear infinite;
  color: rgba(185,199,214,.80);
  letter-spacing:.18em;
  text-transform:uppercase;
  font-size:.78rem;
}
@keyframes marquee{from{transform: translateX(0)}to{transform: translateX(-50%)}}

/* SECTIONS */
.section{padding: 72px 0}
.section--alt{
  background: linear-gradient(180deg, rgba(7,18,36,.30), rgba(2,6,17,.10));
  border-top:1px solid rgba(185,199,214,.10);
  border-bottom:1px solid rgba(185,199,214,.10);
}
.section--dark{
  background:
    radial-gradient(1000px 520px at 50% 0%, rgba(74,163,255,.10), transparent 62%),
    linear-gradient(180deg, rgba(2,6,17,.30), rgba(2,6,17,.06));
  border-top:1px solid rgba(185,199,214,.10);
  border-bottom:1px solid rgba(185,199,214,.10);
}

.section__head{max-width:860px}
.eyebrow{
  margin:0 0 10px;color: rgba(155,214,255,.95);
  letter-spacing:.20em;text-transform:uppercase;font-size:.78rem;
}
.section__head h2{margin:0 0 10px;font-size: clamp(1.7rem, 2.6vw, 2.3rem);line-height:1.15}
.lead{margin:0;color: rgba(217,240,255,.82);max-width:80ch}

/* TILES */
.tiles{
  margin-top:22px;
  display:grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap:14px;
}
.tile{
  border-radius: var(--rad);
  border:1px solid rgba(185,199,214,.14);
  background: linear-gradient(145deg, rgba(7,18,36,.62), rgba(6,16,31,.50));
  box-shadow: var(--shadow);
  padding:16px;
  position:relative;
  overflow:hidden;
}
.tile::before{
  content:"";
  position:absolute;inset:-40%;
  background: radial-gradient(circle at var(--mx,50%) var(--my,0%), rgba(74,163,255,.14), transparent 58%);
  opacity:0;transition:opacity .18s ease-out;
}
.tile:hover::before{opacity:1}
.tile__icon{font-size:1.35rem}
.tile h3{margin:10px 0 6px;font-size:1.05rem}
.tile p{margin:0;color:rgba(185,199,214,.78);font-size:.92rem}

/* REGIMENTS CONTROLS */
.reg-controls{
  margin-top:18px;
  display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;
}
.seg{
  display:inline-flex;gap:6px;padding:6px;border-radius:999px;
  border:1px solid rgba(185,199,214,.14);
  background: rgba(7,18,36,.30);
}
.seg__btn{
  border:none;cursor:pointer;
  padding:8px 10px;border-radius:999px;
  background: transparent;color: rgba(185,199,214,.78);
  font-weight:950;font-size:.82rem;
  transition: .18s ease-out;
}
.seg__btn:hover{color:var(--ice)}
.seg__btn.is-on{
  background:
    radial-gradient(circle at 30% 20%, rgba(155,214,255,.14), rgba(7,18,36,.55));
  color:var(--warden2);
  border:1px solid rgba(155,214,255,.18);
}

.search input{
  width:min(420px, 82vw);
  padding:10px 12px;border-radius:999px;
  border:1px solid rgba(185,199,214,.14);
  background: rgba(7,18,36,.30);
  color: var(--ice);
  outline:none;
}
.search input:focus{
  border-color: rgba(155,214,255,.25);
  box-shadow: 0 0 0 3px rgba(74,163,255,.10)
}

/* WARDEN ROSTER GRID */
.reg-grid{
  margin-top:16px;
  display:grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap:12px;
}

/* regiment dossier */
.reg{
  border-radius: var(--rad);
  border:1px solid rgba(185,199,214,.14);
  background: linear-gradient(145deg, rgba(7,18,36,.62), rgba(6,16,31,.52));
  box-shadow: var(--shadow);
  padding:14px;
  position:relative;
  overflow:hidden;
  transition: transform .12s ease-out, border-color .18s ease-out;
}
.reg:hover{transform: translateY(-2px); border-color: rgba(155,214,255,.20)}

/* left steel stripe */
.reg::after{
  content:"";
  position:absolute;left:0;top:0;bottom:0;width:6px;
  background: linear-gradient(180deg, rgba(155,214,255,.55), rgba(74,163,255,.25));
  opacity:.7;
}
.reg::before{
  content:"";
  position:absolute;inset:-40%;
  background:
    radial-gradient(circle at var(--mx,50%) var(--my,0%), rgba(74,163,255,.12), transparent 60%),
    radial-gradient(circle at calc(var(--mx,50%) + 10%) calc(var(--my,0%) + 10%), rgba(216,182,106,.08), transparent 62%);
  opacity:0;transition:opacity .18s ease-out;
}
.reg:hover::before{opacity:1}

.reg__head{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
}
.reg__tagwrap{
  display:flex;align-items:center;gap:10px;
}
.reg__tag{
  font-weight:950;letter-spacing:.06em;
  color: rgba(217,240,255,.92);
  font-size:.88rem;
  padding:6px 10px;border-radius:999px;
  border:1px solid rgba(185,199,214,.14);
  background: rgba(2,6,17,.30);
}
.reg__flag{opacity:.95;font-size:1.05rem}

.reg__name{
  margin:10px 0 10px;
  font-weight:950;
  letter-spacing:-.01em;
}

.reg__meta{
  display:flex;gap:8px;flex-wrap:wrap;
  color: rgba(185,199,214,.78);
  font-size:.78rem;
  text-transform:uppercase;
  letter-spacing:.12em;
}
.reg__meta span{
  padding:5px 8px;border-radius:999px;
  border:1px solid rgba(185,199,214,.12);
  background: rgba(2,6,17,.24);
}

.reg__chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:10px}
.chip{
  display:inline-flex;align-items:center;
  padding:5px 9px;border-radius:999px;
  border:1px solid rgba(185,199,214,.14);
  background: rgba(2,6,17,.22);
  color: rgba(185,199,214,.82);
  font-size:.74rem;font-weight:950;
}
.chip--warden{border-color: rgba(155,214,255,.18); color: rgba(217,240,255,.90)}
.chip--brass{border-color: rgba(216,182,106,.22); color: rgba(240,215,155,.92)}

/* NOTE */
.note{
  margin-top:16px;
  border-radius: var(--rad);
  border:1px solid rgba(185,199,214,.14);
  background: rgba(7,18,36,.28);
  padding:14px;
}
.note__title{font-weight:950}
.note__text{color:rgba(185,199,214,.78);margin-top:6px}

/* OPS / WAR ECO */
.showcase{
  margin-top:20px;
  display:grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap:14px;
}
.shot{
  border-radius: var(--rad);
  border:1px solid rgba(185,199,214,.14);
  background: linear-gradient(145deg, rgba(7,18,36,.62), rgba(6,16,31,.52));
  box-shadow: var(--shadow);
  padding:16px;
  position:relative;overflow:hidden;
}
.shot::before{
  content:"";position:absolute;inset:-40%;
  background: radial-gradient(circle at var(--mx,50%) var(--my,0%), rgba(74,163,255,.12), transparent 60%);
  opacity:0;transition:opacity .18s ease-out;
}
.shot:hover::before{opacity:1}

.shot__badge{
  display:inline-flex;width:max-content;
  padding:5px 10px;border-radius:999px;
  border:1px solid rgba(155,214,255,.18);
  background: rgba(74,163,255,.10);
  color: rgba(217,240,255,.92);
  font-weight:950;letter-spacing:.10em;font-size:.72rem;
}
.shot h3{margin:8px 0 0}
.shot p{margin:6px 0 10px;color:rgba(185,199,214,.78)}
.shot__meta{display:flex;flex-wrap:wrap;gap:8px;color:rgba(185,199,214,.78);font-size:.78rem;letter-spacing:.10em;text-transform:uppercase}
.shot__meta span{opacity:.85}

.pipeline{
  margin-top:20px;
  display:grid;
  grid-template-columns: repeat(5,minmax(0,1fr));
  gap:10px;
}
.pipe{
  border-radius: var(--rad);
  border:1px solid rgba(185,199,214,.14);
  background: rgba(7,18,36,.30);
  padding:14px;
  position:relative;overflow:hidden;
}
.pipe__n{font-weight:950;font-size:1.05rem;color:var(--warden2)}
.pipe h3{margin:6px 0 6px}
.pipe p{margin:0;color:rgba(185,199,214,.78);font-size:.9rem}

.board{
  margin-top:16px;
  border-radius: var(--rad);
  border:1px solid rgba(185,199,214,.14);
  background: linear-gradient(145deg, rgba(7,18,36,.62), rgba(6,16,31,.52));
  box-shadow: var(--shadow);
  padding:14px;
}
.board__head{display:flex;align-items:center;justify-content:space-between;gap:10px}
.board__grid{
  margin-top:12px;
  display:grid;grid-template-columns: repeat(3,minmax(0,1fr));
  gap:10px;
}
.order{
  border-radius: 16px;
  border:1px solid rgba(185,199,214,.12);
  background: rgba(2,6,17,.22);
  padding:12px;
}
.order__t{font-weight:950;margin-bottom:8px}
.order__m{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:8px}
.tag{
  padding:4px 8px;border-radius:999px;
  border:1px solid rgba(185,199,214,.12);
  color:rgba(185,199,214,.78);font-size:.74rem;font-weight:950;
}
.order__s{
  font-weight:950;font-size:.82rem;letter-spacing:.04em;
  padding:7px 10px;border-radius:999px;width:max-content;
}
.s-open{border:1px solid rgba(155,214,255,.18);background: rgba(74,163,255,.10);color:rgba(217,240,255,.92)}
.s-progress{border:1px solid rgba(216,182,106,.22);background: rgba(216,182,106,.10);color:rgba(240,215,155,.92)}
.s-done{border:1px solid rgba(155,214,255,.16);background: rgba(155,214,255,.08);color:rgba(217,240,255,.92)}

/* JOIN + FOOTER */
.join{
  margin-top:18px;
  display:grid;
  grid-template-columns: minmax(0,1.1fr) minmax(0,1fr);
  gap:14px;
}
.card,.panel{
  border-radius: var(--rad);
  border:1px solid rgba(185,199,214,.14);
  background: linear-gradient(145deg, rgba(7,18,36,.62), rgba(6,16,31,.52));
  box-shadow: var(--shadow);
  padding:16px;
}
.panel--ghost{background: rgba(7,18,36,.28); box-shadow:none;}
.steps{margin:10px 0 0;padding-left:18px;color:rgba(217,240,255,.86)}
.steps li{margin:10px 0}
.divider{
  height:1px;margin:14px 0;
  background: linear-gradient(90deg, transparent, rgba(185,199,214,.22), transparent);
}
.contact{margin-top:10px;display:flex;flex-direction:column;gap:8px}
.contact__row{display:flex;justify-content:space-between;gap:10px}
.contact__k{color:rgba(185,199,214,.78);font-weight:950}
.contact__v{color:rgba(217,240,255,.88)}

.footer{
  border-top:1px solid rgba(185,199,214,.10);
  background: rgba(2,6,17,.65);
}
.footer__inner{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:16px 0}
.footer__brand{font-weight:950}
.footer__links{display:flex;gap:14px;color:rgba(185,199,214,.78);font-size:.86rem}
.footer__links a:hover{color:var(--ice)}

.to-top{
  position:fixed;right:18px;bottom:18px;z-index:60;
  width:42px;height:42px;border-radius:999px;
  border:1px solid rgba(185,199,214,.14);
  background: rgba(7,18,36,.52);
  color:var(--ice);
  display:flex;align-items:center;justify-content:center;
  opacity:0;pointer-events:none;transform: translateY(8px);
  transition: .22s ease-out;
  box-shadow: var(--glow);
}
.to-top.is-on{opacity:1;pointer-events:auto;transform: translateY(0)}

.reveal{
  opacity:0;transform: translateY(14px);
  transition: opacity .55s ease-out, transform .55s ease-out;
}
.reveal.is-in{opacity:1; transform: translateY(0)}

@media (max-width: 1060px){
  .hero__inner{grid-template-columns: 1fr}
  .hero__highlights{grid-template-columns: 1fr}
  .stats{grid-template-columns: 1fr}
  .tiles{grid-template-columns: 1fr}
  .reg-grid{grid-template-columns: 1fr}
  .showcase{grid-template-columns: 1fr}
  .pipeline{grid-template-columns: 1fr}
  .board__grid{grid-template-columns: 1fr}
  .join{grid-template-columns: 1fr}
  .topbar__cta{display:none}
  .nav__toggle{display:flex}
  .nav__panel{
    position:absolute;right:0;top:50px;
    display:flex;flex-direction:column;gap:6px;
    padding:10px;border-radius:18px;
    background: rgba(2,6,17,.92);
    border:1px solid rgba(185,199,214,.14);
    box-shadow: var(--shadow);
    opacity:0;pointer-events:none;transform: translateY(-6px);
    transition: .18s ease-out;
    width: min(280px, 86vw);
  }
  .nav__panel.is-open{opacity:1;pointer-events:auto;transform: translateY(0)}
}
@media (max-width: 560px){
  .brand{min-width:auto}
  .brand__text{display:none}
}
/* --- REGIMENT DIRECTORY CONTROLS --- */
.reg-controls{
  margin-top:18px;
  display:flex;gap:12px;align-items:center;justify-content:space-between;flex-wrap:wrap;
}

.reg-controls__left{
  display:flex;gap:10px;align-items:center;flex-wrap:wrap;
}

.view{
  display:inline-flex;gap:6px;padding:6px;border-radius:999px;
  border:1px solid rgba(185,199,214,.14);
  background: rgba(7,18,36,.30);
}
.view__btn{
  border:none;cursor:pointer;
  padding:8px 10px;border-radius:999px;
  background: transparent;color: rgba(185,199,214,.78);
  font-weight:950;font-size:.82rem;
  transition: .18s ease-out;
}
.view__btn:hover{color:var(--ice)}
.view__btn.is-on{
  background: radial-gradient(circle at 30% 20%, rgba(155,214,255,.14), rgba(7,18,36,.55));
  color:var(--warden2);
  border:1px solid rgba(155,214,255,.18);
}

.sort{
  display:flex;gap:8px;align-items:center;
  padding:6px 10px;border-radius:999px;
  border:1px solid rgba(185,199,214,.14);
  background: rgba(7,18,36,.30);
}
.sort__label{font-size:.78rem;color:rgba(185,199,214,.78);font-weight:900;letter-spacing:.08em;text-transform:uppercase}
.sort__select{
  border-radius:999px;
  border:1px solid rgba(185,199,214,.14);
  background: rgba(2,6,17,.20);
  color: var(--ice);
  padding:8px 10px;
  outline:none;
}

/* --- REGIMENT DIRECTORY --- */
.reg-grid{
  margin-top:16px;
  display:grid;
  gap:12px;
}

/* GRID mode */
.reg-grid[data-view="grid"]{
  grid-template-columns: repeat(3,minmax(0,1fr));
}

/* LIST mode */
.reg-grid[data-view="list"]{
  grid-template-columns: 1fr;
}

/* Regiment card (dossier) */
.reg{
  border-radius: var(--rad);
  border:1px solid rgba(185,199,214,.14);
  background: linear-gradient(145deg, rgba(7,18,36,.62), rgba(6,16,31,.52));
  box-shadow: var(--shadow);
  padding:14px;
  position:relative;
  overflow:hidden;
  transition: transform .12s ease-out, border-color .18s ease-out;
}
.reg:hover{transform: translateY(-2px); border-color: rgba(155,214,255,.20)}

.reg::after{
  content:"";
  position:absolute;left:0;top:0;bottom:0;width:6px;
  background: linear-gradient(180deg, rgba(155,214,255,.55), rgba(74,163,255,.25));
  opacity:.7;
}

.reg__head{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
}
.reg__tag{
  font-weight:950;letter-spacing:.06em;
  color: rgba(217,240,255,.92);
  font-size:.88rem;
  padding:6px 10px;border-radius:999px;
  border:1px solid rgba(185,199,214,.14);
  background: rgba(2,6,17,.30);
}
.reg__flag{opacity:.95;font-size:1.05rem}

.reg__name{margin:10px 0 8px;font-weight:950;letter-spacing:-.01em}

.reg__line{
  display:flex;gap:8px;flex-wrap:wrap;
  color: rgba(185,199,214,.78);
  font-size:.78rem;
  letter-spacing:.10em;
  text-transform:uppercase;
}
.reg__line span{
  padding:5px 8px;border-radius:999px;
  border:1px solid rgba(185,199,214,.12);
  background: rgba(2,6,17,.22);
}

/* status chips */
.st{
  font-weight:950;font-size:.74rem;
  padding:5px 9px;border-radius:999px;
  border:1px solid rgba(185,199,214,.14);
  background: rgba(2,6,17,.22);
}
.st--core{border-color: rgba(216,182,106,.22); color: rgba(240,215,155,.92)}
.st--member{border-color: rgba(155,214,255,.18); color: rgba(217,240,255,.92)}
.st--partner{border-color: rgba(185,199,214,.18); color: rgba(185,199,214,.86)}

.reg__actions{
  margin-top:10px;
  display:flex;gap:10px;flex-wrap:wrap;
}
.reg__link{
  display:inline-flex;align-items:center;justify-content:center;
  padding:9px 12px;border-radius:999px;
  border:1px solid rgba(185,199,214,.14);
  background: rgba(7,18,36,.30);
  color: rgba(217,240,255,.92);
  font-weight:900;font-size:.84rem;
}
.reg__link:hover{border-color: rgba(155,214,255,.20); background: rgba(7,18,36,.45)}

@media (max-width: 1060px){
  .reg-grid[data-view="grid"]{grid-template-columns: 1fr;}
}
/* --- REGIMENTS: ROSTER BOARD LAYOUT --- */
.roster{
  margin-top:18px;
  display:grid;
  grid-template-columns: 360px minmax(0,1fr);
  gap:14px;
  align-items:start;
}

.roster__panel{
  border-radius: var(--rad);
  border:1px solid rgba(185,199,214,.14);
  background: linear-gradient(145deg, rgba(7,18,36,.62), rgba(6,16,31,.52));
  box-shadow: var(--shadow);
  padding:14px;
}

.roster__panel--compact summary{
  cursor:pointer;
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}
.roster__panel--compact summary::-webkit-details-marker{display:none}
.roster__panel--compact[open] summary{margin-bottom:10px}

.roster__panel-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
}

.roster__split{
  height:1px;
  margin:12px 0;
  background: linear-gradient(90deg, transparent, rgba(185,199,214,.22), transparent);
}

.roster__counts{
  margin-top:12px;
  display:grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap:10px;
}

.rc{
  border-radius:16px;
  border:1px solid rgba(185,199,214,.12);
  background: rgba(2,6,17,.22);
  padding:10px 12px;
}
.rc__k{font-size:.78rem;color:rgba(185,199,214,.74);letter-spacing:.12em;text-transform:uppercase;font-weight:900}
.rc__v{margin-top:6px;font-size:1.4rem;font-weight:950;color:var(--warden2)}

.roster__status{display:flex;flex-direction:column;gap:10px}
.rs{
  display:grid;
  grid-template-columns: auto 1fr auto;
  gap:10px;
  align-items:center;
}
.rs__n{
  font-weight:950;
  color:rgba(217,240,255,.92);
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(185,199,214,.12);
  background: rgba(2,6,17,.22);
}

.roster__tip{
  color:rgba(185,199,214,.82);
  font-size:.9rem;
  line-height:1.4;
}

.roster__actions{margin-top:12px;display:flex;flex-direction:column;gap:10px}

.roster__list{line-height:1.55}

.roster__main .reg-controls{margin-top:0}

@media (max-width: 1060px){
  .roster{grid-template-columns: 1fr}
}
/* --- regiment card with logo --- */
.reg.reg--logo{
  padding:12px 14px;
}

.reg__row{
  display:grid;
  grid-template-columns: 56px 1fr auto;
  gap:12px;
  align-items:center;
}

.reg__left{display:flex;align-items:center;justify-content:center}

.reg__logo{
  width:56px;height:56px;
  border-radius:16px;
  object-fit:cover;
  border:1px solid rgba(185,199,214,.16);
  background: rgba(2,6,17,.35);
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
}

.reg__logo--ph{
  width:56px;height:56px;
  border-radius:16px;
  border:1px solid rgba(185,199,214,.16);
  background:
    radial-gradient(circle at 30% 20%, rgba(155,214,255,.18), rgba(2,6,17,.25));
}

.reg__mid{min-width:0}
.reg__top{
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
}

.reg__right{display:flex;align-items:center;justify-content:flex-end}

.reg__name{
  margin:8px 0 6px;
  font-weight:950;
}

.reg__line{
  display:flex;gap:8px;flex-wrap:wrap;
  color: rgba(185,199,214,.78);
  font-size:.78rem;
  letter-spacing:.10em;
  text-transform:uppercase;
}

/* list view looks more "directory" */
.reg-grid[data-view="list"] .reg__row{
  grid-template-columns: 64px 1fr auto;
}
@media (max-width: 680px){
  .reg__row{
    grid-template-columns: 56px 1fr;
  }
  .reg__right{
    grid-column: 1 / -1;
    justify-content:flex-start;
    margin-top:10px;
  }
}
/* =========================
   REGIMENTS — CLEAN ROSTER
   ========================= */

.reg-legend{
  margin-top:10px;
  display:flex;
  gap:10px;
  flex-wrap:wrap;
  align-items:center;
}

/* GRID = patch wall */
.reg-grid{
  margin-top:14px;
  display:grid;
  gap:12px;
}
.reg-grid[data-view="grid"]{
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
@media (max-width: 1100px){
  .reg-grid[data-view="grid"]{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 820px){
  .reg-grid[data-view="grid"]{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* LIST = directory rows */
.reg-grid[data-view="list"]{
  grid-template-columns: 1fr;
}

/* shared item */
.reg-item{
  border-radius: var(--rad);
  border:1px solid rgba(185,199,214,.14);
  background: linear-gradient(145deg, rgba(7,18,36,.62), rgba(6,16,31,.50));
  box-shadow: var(--shadow);
  position:relative;
  overflow:hidden;
  transition: transform .12s ease-out, border-color .18s ease-out, background .18s ease-out;
}
.reg-item:hover{ transform: translateY(-2px); border-color: rgba(155,214,255,.22); }

.reg-item::after{
  content:"";
  position:absolute;left:0;top:0;bottom:0;width:4px;
  background: linear-gradient(180deg, rgba(155,214,255,.55), rgba(74,163,255,.18));
  opacity:.75;
}

/* GRID card layout */
.reg-grid[data-view="grid"] .reg-item{
  padding:12px;
  min-height: 110px;
  display:flex;
  gap:12px;
  align-items:center;
}

.reg-logo{
  width:52px;height:52px;
  border-radius:16px;
  object-fit:cover;
  border:1px solid rgba(185,199,214,.16);
  background: rgba(2,6,17,.22);
  flex: 0 0 auto;
}
.reg-logo--ph{
  width:52px;height:52px;border-radius:16px;
  border:1px solid rgba(185,199,214,.16);
  background: radial-gradient(circle at 30% 20%, rgba(155,214,255,.18), rgba(2,6,17,.20));
  flex: 0 0 auto;
}

.reg-main{ min-width:0; flex:1; }
.reg-top{
  display:flex; gap:8px; align-items:center; flex-wrap:wrap;
}
.reg-tag{
  font-weight:950;
  letter-spacing:.06em;
  color: rgba(217,240,255,.92);
  font-size:.85rem;
}
.reg-name{
  margin-top:6px;
  font-weight:950;
  line-height:1.15;
  letter-spacing:-.01em;
  color: rgba(233,248,255,.95);
  text-wrap: balance;
}
.reg-meta{
  margin-top:8px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
  color: rgba(185,199,214,.78);
  font-size:.75rem;
  letter-spacing:.10em;
  text-transform:uppercase;
}
.reg-meta span{
  padding:5px 8px;
  border-radius:999px;
  border:1px solid rgba(185,199,214,.12);
  background: rgba(2,6,17,.18);
}

/* LIST row layout (clean directory) */
.reg-grid[data-view="list"] .reg-item{
  padding:12px 14px;
}
.reg-row{
  display:grid;
  grid-template-columns: 56px 1fr auto;
  gap:12px;
  align-items:center;
}
@media (max-width: 680px){
  .reg-row{ grid-template-columns: 56px 1fr; }
  .reg-actions{ grid-column: 1 / -1; justify-content:flex-start; }
}

.reg-actions{
  display:flex;
  gap:10px;
  justify-content:flex-end;
  align-items:center;
  flex-wrap:wrap;
}
.reg-link{
  display:inline-flex;align-items:center;justify-content:center;
  padding:9px 12px;border-radius:999px;
  border:1px solid rgba(185,199,214,.14);
  background: rgba(7,18,36,.32);
  color: rgba(217,240,255,.92);
  font-weight:900;font-size:.84rem;
}
.reg-link:hover{ border-color: rgba(155,214,255,.22); background: rgba(7,18,36,.48); }
/* =========================
   REGIMENTS — ROSTER CARDS
   ========================= */

.reg-grid{
  margin-top:14px;
  display:grid;
  gap:12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
@media (max-width: 1100px){
  .reg-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 820px){
  .reg-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px){
  .reg-grid{ grid-template-columns: 1fr; }
}

.reg-item{
  border-radius: var(--rad);
  border:1px solid rgba(185,199,214,.14);
  background: linear-gradient(145deg, rgba(7,18,36,.66), rgba(6,16,31,.50));
  box-shadow: var(--shadow);
  position:relative;
  overflow:hidden;
  padding:14px 14px 12px;
  min-height: 152px;
  transition: transform .12s ease-out, border-color .18s ease-out;
}
.reg-item:hover{ transform: translateY(-2px); border-color: rgba(155,214,255,.22); }

.reg-item::after{
  content:"";
  position:absolute;left:0;top:0;bottom:0;width:4px;
  background: linear-gradient(180deg, rgba(155,214,255,.60), rgba(74,163,255,.18));
  opacity:.80;
}

/* top bar */
.reg-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
}

.reg-tag{
  font-weight:950;
  letter-spacing:.08em;
  font-size:.86rem;
  color: rgba(233,248,255,.95);
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
}

.reg-status{
  transform: translateY(-1px);
}

/* logo patch in top-right */
.reg-logo{
  width:44px;height:44px;
  border-radius:14px;
  object-fit:cover;
  border:1px solid rgba(185,199,214,.18);
  background: rgba(2,6,17,.22);
  box-shadow: 0 10px 30px rgba(0,0,0,.25);
  flex:0 0 auto;
}
.reg-logo--ph{
  width:44px;height:44px;border-radius:14px;
  border:1px solid rgba(185,199,214,.18);
  background: radial-gradient(circle at 30% 20%, rgba(155,214,255,.18), rgba(2,6,17,.20));
}

/* title */
.reg-name{
  margin-top:12px;
  font-weight:950;
  line-height:1.15;
  letter-spacing:-.01em;
  color: rgba(233,248,255,.96);
  font-size:1.05rem;
  text-wrap: balance;
}

/* meta chips */
.reg-meta{
  margin-top:10px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.reg-meta .chip{
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(185,199,214,.12);
  background: rgba(2,6,17,.18);
  color: rgba(185,199,214,.85);
  font-size:.74rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-weight:900;
}

/* CTA */
.reg-actions{
  margin-top:12px;
  display:flex;
  justify-content:flex-end;
}

.reg-link{
  display:inline-flex;align-items:center;justify-content:center;
  padding:9px 12px;border-radius:999px;
  border:1px solid rgba(185,199,214,.14);
  background: rgba(7,18,36,.32);
  color: rgba(217,240,255,.92);
  font-weight:900;font-size:.84rem;
}
.reg-link:hover{ border-color: rgba(155,214,255,.22); background: rgba(7,18,36,.48); }
/* =========================
   REGIMENTS — CLEAN ROSTER v2
   ========================= */

.reg-grid{
  margin-top:14px;
  display:grid;
  gap:12px;
  /* 3 sloupce = víc prostoru pro názvy → méně “divné” zalamování */
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

@media (max-width: 1050px){
  .reg-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px){
  .reg-grid{ grid-template-columns: 1fr; }
}

.reg-item{
  position:relative;
  border-radius: var(--rad);
  border:1px solid rgba(185,199,214,.14);
  background: linear-gradient(145deg, rgba(7,18,36,.66), rgba(6,16,31,.50));
  box-shadow: var(--shadow);
  overflow:hidden;
  padding:14px 14px 12px;
  min-height: 148px;
  transition: transform .12s ease-out, border-color .18s ease-out;
}
.reg-item:hover{
  transform: translateY(-2px);
  border-color: rgba(155,214,255,.24);
}

.reg-item::after{
  content:"";
  position:absolute;left:0;top:0;bottom:0;width:4px;
  background: linear-gradient(180deg, rgba(155,214,255,.60), rgba(74,163,255,.18));
  opacity:.80;
}

/* LOGO patch vpravo nahoře (malý, nenarušuje layout) */
.reg-logo{
  position:absolute;
  top:12px; right:12px;
  width:40px; height:40px;
  border-radius:14px;
  object-fit:cover;
  border:1px solid rgba(185,199,214,.18);
  background: rgba(2,6,17,.22);
  box-shadow: 0 10px 26px rgba(0,0,0,.25);
}
.reg-logo--ph{
  position:absolute;
  top:12px; right:12px;
  width:40px; height:40px;
  border-radius:14px;
  border:1px solid rgba(185,199,214,.18);
  background: radial-gradient(circle at 30% 20%, rgba(155,214,255,.18), rgba(2,6,17,.20));
}

/* header */
.reg-head{
  display:flex;
  align-items:center;
  gap:10px;
  padding-right:56px; /* místo pro logo patch */
}
.reg-tag{
  font-weight:950;
  letter-spacing:.08em;
  font-size:.86rem;
  color: rgba(233,248,255,.95);
}
.reg-status{ transform: translateY(-1px); }

/* title */
.reg-name{
  margin-top:10px;
  padding-right:56px; /* místo pro logo patch */
  font-weight:950;
  font-size:1.06rem;
  line-height:1.15;
  letter-spacing:-.01em;
  color: rgba(233,248,255,.96);

  display:-webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow:hidden;
}

/* meta chips pod názvem */
.reg-meta{
  margin-top:10px;
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}
.reg-meta .chip{
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(185,199,214,.12);
  background: rgba(2,6,17,.18);
  color: rgba(185,199,214,.85);
  font-size:.72rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  font-weight:900;
}

/* actions */
.reg-actions{
  position:absolute;
  left:14px;
  bottom:12px;
  right:14px;
  display:flex;
  justify-content:flex-end;
}
.reg-link{
  display:inline-flex;align-items:center;justify-content:center;
  padding:9px 12px;border-radius:999px;
  border:1px solid rgba(185,199,214,.14);
  background: rgba(7,18,36,.32);
  color: rgba(217,240,255,.92);
  font-weight:900;font-size:.84rem;
}
.reg-link:hover{
  border-color: rgba(155,214,255,.22);
  background: rgba(7,18,36,.48);
}
/* =========================
   REGIMENTS — PATCH WALL
   ========================= */

.reg-grid{
  margin-top:14px;
  display:grid;
  gap:12px;
  grid-template-columns: repeat(4, minmax(0, 1fr));
}
@media (max-width: 1100px){
  .reg-grid{ grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 820px){
  .reg-grid{ grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px){
  .reg-grid{ grid-template-columns: 1fr; }
}

/* compact tile */
.reg-tile{
  position:relative;
  border-radius: 18px;
  border:1px solid rgba(185,199,214,.14);
  background:
    radial-gradient(120% 120% at 20% 0%, rgba(155,214,255,.10), rgba(0,0,0,0) 55%),
    linear-gradient(145deg, rgba(7,18,36,.62), rgba(6,16,31,.48));
  box-shadow: var(--shadow);
  overflow:hidden;
  padding:12px;
  min-height: 86px;
  display:flex;
  gap:12px;
  align-items:center;
  transition: transform .12s ease-out, border-color .18s ease-out;
}
.reg-tile:hover{
  transform: translateY(-2px);
  border-color: rgba(155,214,255,.24);
}

/* left patch */
.reg-tile__logo{
  width:56px;height:56px;
  border-radius: 18px;
  object-fit:cover;
  border:1px solid rgba(185,199,214,.18);
  background: rgba(2,6,17,.22);
  box-shadow: 0 10px 26px rgba(0,0,0,.25);
  flex:0 0 auto;
}
.reg-tile__logo--ph{
  width:56px;height:56px;
  border-radius:18px;
  border:1px solid rgba(185,199,214,.18);
  background: radial-gradient(circle at 30% 20%, rgba(155,214,255,.18), rgba(2,6,17,.20));
  flex:0 0 auto;
}

/* content */
.reg-tile__body{
  min-width:0;
  flex:1;
}
.reg-tile__tag{
  display:inline-flex;
  align-items:center;
  gap:8px;
  font-weight:950;
  letter-spacing:.10em;
  text-transform:uppercase;
  font-size:.74rem;
  color: rgba(217,240,255,.90);
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(185,199,214,.12);
  background: rgba(2,6,17,.18);
}
.reg-tile__name{
  margin-top:8px;
  font-weight:950;
  color: rgba(233,248,255,.96);
  line-height:1.12;
  letter-spacing:-.01em;
  font-size: .98rem;

  display:-webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow:hidden;
}

/* subtle left accent */
.reg-tile::before{
  content:"";
  position:absolute;left:0;top:0;bottom:0;width:4px;
  background: linear-gradient(180deg, rgba(155,214,255,.55), rgba(74,163,255,.16));
  opacity:.85;
}

/* optional: status tint (keeps it minimal, no extra text) */
.reg-tile[data-status="core"]::before{
  background: linear-gradient(180deg, rgba(255,217,128,.62), rgba(255,217,128,.12));
}
.reg-tile[data-status="partner"]::before{
  background: linear-gradient(180deg, rgba(185,199,214,.40), rgba(185,199,214,.10));
}
.reg-tile__tag{
  display:inline-flex;
  align-items:center;
  gap:8px;
}

.reg-tile__tag .fi{
  border-radius:4px;
  box-shadow: 0 6px 16px rgba(0,0,0,.18);
  transform: translateY(-.5px);
}
/* =========================
   CSU FORM — Chieftain page
   ========================= */

.csu-form{
  margin-top: 8px;
  display:flex;
  flex-direction:column;
  gap:14px;
}

.csu-form__grid{
  display:grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap:12px;
}

.csu-field{display:flex;flex-direction:column;gap:8px}
.csu-field--full{grid-column: 1 / -1}

.csu-field__label{
  font-weight:950;
  font-size:.82rem;
  letter-spacing:.10em;
  text-transform:uppercase;
  color: rgba(155,214,255,.92);
}

.csu-field__hint{
  font-size:.78rem;
  color: rgba(185,199,214,.70);
}

.csu-field__input{
  width:100%;
  padding:12px 12px;
  border-radius: 16px;
  border:1px solid rgba(185,199,214,.14);
  background:
    radial-gradient(circle at 20% 10%, rgba(74,163,255,.10), transparent 60%),
    rgba(2,6,17,.25);
  color: var(--ice);
  outline: none;
  box-shadow: 0 10px 35px rgba(0,0,0,.22);
  transition: border-color .18s ease-out, box-shadow .18s ease-out, transform .12s ease-out;
}

.csu-field__input::placeholder{color: rgba(185,199,214,.55)}

.csu-field__input:focus{
  border-color: rgba(155,214,255,.26);
  box-shadow:
    0 0 0 3px rgba(74,163,255,.10),
    0 0 45px rgba(74,163,255,.14);
  transform: translateY(-1px);
}

.csu-field__textarea{
  resize: vertical;
  min-height: 132px;
  line-height: 1.45;
}

/* valid/invalid (jemně, bez agresivních barev) */
.csu-form :is(input,textarea):invalid:focus{
  border-color: rgba(216,182,106,.35);
  box-shadow: 0 0 0 3px rgba(216,182,106,.10);
}

.csu-form__actions{
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:space-between;
  flex-wrap:wrap;
  margin-top: 2px;
}

.csu-form__status{
  flex: 1;
  min-width: 220px;
  padding:10px 12px;
  border-radius: 16px;
  border:1px solid rgba(185,199,214,.12);
  background: rgba(7,18,36,.28);
  color: rgba(185,199,214,.82);
}

/* status variants (přepneme class v JS) */
.csu-form__status.is-ok{
  border-color: rgba(155,214,255,.18);
  background: rgba(74,163,255,.10);
  color: rgba(217,240,255,.92);
}
.csu-form__status.is-warn{
  border-color: rgba(216,182,106,.22);
  background: rgba(216,182,106,.10);
  color: rgba(240,215,155,.92);
}

/* mobil */
@media (max-width: 720px){
  .csu-form__grid{grid-template-columns: 1fr}
  .csu-form__actions{align-items:stretch}
  .csu-form__actions .btn{width:100%}
  .csu-form__status{min-width: 0}
}

.brand__mark--logo{
  width:46px;
  height:46px;
  border-radius:50%;
  overflow:hidden;
  flex-shrink:0;

  background: none;
  box-shadow: none;
}

.brand__mark--logo img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;

  filter:
    drop-shadow(0 0 6px rgba(74,163,255,.35))
    drop-shadow(0 0 14px rgba(74,163,255,.25));
}

.brand:hover .brand__mark--logo{
  filter:
    drop-shadow(0 0 10px rgba(155,214,255,.45))
    drop-shadow(0 0 22px rgba(155,214,255,.35));
}

@media (max-width:720px){
  .brand__mark--logo{
    width:30px;
    height:30px;
  }

  .brand__mark--logo img{
    filter:
      drop-shadow(0 0 2px rgba(74,163,255,.2))
      drop-shadow(0 0 6px rgba(74,163,255,.15));
  }
}

@media (max-width:720px){
  .topbar .brand__mark--logo{
    width: 26px !important;
    height: 26px !important;
  }
  .topbar .brand__mark--logo img{
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
  }
}

/* =========================
   POSTER CARD (replaces form)
   ========================= */
.poster{ padding: 0; overflow:hidden; }
.poster__grid{
  display:grid;
  grid-template-columns: minmax(0,1.15fr) minmax(0,.85fr);
  gap:0;
}

.poster__media{
  position:relative;
  background:
    radial-gradient(800px 420px at 20% 10%, rgba(74,163,255,.16), transparent 60%),
    rgba(2,6,17,.35);
  border-right:1px solid rgba(185,199,214,.14);
  min-height: 340px;
}

.poster__media img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
  transform: scale(1.02);
  filter:
    drop-shadow(0 0 18px rgba(74,163,255,.18))
    contrast(1.05) saturate(1.05);
}

.poster__shine{
  position:absolute; inset:0;
  background:
    radial-gradient(700px 280px at 30% 10%, rgba(155,214,255,.18), transparent 60%),
    linear-gradient(135deg, rgba(216,182,106,.08), transparent 45%);
  opacity:.9;
  pointer-events:none;
  mix-blend-mode: screen;
}

.poster__copy{
  padding:16px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

@media (max-width: 900px){
  .poster__grid{ grid-template-columns: 1fr; }
  .poster__media{
    border-right:none;
    border-bottom:1px solid rgba(185,199,214,.14);
    min-height: 260px;
  }
}
@media (max-width: 720px){
  .poster__media{
    max-height: 220px;
    width: 100%;
    object-fit: cover;
    opacity: .88;
    filter:
      saturate(.9)
      contrast(.95);
  }
}
.oracle-slider{
  position:relative;
  width:100%;
}

.oracle-slider__viewport{
  position:relative;
  overflow:hidden;
  border-radius: 18px;
  border:1px solid rgba(185,199,214,.14);
  background: rgba(2,6,17,.25);
  box-shadow: 0 20px 60px rgba(0,0,0,.35);
}

.oracle-slider__track{
  display:flex;
  transition: transform .45s ease;
  will-change: transform;
}

.oracle-slide{
  min-width:100%;
  margin:0;
}

.oracle-slide img{
  width:100%;
  height: 340px;
  object-fit: cover;
  display:block;
}

.oracle-slider__btn{
  position:absolute;
  top:50%;
  transform: translateY(-50%);
  width:42px;height:42px;
  border-radius:999px;
  border:1px solid rgba(185,199,214,.18);
  background: rgba(7,18,36,.55);
  color: rgba(217,240,255,.92);
  font-size:26px;
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  backdrop-filter: blur(10px);
}

.oracle-slider__btn--prev{ left:10px; }
.oracle-slider__btn--next{ right:10px; }

.oracle-slider__btn:hover{
  border-color: rgba(155,214,255,.22);
  background: rgba(7,18,36,.72);
}

.oracle-slider__dots{
  margin-top:10px;
  display:flex;
  gap:8px;
  justify-content:center;
  align-items:center;
}

.oracle-dot{
  width:8px;height:8px;
  border-radius:999px;
  border:1px solid rgba(185,199,214,.22);
  background: rgba(185,199,214,.22);
  cursor:pointer;
}

.oracle-dot.is-on{
  background: rgba(155,214,255,.75);
  border-color: rgba(155,214,255,.45);
  box-shadow: 0 0 16px rgba(74,163,255,.35);
}

/* mobil */
@media (max-width:720px){
  .oracle-slide img{ height: 220px; }
  .oracle-slider__btn{ width:38px;height:38px; }
}

/* reduced motion */
@media (prefers-reduced-motion: reduce){
  .oracle-slider__track{ transition:none; }
}