/* DisruptX shared theme — teal + lime, angled frames, grid backdrop (matches the "Proper canva ref" design). Fonts intentionally untouched. */
:root{--ink:#07161c;--deep:#0b252e;--blue:#123747;--paper:#f5f7f4;--mist:#aab8b8;--lime:#c1ff72}
html{scroll-behavior:smooth}
body{color:var(--paper)!important;background-color:var(--blue)!important;
 background-image:linear-gradient(90deg,rgba(193,255,114,.05) 1px,transparent 1px),linear-gradient(rgba(193,255,114,.032) 1px,transparent 1px);
 background-size:92px 92px;overflow-x:hidden}
::selection{background:var(--lime);color:var(--ink)}
:focus-visible{outline:2px solid var(--lime);outline-offset:4px}

/* Tailwind palette names used on the pages */
.bg-disrupt-black{background-color:var(--ink)}.bg-disrupt-dark{background-color:var(--deep)}
.bg-disrupt-black\/80{background-color:rgba(7,22,28,.88)}
.text-disrupt-pink,.text-disrupt-cyan,.hover\:text-disrupt-pink:hover{color:var(--lime)}
.border-disrupt-dark{border-color:rgba(170,184,184,.22)}
.from-disrupt-black{--tw-gradient-from:var(--ink) var(--tw-gradient-from-position);--tw-gradient-to:rgba(7,22,28,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
.via-disrupt-dark{--tw-gradient-stops:var(--tw-gradient-from),var(--deep) var(--tw-gradient-via-position),var(--tw-gradient-to)}
.to-disrupt-black{--tw-gradient-to:var(--ink) var(--tw-gradient-to-position)}
.to-disrupt-dark{--tw-gradient-to:var(--deep) var(--tw-gradient-to-position)}
.from-disrupt-dark{--tw-gradient-from:var(--deep) var(--tw-gradient-from-position);--tw-gradient-to:rgba(11,37,46,0) var(--tw-gradient-to-position);--tw-gradient-stops:var(--tw-gradient-from),var(--tw-gradient-to)}
.text-gray-300,.text-gray-400{color:var(--mist)!important}
.text-gray-500,.text-gray-600{color:#8a9ea0!important}

/* Header */
header.fixed{background:rgba(7,22,28,.92)!important;border-bottom:1px solid rgba(193,255,114,.28)!important;backdrop-filter:blur(16px)}
header .glow,header a.glow{letter-spacing:-.06em;font-weight:900}
.glow{text-shadow:none!important}
header nav a:not(.btn-primary):hover{color:var(--lime)}

/* Buttons: square, uppercase, lift on hover */
.btn-primary,.btn-secondary{border-radius:0!important;text-transform:uppercase;letter-spacing:.06em;font-size:.8rem;font-weight:700!important;
 transition:transform .22s ease,background .22s ease,color .22s ease,border-color .22s ease,box-shadow .22s ease!important}
.btn-primary{background:var(--lime)!important;color:var(--ink)!important;border:1px solid var(--lime)!important}
.btn-secondary{background:transparent!important;color:var(--paper)!important;border:1px solid rgba(245,247,244,.65)!important}
.btn-primary:hover,.btn-secondary:hover{transform:translate(-4px,-4px)!important;background:var(--paper)!important;color:var(--ink)!important;border-color:var(--paper)!important;box-shadow:none!important}

/* Cards / panels: hairline grid look with corner tick */
.card{position:relative;background:var(--deep)!important;border:1px solid rgba(170,184,184,.3)!important;border-radius:0!important;transition:background .28s ease,border-color .28s ease}
.card::after{content:"";position:absolute;top:12px;right:12px;width:16px;height:16px;border-top:1px solid var(--lime);border-right:1px solid var(--lime);pointer-events:none}
.card:hover{background:#174555!important;border-color:rgba(193,255,114,.55)!important}
main section,body>section{position:relative}
.rounded,.rounded-lg,.rounded-xl,.rounded-2xl{border-radius:0!important}

/* Headlines: heavier, tighter */
h1,h2{font-weight:900;letter-spacing:-.04em}
h1{line-height:1.02}

/* Sections alternate ink / deep, with the signature angled top edge */
section.bg-disrupt-black,section.bg-disrupt-dark{background-color:var(--ink)}
section.bg-disrupt-dark{background-color:var(--deep)}
section+section.bg-disrupt-dark,section+section.bg-disrupt-black{clip-path:polygon(0 3vw,100% 0,100% 100%,0 100%);padding-top:calc(5rem + 3vw)}

/* Angled image frames (used for the new page images) */
.dx-media{position:relative;margin:0;overflow:hidden;border:1px solid rgba(193,255,114,.72);clip-path:polygon(16% 0,100% 0,100% 84%,84% 100%,0 100%,0 16%);background:var(--ink)}
.dx-media img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .8s cubic-bezier(.2,.8,.2,1)}
.dx-media:hover img{transform:scale(1.05)}
.dx-media::before{content:"";position:absolute;z-index:2;top:0;left:0;width:34%;height:26%;border-top:1px solid var(--lime);border-left:1px solid var(--lime);pointer-events:none}
.dx-split{display:grid;grid-template-columns:1.05fr .95fr;gap:3rem;align-items:center;max-width:72rem;margin:0 auto}
.dx-split .dx-media{aspect-ratio:16/10}
.dx-band{padding:4.5rem 1.5rem}
.dx-tag{display:block;margin-bottom:1rem;color:var(--lime);font-weight:700;font-size:11px;letter-spacing:.15em;text-transform:uppercase}
@media(max-width:800px){.dx-split{grid-template-columns:1fr;gap:2rem}.dx-split.dx-flip .dx-media{order:-1}}

/* Footer */
footer{background:var(--ink)!important;border-top:1px solid rgba(193,255,114,.28)!important}
footer a:hover{color:var(--lime)}

/* Hero photo backgrounds (about, agency, security, challenge) */
.dx-hero-photo{background-image:linear-gradient(180deg,rgba(7,22,28,.78) 0%,rgba(7,22,28,.6) 45%,rgba(7,22,28,.95) 100%),var(--hero-img)!important;background-size:cover!important;background-position:center!important;position:relative}