.drct{
  --dr-bg:#07111b;
  --dr-bg-2:#0a1520;
  --dr-bg-3:#0d1b28;
  --dr-panel:rgba(10,19,30,0.82);
  --dr-panel-2:rgba(12,22,34,0.94);
  --dr-surface:rgba(255,255,255,0.04);
  --dr-surface-2:rgba(255,255,255,0.06);
  --dr-line:rgba(124,234,255,0.12);
  --dr-line-2:rgba(198,168,94,0.14);
  --dr-text:#e9f1f7;
  --dr-soft:#a7bbca;
  --dr-muted:#7f97aa;
  --dr-cyan:#7ceaff;
  --dr-cyan-2:#00b8d9;
  --dr-gold:#c6a85e;
  --dr-gold-2:#e2c98b;
  --dr-shadow:0 28px 70px rgba(0,0,0,0.32);
  --dr-shadow-md:0 14px 34px rgba(0,0,0,0.22);
  --dr-radius:24px;
  --dr-radius-sm:16px;
  --dr-max:1520px;
  --dr-speed:.28s;
}

.drct,
.drct *{
  box-sizing:border-box;
}

.drct{
  position:relative;
  left:50%;
  right:50%;
  width:100vw;
  max-width:100vw;
  margin-left:-50vw;
  margin-right:-50vw;
  color:var(--dr-text);
  background:
    radial-gradient(ellipse 44% 36% at 8% 8%, rgba(0,184,217,0.09), transparent 52%),
    radial-gradient(ellipse 32% 24% at 90% 12%, rgba(198,168,94,0.08), transparent 55%),
    radial-gradient(ellipse 30% 28% at 50% 80%, rgba(124,234,255,0.04), transparent 60%),
    linear-gradient(180deg, #060f18 0%, #09141f 48%, #0c1825 100%);
  overflow:hidden;
  border-top:1px solid rgba(255,255,255,0.04);
  border-bottom:1px solid rgba(255,255,255,0.04);
}

.drct::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(rgba(124,234,255,0.026) 1px, transparent 1px),
    linear-gradient(90deg, rgba(124,234,255,0.026) 1px, transparent 1px);
  background-size:32px 32px;
  mask-image:linear-gradient(180deg, rgba(0,0,0,0.72), rgba(0,0,0,0.18));
  opacity:.42;
}

.drct::after{
  content:"";
  position:absolute;
  inset:-20%;
  pointer-events:none;
  background:
    radial-gradient(circle at 20% 18%, rgba(124,234,255,0.08), transparent 18%),
    radial-gradient(circle at 78% 22%, rgba(198,168,94,0.06), transparent 16%),
    radial-gradient(circle at 42% 72%, rgba(124,234,255,0.04), transparent 20%);
  filter:blur(70px);
  opacity:.75;
  animation:drctFloat 18s ease-in-out infinite alternate;
}

@keyframes drctFloat{
  from{transform:translate3d(0,0,0) scale(1)}
  to{transform:translate3d(0,-18px,0) scale(1.03)}
}

.drct a{
  text-decoration:none;
  color:inherit;
}

.drct-shell{
  position:relative;
  z-index:2;
  max-width:var(--dr-max);
  margin:0 auto;
  padding:0 28px 78px;
}

.drct-progress{
  position:fixed;
  top:0;
  left:0;
  height:2px;
  width:100%;
  z-index:9999;
  transform-origin:left;
  transform:scaleX(var(--dr-scroll,0));
  background:linear-gradient(90deg, var(--dr-cyan), var(--dr-cyan-2), var(--dr-gold));
  box-shadow:0 0 18px rgba(124,234,255,0.4);
  pointer-events:none;
}

.drct-topbar{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
  padding:22px 0 6px;
}

.drct-topbar-group{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.drct-chip,
.drct-nav-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:40px;
  padding:10px 14px;
  border-radius:999px;
  border:1px solid rgba(124,234,255,0.12);
  background:rgba(7,16,26,0.56);
  color:var(--dr-soft);
  font-family:Arial,sans-serif;
  font-size:10px;
  letter-spacing:2px;
  text-transform:uppercase;
  transition:all var(--dr-speed) ease;
  backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);
}

.drct-chip.is-live{
  color:var(--dr-cyan);
  border-color:rgba(124,234,255,0.2);
  box-shadow:inset 0 0 0 1px rgba(124,234,255,0.04), 0 0 0 1px rgba(124,234,255,0.02);
}

.drct-chip.is-live::before{
  content:"";
  width:7px;
  height:7px;
  margin-right:8px;
  border-radius:50%;
  background:var(--dr-cyan);
  box-shadow:0 0 14px rgba(124,234,255,0.6);
  animation:drctPulse 2s infinite;
}

@keyframes drctPulse{
  0%,100%{opacity:1;transform:scale(1)}
  50%{opacity:.55;transform:scale(.9)}
}

.drct-nav-btn:hover{
  color:var(--dr-text);
  transform:translateY(-2px);
  border-color:rgba(124,234,255,0.26);
  background:rgba(10,20,32,0.78);
}

.drct-hero{
  padding:22px 0 24px;
}

.drct-hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(380px,.92fr);
  gap:24px;
  align-items:stretch;
}

.drct-hero-main,
.drct-panel,
.drct-card,
.drct-pillar,
.drct-entry,
.drct-path,
.drct-mini,
.drct-quick-link,
.drct-cta,
.drct-stream-box,
.drct-status-tile,
.drct-quote{
  position:relative;
  overflow:hidden;
  border-radius:var(--dr-radius);
  border:1px solid rgba(124,234,255,0.1);
  background:linear-gradient(180deg, rgba(10,19,30,0.88), rgba(8,16,26,0.94));
  box-shadow:var(--dr-shadow);
}

.drct-hero-main{
  padding:54px 46px 36px;
  min-height:640px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.drct-hero-main::before,
.drct-panel::before,
.drct-card::after,
.drct-pillar::after,
.drct-entry::after,
.drct-path::after,
.drct-mini::after,
.drct-quick-link::after,
.drct-cta::before,
.drct-stream-box::after,
.drct-status-tile::after,
.drct-quote::after{
  content:"";
  position:absolute;
  top:0;
  left:0;
  right:0;
  height:2px;
  background:linear-gradient(90deg, transparent, var(--dr-cyan), var(--dr-gold), transparent);
  opacity:.9;
}

.drct-hero-main::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(circle at 84% 16%, rgba(198,168,94,0.1), transparent 16%),
    radial-gradient(circle at 18% 18%, rgba(124,234,255,0.08), transparent 18%);
}

.drct-eyebrow{
  position:relative;
  z-index:2;
  margin:0 0 16px;
  color:var(--dr-cyan);
  font-family:Arial,sans-serif;
  font-size:10px;
  letter-spacing:3px;
  text-transform:uppercase;
}

.drct-title{
  position:relative;
  z-index:2;
  margin:0 0 14px;
  font-family:"Playfair Display", Georgia, serif;
  font-size:clamp(3rem, 6vw, 6rem);
  line-height:.92;
  letter-spacing:-.045em;
  color:var(--dr-text);
  max-width:11ch;
}

.drct-subtitle{
  position:relative;
  z-index:2;
  margin:0 0 14px;
  color:#d6e0e8;
  font-size:1.12rem;
  line-height:1.8;
  max-width:62ch;
}

.drct-meta{
  position:relative;
  z-index:2;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin:0 0 24px;
}

.drct-meta span{
  position:relative;
  display:inline-flex;
  align-items:center;
  min-height:38px;
  padding:9px 12px;
  border-radius:999px;
  border:1px solid rgba(124,234,255,0.12);
  background:rgba(255,255,255,0.03);
  color:var(--dr-soft);
  font-family:Arial,sans-serif;
  font-size:10px;
  letter-spacing:1.8px;
  text-transform:uppercase;
  overflow:hidden;
  animation:drctChipFloat 6s ease-in-out infinite;
}

.drct-meta span:nth-child(2){animation-delay:.4s}
.drct-meta span:nth-child(3){animation-delay:.8s}
.drct-meta span:nth-child(4){animation-delay:1.2s}
.drct-meta span:nth-child(5){animation-delay:1.6s}

.drct-meta span::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(95,228,255,0.08), transparent 46%);
  pointer-events:none;
}

.drct-meta span::after{
  content:"";
  position:absolute;
  top:-30%;
  bottom:-30%;
  left:-42%;
  width:42%;
  background:linear-gradient(90deg, transparent, rgba(124,234,255,0.2), rgba(226,201,139,0.15), transparent);
  transform:translateX(-140%) skewX(-24deg);
  animation:drctChipSweep 5.8s linear infinite;
  pointer-events:none;
}

@keyframes drctChipSweep{
  0%{transform:translateX(-140%) skewX(-24deg);opacity:0}
  14%{opacity:.5}
  40%{opacity:.9}
  100%{transform:translateX(420%) skewX(-24deg);opacity:0}
}

@keyframes drctChipFloat{
  0%,100%{transform:translateY(0)}
  50%{transform:translateY(-2px)}
}

.drct-feature-strip{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin-top:8px;
  max-width:760px;
}

.drct-feature{
  position:relative;
  overflow:hidden;
  padding:14px;
  border-radius:18px;
  border:1px solid rgba(124,234,255,0.10);
  background:linear-gradient(180deg, rgba(15,24,39,0.96), rgba(11,18,29,0.99));
  box-shadow:var(--dr-shadow-md);
}

.drct-feature::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(135deg, rgba(95,228,255,0.05), transparent 46%);
}

.drct-feature-label{
  position:relative;
  z-index:2;
  font-family:Arial,sans-serif;
  font-size:9px;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--dr-cyan);
  margin-bottom:6px;
}

.drct-feature strong{
  position:relative;
  z-index:2;
  display:block;
  color:var(--dr-text);
  font-weight:600;
  line-height:1.5;
  font-size:14px;
}

.drct-hero-side{
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  gap:18px;
}

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

.drct-status-tile{
  padding:16px;
  min-height:122px;
  background:linear-gradient(180deg, rgba(13,24,38,0.96), rgba(10,18,29,0.98));
  box-shadow:var(--dr-shadow-md);
}

.drct-status-tile::before{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(135deg, rgba(95,228,255,0.05), transparent 46%);
  pointer-events:none;
}

.drct-status-kicker{
  position:relative;
  z-index:2;
  display:block;
  margin:0 0 8px;
  color:var(--dr-cyan);
  font-family:Arial,sans-serif;
  font-size:9px;
  letter-spacing:2px;
  text-transform:uppercase;
}

.drct-status-value{
  position:relative;
  z-index:2;
  display:block;
  color:var(--dr-text);
  font-family:"Playfair Display", Georgia, serif;
  font-size:1.04rem;
  line-height:1.35;
}

.drct-panel{
  padding:22px;
}

.drct-visual{
  min-height:420px;
  padding:0;
}

.drct-visual-frame{
  position:absolute;
  inset:0;
  overflow:hidden;
}

.drct-visual-stage{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 72% 18%, rgba(124,234,255,0.16), transparent 24%),
    radial-gradient(circle at 32% 72%, rgba(198,168,94,0.08), transparent 24%),
    linear-gradient(180deg, rgba(7,14,22,0.18), rgba(7,14,22,0.62));
}

.drct-visual-overlay{
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(rgba(124,234,255,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(124,234,255,0.04) 1px, transparent 1px);
  background-size:24px 24px;
  mask-image:linear-gradient(180deg, rgba(0,0,0,.8), rgba(0,0,0,.25));
}

.drct-network{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  justify-content:center;
}

.drct-network svg{
  width:100%;
  height:100%;
  max-width:640px;
  max-height:520px;
}

.drct-net-line{
  stroke:rgba(124,234,255,0.18);
  stroke-width:1.2;
  fill:none;
}

.drct-net-line-strong{
  stroke:rgba(124,234,255,0.38);
  stroke-width:1.6;
  fill:none;
}

.drct-net-line-gold{
  stroke:rgba(198,168,94,0.34);
  stroke-width:1.2;
  fill:none;
}

.drct-net-node{
  fill:rgba(124,234,255,0.16);
  stroke:rgba(124,234,255,0.8);
  stroke-width:1.2;
}

.drct-net-node-gold{
  fill:rgba(198,168,94,0.12);
  stroke:rgba(198,168,94,0.82);
  stroke-width:1.2;
}

.drct-net-pulse{
  fill:var(--dr-cyan);
  filter:drop-shadow(0 0 8px rgba(124,234,255,0.65));
}

.drct-net-pulse.gold{
  fill:var(--dr-gold-2);
  filter:drop-shadow(0 0 8px rgba(198,168,94,0.55));
}

.drct-net-glow{
  fill:none;
  stroke:rgba(124,234,255,0.14);
  stroke-width:1;
}

.drct-visual-caption{
  position:absolute;
  left:18px;
  right:18px;
  bottom:18px;
  z-index:3;
  padding:16px;
  border-radius:16px;
  background:rgba(8,15,24,0.78);
  border:1px solid rgba(255,255,255,0.06);
  backdrop-filter:blur(12px);
}

.drct-visual-caption strong{
  display:block;
  margin:0 0 6px;
  color:var(--dr-gold-2);
  font-family:Arial,sans-serif;
  font-size:10px;
  letter-spacing:2.6px;
  text-transform:uppercase;
}

.drct-visual-caption span{
  display:block;
  color:var(--dr-soft);
  line-height:1.7;
  font-size:13px;
}

.drct-section{
  padding:18px 0 0;
}

.drct-block{
  margin-top:44px;
}

.drct-quote{
  max-width:1040px;
  margin:0 auto;
  padding:28px 28px 28px 34px;
  background:
    radial-gradient(circle at top right, rgba(124,234,255,0.09), transparent 24%),
    linear-gradient(180deg, rgba(13,23,36,0.94), rgba(9,16,26,0.98));
  border-left:3px solid var(--dr-gold);
}

.drct-quote::before{
  content:"“";
  position:absolute;
  left:18px;
  top:10px;
  color:rgba(198,168,94,0.22);
  font-family:"Playfair Display", Georgia, serif;
  font-size:5rem;
  line-height:1;
}

.drct-quote p{
  position:relative;
  z-index:2;
  margin:0;
  color:#d8e6f3;
  font-family:"Playfair Display", Georgia, serif;
  font-size:1.16rem;
  line-height:1.8;
}

.drct-quote-note{
  position:relative;
  z-index:2;
  display:block;
  margin-top:14px;
  color:var(--dr-cyan);
  font-family:Arial,sans-serif;
  font-size:10px;
  letter-spacing:2px;
  text-transform:uppercase;
}

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

.drct-card,
.drct-pillar,
.drct-entry,
.drct-path,
.drct-mini,
.drct-quick-link,
.drct-stream-box{
  position:relative;
  overflow:hidden;
  isolation:isolate;
}

.drct-card::before,
.drct-pillar::before,
.drct-entry::before,
.drct-path::before,
.drct-mini::before,
.drct-quick-link::before,
.drct-stream-box::before{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:linear-gradient(135deg, rgba(95,228,255,0.05), transparent 46%);
}

.drct-card,
.drct-pillar,
.drct-path,
.drct-stream-box{
  padding:22px 20px;
}

.drct-card-label,
.drct-pillar-kicker,
.drct-entry-kicker,
.drct-path-kicker,
.drct-mini-kicker,
.drct-section-label{
  position:relative;
  z-index:2;
  font-family:Arial,sans-serif;
  font-size:10px;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--dr-cyan);
}

.drct-card-label,
.drct-pillar-kicker,
.drct-entry-kicker,
.drct-path-kicker,
.drct-mini-kicker{
  margin-bottom:10px;
}

.drct-section-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:16px;
  flex-wrap:wrap;
  margin:0 0 18px;
}

.drct-section-label{
  display:inline-block;
  margin:0 0 10px;
  padding-top:8px;
  border-top:1px solid rgba(124,234,255,0.22);
}

.drct-section-head h2,
.drct-query-head h3,
.drct-cta h2{
  margin:0;
  color:var(--dr-text);
  font-family:"Playfair Display", Georgia, serif;
}

.drct-section-head h2,
.drct-cta h2{
  font-size:clamp(2rem,3vw,2.9rem);
  line-height:1.1;
}

.drct-query-head h3{
  font-size:1.5rem;
}

.drct-section-head p,
.drct-query-head p,
.drct-card p,
.drct-pillar p,
.drct-entry p,
.drct-path-desc,
.drct-mini p,
.drct-quick-link .note,
.drct-stream-box p,
.drct-cta p{
  color:var(--dr-soft);
  line-height:1.8;
}

.drct-card h3,
.drct-pillar h3,
.drct-entry h3,
.drct-path h3,
.drct-path-pillar h4,
.drct-mini h4,
.drct-quick-link .title,
.drct-stream-box h3{
  position:relative;
  z-index:2;
  margin:0 0 10px;
  color:var(--dr-text);
  font-family:"Playfair Display", Georgia, serif;
}

.drct-card h3{font-size:1.2rem;line-height:1.35}
.drct-pillar h3{font-size:1.1rem;line-height:1.35}
.drct-entry h3{font-size:1.22rem;line-height:1.35}
.drct-path h3{font-size:1.35rem;line-height:1.3}
.drct-path-pillar h4{font-size:1.22rem}
.drct-mini h4{font-size:1.04rem;line-height:1.35}
.drct-stream-box h3{font-size:1.28rem}
.drct-quick-link .title{font-size:1rem;line-height:1.35}

.drct-signal{
  margin:34px 0 8px;
  background:linear-gradient(135deg, rgba(124,234,255,0.08), rgba(198,168,94,0.05));
  border:1px solid rgba(124,234,255,0.14);
  border-radius:20px;
  box-shadow:var(--dr-shadow);
  padding:24px;
}

.drct-signal strong{
  display:block;
  margin:0 0 10px;
  color:var(--dr-cyan);
  font-family:Arial,sans-serif;
  font-size:10px;
  letter-spacing:3px;
  text-transform:uppercase;
}

.drct-signal p{
  margin:0;
  color:var(--dr-text);
  font-family:"Playfair Display", Georgia, serif;
  font-size:1.05rem;
  line-height:1.8;
}

.drct-pillars{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}

.drct-streams{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px;
  margin-top:28px;
}

.drct-query-head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:16px;
  margin-bottom:18px;
  flex-wrap:wrap;
}

.drct-query-head p{
  max-width:620px;
  margin:0;
}

.drct-entry-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}

.drct-entry{
  display:block;
  transition:all var(--dr-speed) ease;
}

.drct-entry:hover,
.drct-card:hover,
.drct-pillar:hover,
.drct-path:hover,
.drct-mini:hover,
.drct-quick-link:hover,
.drct-stream-box:hover{
  transform:translateY(-4px);
  border-color:rgba(124,234,255,0.22);
}

.drct-entry-top{
  position:relative;
  height:190px;
  border-bottom:1px solid rgba(255,255,255,0.05);
  background:
    linear-gradient(180deg, rgba(7,14,22,0.14), rgba(7,14,22,0.52)),
    var(--dr-preview, linear-gradient(135deg, rgba(124,234,255,0.10), rgba(198,168,94,0.08)));
  background-size:cover;
  background-position:center;
  overflow:hidden;
}

.drct-entry-top::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 78% 24%, rgba(124,234,255,0.14), transparent 24%),
    linear-gradient(rgba(124,234,255,0.04) 1px, transparent 1px),
    linear-gradient(90deg, rgba(124,234,255,0.04) 1px, transparent 1px);
  background-size:auto, 22px 22px, 22px 22px;
  opacity:.5;
}

.drct-entry-body{
  position:relative;
  z-index:2;
  padding:18px 18px 20px;
}

.drct-entry-date{
  margin-top:14px;
  color:var(--dr-muted);
  font-family:Arial,sans-serif;
  font-size:11px;
  letter-spacing:1.5px;
  text-transform:uppercase;
}

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

.drct-path-head{
  position:relative;
  z-index:2;
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:14px;
}

.drct-path-tag{
  display:inline-flex;
  align-items:center;
  padding:8px 12px;
  border-radius:999px;
  border:1px solid rgba(124,234,255,0.14);
  color:var(--dr-muted);
  font-family:Arial,sans-serif;
  font-size:10px;
  letter-spacing:1.8px;
  text-transform:uppercase;
  white-space:nowrap;
  background:rgba(8,17,29,0.58);
}

.drct-path-desc{
  position:relative;
  z-index:2;
  margin:0 0 18px;
}

.drct-path-pillar{
  position:relative;
  z-index:2;
  display:block;
  border:1px solid rgba(198,168,94,0.22);
  background:linear-gradient(180deg, rgba(27,23,16,0.46), rgba(17,18,24,0.66));
  border-radius:12px;
  padding:18px;
  margin-bottom:16px;
  transition:transform .2s ease, border-color .2s ease;
}

.drct-path-pillar:hover{
  transform:translateY(-2px);
  border-color:rgba(198,168,94,0.42);
}

.drct-path-pillar-label{
  font-family:Arial,sans-serif;
  font-size:10px;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--dr-gold);
  margin-bottom:8px;
}

.drct-path-pillar p{
  margin:0;
  color:#d5deea;
  line-height:1.75;
  font-size:14px;
}

.drct-mini-grid{
  position:relative;
  z-index:2;
  display:grid;
  gap:12px;
}

.drct-mini{
  display:block;
  padding:16px;
  transition:all var(--dr-speed) ease;
}

.drct-mini p{
  margin:0;
  font-size:14px;
}

.drct-inline-cta{
  position:relative;
  z-index:2;
  margin-top:16px;
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.drct-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:var(--dr-text);
  font-family:Arial,sans-serif;
  font-size:11px;
  letter-spacing:1.8px;
  text-transform:uppercase;
  padding:11px 14px;
  border-radius:999px;
  border:1px solid rgba(124,234,255,0.18);
  background:rgba(10,18,30,0.82);
  transition:transform .2s ease, border-color .2s ease, background .2s ease;
}

.drct-button:hover{
  transform:translateY(-2px);
  border-color:rgba(124,234,255,0.34);
  background:rgba(13,22,39,0.98);
}

.drct-button.is-gold{
  border-color:rgba(198,168,94,0.28);
  color:#f2e0aa;
}

.drct-quick-links{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
  margin-top:18px;
}

.drct-quick-link{
  display:block;
  padding:16px;
  transition:all var(--dr-speed) ease;
}

.drct-quick-link span{
  display:block;
  position:relative;
  z-index:2;
}

.drct-quick-link .eyebrow{
  font-family:Arial,sans-serif;
  font-size:10px;
  letter-spacing:2px;
  text-transform:uppercase;
  color:var(--dr-cyan);
  margin-bottom:8px;
}

.drct-quick-link .note{
  margin-top:8px;
  font-size:13px;
  line-height:1.55;
}

.drct-cta{
  padding:28px 24px;
}

.drct-footer-note{
  margin-top:34px;
  text-align:center;
  color:var(--dr-muted);
  font-family:Arial,sans-serif;
  font-size:11px;
  letter-spacing:2px;
  text-transform:uppercase;
}

.drct-sweep{
  position:absolute;
  top:-20%;
  bottom:-20%;
  left:-30%;
  width:42%;
  pointer-events:none;
  z-index:1;
  opacity:0;
  transform:translateX(-130%) skewX(-22deg);
  background:linear-gradient(
    90deg,
    transparent 0%,
    rgba(255,255,255,0.00) 18%,
    rgba(124,234,255,0.05) 42%,
    rgba(255,255,255,0.14) 50%,
    rgba(226,201,139,0.08) 58%,
    rgba(255,255,255,0.00) 82%,
    transparent 100%
  );
  filter:blur(.5px);
  mix-blend-mode:screen;
}

.drct-entry:hover .drct-sweep,
.drct-path:hover .drct-sweep,
.drct-mini:hover .drct-sweep,
.drct-quick-link:hover .drct-sweep{
  opacity:1;
  animation:drctSweep 1.15s ease forwards;
}

@keyframes drctSweep{
  0%{transform:translateX(-130%) skewX(-22deg);opacity:0}
  12%{opacity:.55}
  45%{opacity:.9}
  100%{transform:translateX(340%) skewX(-22deg);opacity:0}
}

@media (max-width:1280px){
  .drct-hero-grid,
  .drct-entry-grid,
  .drct-path-grid,
  .drct-streams{
    grid-template-columns:1fr;
  }

  .drct-hero-main{
    min-height:auto;
  }
}

@media (max-width:1000px){
  .drct-grid,
  .drct-pillars,
  .drct-quick-links,
  .drct-status-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .drct-feature-strip{
    grid-template-columns:1fr;
  }
}

@media (max-width:820px){
  .drct-grid,
  .drct-pillars,
  .drct-entry-grid,
  .drct-path-grid,
  .drct-quick-links,
  .drct-status-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width:640px){
  .drct{
    left:auto;
    right:auto;
    width:100%;
    max-width:100%;
    margin-left:0;
    margin-right:0;
  }

  .drct-shell{
    padding:0 14px 42px;
  }

  .drct-hero-main{
    padding:30px 20px 24px;
  }

  .drct-title{
    font-size:2.3rem;
    max-width:none;
  }

  .drct-visual{
    min-height:360px;
  }

  .drct-visual-caption{
    left:16px;
    right:16px;
    bottom:14px;
  }

  .drct-visual-caption span{
    font-size:12px;
    line-height:1.5;
  }

  .drct-quote{
    padding:24px 18px 22px 24px;
  }
}