/* ============================================
   DISRUPTOR / NEO-BRUTALIST THEME
   ============================================
   All rules scoped under [data-theme="disruptor"].
   Overrides the dark modern base with a raw,
   industrial, high-contrast Neo-Brutalist aesthetic.
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Ranchers&family=Space+Mono:wght@400;700&family=Plus+Jakarta+Sans:wght@400;500;700;800&display=swap');


/* ------------------------------------------
   CSS VARIABLES OVERRIDE
   ------------------------------------------ */
[data-theme="disruptor"] {
    --color-bg: #121212;
    --color-accent: #CCFF00;
    --color-accent-hover: #b8e600;
    --color-text: #FFFFFF;
    --color-text-muted: #999999;
    --color-text-dim: #777777;
    --color-text-faint: #555555;
    --color-text-ghost: #333333;
    --color-surface: #1a1a1a;
    --color-surface-hover: #222222;
    --color-surface-dark: #0a0a0a;
    --color-border: #000000;
    --color-border-light: #333333;
    --color-border-mid: #222222;
    --font-satoshi: 'Plus Jakarta Sans', sans-serif;
    --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-smooth: cubic-bezier(0.25, 0.1, 0.25, 1);
}


/* ------------------------------------------
   UNIVERSAL RESETS
   ------------------------------------------ */
[data-theme="disruptor"],
[data-theme="disruptor"] *,
[data-theme="disruptor"] *::before,
[data-theme="disruptor"] *::after {
    border-radius: 0 !important;
    cursor: auto !important;
}

/* Re-allow up to 8px radius where explicitly set */
[data-theme="disruptor"] .rounded-lg,
[data-theme="disruptor"] [class*="rounded-"] {
    border-radius: 0 !important;
}


/* ------------------------------------------
   HIDE CUSTOM CURSOR
   ------------------------------------------ */
[data-theme="disruptor"] .cursor-dot,
[data-theme="disruptor"] .cursor-ring {
    display: none !important;
    opacity: 0 !important;
    pointer-events: none !important;
}


/* ------------------------------------------
   1. BODY / MAIN WRAPPER
   ------------------------------------------ */
[data-theme="disruptor"] {
    background-color: #121212 !important;
    color: #FFFFFF !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
}

[data-theme="disruptor"] .min-h-screen,
[data-theme="disruptor"] .min-h-screen.bg-\[\#050505\] {
    background-color: #121212 !important;
    color: #FFFFFF !important;
}

[data-theme="disruptor"] .selection-coral::selection,
[data-theme="disruptor"] .selection-coral *::selection {
    background-color: #CCFF00 !important;
    color: #000000 !important;
}


/* ------------------------------------------
   2. TOP NAVIGATION
   ------------------------------------------ */
[data-theme="disruptor"] #topNav,
[data-theme="disruptor"] .top-nav {
    background-color: #FFFFFF !important;
    border-bottom: 4px solid #000000 !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* Logo — black square, rotated, white text */
[data-theme="disruptor"] #nav-logo > div,
[data-theme="disruptor"] #topNav .flex.items-center a[href="/"] > div {
    background-color: #000000 !important;
    color: #FFFFFF !important;
    border: none !important;
    transform: rotate(3deg) !important;
    border-radius: 0 !important;
    font-family: 'Ranchers', cursive !important;
}

/* Nav links */
[data-theme="disruptor"] #topNav .nav-link {
    color: #000000 !important;
    font-family: 'Space Mono', monospace !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    font-weight: 700 !important;
    font-size: 11px !important;
}

[data-theme="disruptor"] #topNav .nav-link:hover {
    color: #000000 !important;
    text-decoration: underline 3px #CCFF00 !important;
    text-underline-offset: 4px !important;
}

/* CTA button in nav */
[data-theme="disruptor"] #topNav a[href="#contact"] {
    background-color: #000000 !important;
    color: #CCFF00 !important;
    border: 4px solid #000000 !important;
    border-radius: 8px !important;
    box-shadow: 4px 4px 0 #000000 !important;
    font-family: 'Space Mono', monospace !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    font-weight: 700 !important;
    font-size: 11px !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}

[data-theme="disruptor"] #topNav a[href="#contact"]:hover {
    transform: translate(4px, 4px) !important;
    box-shadow: 0 0 0 #000000 !important;
    background-color: #000000 !important;
    color: #CCFF00 !important;
}

[data-theme="disruptor"] #topNav a[href="#contact"]:active {
    transform: translate(2px, 2px) !important;
    box-shadow: 2px 2px 0 #000000 !important;
}

/* Nav link container text color override */
[data-theme="disruptor"] #topNav .text-\[\#888888\] {
    color: #000000 !important;
}


/* ------------------------------------------
   3. BOTTOM NAV / THEME SWITCHER
   ------------------------------------------ */
[data-theme="disruptor"] #bottomNav,
[data-theme="disruptor"] .bottom-nav {
    background-color: #FFFFFF !important;
    border: 4px solid #000000 !important;
    box-shadow: 8px 8px 0 #000000 !important;
    border-radius: 8px !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

[data-theme="disruptor"] #bottomNav.glass-nav,
[data-theme="disruptor"] .glass-nav {
    background-color: #FFFFFF !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
}

/* Theme toggle buttons */
[data-theme="disruptor"] .theme-toggle {
    background-color: #FFFFFF !important;
    color: #000000 !important;
    border: 2px solid #000000 !important;
    border-radius: 4px !important;
    font-family: 'Space Mono', monospace !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    font-weight: 700 !important;
}

[data-theme="disruptor"] .theme-toggle.active,
[data-theme="disruptor"] .theme-toggle[aria-pressed="true"] {
    background-color: #CCFF00 !important;
    color: #000000 !important;
    border-color: #000000 !important;
}

[data-theme="disruptor"] .theme-toggle:hover {
    background-color: #CCFF00 !important;
    color: #000000 !important;
}


/* ------------------------------------------
   4. HERO SECTION
   ------------------------------------------ */
[data-theme="disruptor"] header {
    background-color: #121212 !important;
}

/* Hide background gradient overlay */
[data-theme="disruptor"] header > .absolute.inset-0.z-0 {
    display: none !important;
    opacity: 0 !important;
}

/* Hide grid overlay */
[data-theme="disruptor"] header > .absolute.inset-0.z-0.pointer-events-none.opacity-\[0\.03\] {
    display: none !important;
}

/* Hero text container — add sticker badge */
[data-theme="disruptor"] header .relative.z-10 {
    position: relative !important;
}

[data-theme="disruptor"] header .relative.z-10::before {
    content: "DIGITAL AGENCY" !important;
    position: absolute !important;
    top: -30px !important;
    right: -40px !important;
    background-color: #FFFFFF !important;
    color: #000000 !important;
    font-family: 'Space Mono', monospace !important;
    font-size: 10px !important;
    font-weight: 700 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.15em !important;
    padding: 8px 16px !important;
    border: 4px solid #000000 !important;
    transform: rotate(-2deg) !important;
    z-index: 20 !important;
    box-shadow: 4px 4px 0 #000000 !important;
    border-radius: 0 !important;
    display: block !important;
}

/* Hero headline */
[data-theme="disruptor"] #heroText,
[data-theme="disruptor"] .hero-text {
    font-family: 'Ranchers', cursive !important;
    text-transform: uppercase !important;
    color: #CCFF00 !important;
    line-height: 0.85 !important;
    font-size: clamp(80px, 13vw, 150px) !important;
    text-shadow: 6px 6px 0 #000000 !important;
    letter-spacing: -0.02em !important;
}

/* Hero subtitle */
[data-theme="disruptor"] #heroSub {
    font-family: 'Space Mono', monospace !important;
    text-transform: uppercase !important;
    letter-spacing: 0.2em !important;
    color: #FFFFFF !important;
    font-weight: 700 !important;
    font-size: 12px !important;
    opacity: 1 !important;
}

/* Tagline — bottom left */
[data-theme="disruptor"] header .absolute.bottom-12.left-8 p,
[data-theme="disruptor"] header .absolute.bottom-12.left-8.md\:left-12 p {
    color: #FFFFFF !important;
    font-family: 'Space Mono', monospace !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    font-weight: 700 !important;
    font-size: 11px !important;
}

/* Contact link — bottom right */
[data-theme="disruptor"] header .absolute.bottom-12.right-8 a,
[data-theme="disruptor"] header .absolute.bottom-12.right-8.md\:right-12 a {
    color: #CCFF00 !important;
    font-family: 'Space Mono', monospace !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    font-weight: 700 !important;
    border-bottom: 3px solid #CCFF00 !important;
    text-decoration: none !important;
}

[data-theme="disruptor"] header .absolute.bottom-12.right-8 a:hover {
    color: #FFFFFF !important;
    border-bottom-color: #FFFFFF !important;
}

/* Scroll indicator */
[data-theme="disruptor"] header .absolute.bottom-12.left-1\/2 span {
    color: #CCFF00 !important;
    font-family: 'Space Mono', monospace !important;
}

[data-theme="disruptor"] header .absolute.bottom-12.left-1\/2 iconify-icon {
    color: #CCFF00 !important;
}


/* ------------------------------------------
   5. SERVICES MARQUEE
   ------------------------------------------ */
[data-theme="disruptor"] .border-y.border-\[\#1a1a1a\],
[data-theme="disruptor"] div.border-y {
    background-color: #CCFF00 !important;
    border-top: 4px solid #000000 !important;
    border-bottom: 4px solid #000000 !important;
}

[data-theme="disruptor"] .marquee-track span {
    color: #000000 !important;
    font-family: 'Space Mono', monospace !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    letter-spacing: 0.1em !important;
}

/* Marquee dots */
[data-theme="disruptor"] .marquee-track span span,
[data-theme="disruptor"] .marquee-track span .bg-\[\#FF6B50\],
[data-theme="disruptor"] .marquee-track .rounded-full {
    background-color: #000000 !important;
}


/* ------------------------------------------
   6. ABOUT SECTION
   ------------------------------------------ */
[data-theme="disruptor"] #about {
    background-color: #121212 !important;
}

/* Section label dot */
[data-theme="disruptor"] #about .pulse-ring,
[data-theme="disruptor"] #about .bg-\[\#FF6B50\].pulse-ring {
    background-color: #CCFF00 !important;
    box-shadow: 0 0 0 4px rgba(204, 255, 0, 0.3) !important;
}

[data-theme="disruptor"] #about .pulse-ring + span,
[data-theme="disruptor"] #about .text-\[\#666666\].uppercase {
    color: #CCFF00 !important;
    font-family: 'Space Mono', monospace !important;
    font-weight: 700 !important;
}

/* About headline */
[data-theme="disruptor"] #about > h2 {
    font-family: 'Ranchers', cursive !important;
    text-transform: uppercase !important;
    color: #FFFFFF !important;
    line-height: 0.95 !important;
}

/* Accent words in headline */
[data-theme="disruptor"] #about > h2 span.text-\[\#666666\],
[data-theme="disruptor"] #about h2 > span {
    color: #CCFF00 !important;
}

/* About cards — first card (Build it. Scale it.) */
[data-theme="disruptor"] #about .tilt-card.bg-\[\#111111\],
[data-theme="disruptor"] #about .grid > .tilt-card:first-child {
    background-color: #FFFFFF !important;
    border: 4px solid #000000 !important;
    box-shadow: 8px 8px 0 #000000 !important;
    border-radius: 0 !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}

[data-theme="disruptor"] #about .grid > .tilt-card:first-child:hover {
    background-color: #FFFFFF !important;
    transform: translate(-4px, -4px) !important;
    box-shadow: 12px 12px 0 #000000 !important;
}

/* "Build it." / "Scale it." text */
[data-theme="disruptor"] #about .grid > .tilt-card:first-child h3 {
    font-family: 'Ranchers', cursive !important;
    color: #000000 !important;
    text-transform: uppercase !important;
}

[data-theme="disruptor"] #about .grid > .tilt-card:first-child h3.text-\[\#444444\] {
    color: #333333 !important;
}

[data-theme="disruptor"] #about .grid > .tilt-card:first-child:hover h3.text-\[\#444444\] {
    color: #555555 !important;
}

/* Results-Driven badge */
[data-theme="disruptor"] #about .grid > .tilt-card:first-child .absolute.top-10.right-10 {
    background-color: #CCFF00 !important;
    color: #000000 !important;
    border: 4px solid #000000 !important;
    transform: rotate(2deg) !important;
    font-family: 'Space Mono', monospace !important;
    border-radius: 0 !important;
    box-shadow: 3px 3px 0 #000000 !important;
}

[data-theme="disruptor"] #about .grid > .tilt-card:first-child:hover .absolute.top-10.right-10 {
    border-color: #000000 !important;
    color: #000000 !important;
}

/* About cards — second card (browser mockup, purple gradient) */
[data-theme="disruptor"] #about .tilt-card.bg-gradient-to-br,
[data-theme="disruptor"] #about .grid > .tilt-card:nth-child(2) {
    background: #CCFF00 !important;
    background-image: none !important;
    border: 4px solid #000000 !important;
    box-shadow: 8px 8px 0 #000000 !important;
    border-radius: 0 !important;
}

/* Browser mockup in second card */
[data-theme="disruptor"] #about .grid > .tilt-card:nth-child(2) .bg-\[\#e5e5e5\] {
    border: 4px solid #000000 !important;
    border-radius: 0 !important;
    box-shadow: 6px 6px 0 #000000 !important;
}

[data-theme="disruptor"] #about .grid > .tilt-card:nth-child(2) .bg-\[\#f5f5f5\] {
    border-bottom: 4px solid #000000 !important;
    background-color: #FFFFFF !important;
    border-radius: 0 !important;
}

/* Browser mockup dots */
[data-theme="disruptor"] #about .grid > .tilt-card:nth-child(2) .rounded-full.bg-red-400 {
    background-color: #000000 !important;
}
[data-theme="disruptor"] #about .grid > .tilt-card:nth-child(2) .rounded-full.bg-yellow-400 {
    background-color: #000000 !important;
}
[data-theme="disruptor"] #about .grid > .tilt-card:nth-child(2) .rounded-full.bg-green-400 {
    background-color: #000000 !important;
}

/* Hide white/5 hover overlay on second card */
[data-theme="disruptor"] #about .grid > .tilt-card:nth-child(2) > .absolute.inset-0.bg-white\/5 {
    display: none !important;
}

/* Client Dashboard overlay text */
[data-theme="disruptor"] #about .grid > .tilt-card:nth-child(2) .absolute.bottom-6.left-6 .text-white {
    color: #FFFFFF !important;
}


/* ------------------------------------------
   7. STATS SECTION
   ------------------------------------------ */
[data-theme="disruptor"] #stats {
    background-color: #FFFFFF !important;
    border-top: 8px solid #000000 !important;
    border-bottom: 8px solid #000000 !important;
}

/* Stat numbers */
[data-theme="disruptor"] #stats .counter,
[data-theme="disruptor"] #stats .stat-glow {
    font-family: 'Ranchers', cursive !important;
    color: #000000 !important;
    text-shadow: none !important;
    -webkit-text-stroke: 0 !important;
}

/* Stat labels */
[data-theme="disruptor"] #stats .text-center > p:first-of-type,
[data-theme="disruptor"] #stats .text-\[\#666666\] {
    color: #000000 !important;
    font-family: 'Space Mono', monospace !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    font-weight: 700 !important;
}

/* Stat sub-labels / sources */
[data-theme="disruptor"] #stats .text-center > p:last-of-type,
[data-theme="disruptor"] #stats .text-\[\#444444\] {
    color: #777777 !important;
    font-family: 'Space Mono', monospace !important;
}


/* ------------------------------------------
   8. SERVICES SECTION
   ------------------------------------------ */
[data-theme="disruptor"] #services {
    background-color: #121212 !important;
}

/* Section label */
[data-theme="disruptor"] #services .pulse-ring,
[data-theme="disruptor"] #services .bg-\[\#FF6B50\].pulse-ring {
    background-color: #CCFF00 !important;
    box-shadow: 0 0 0 4px rgba(204, 255, 0, 0.3) !important;
}

[data-theme="disruptor"] #services .pulse-ring + span {
    color: #CCFF00 !important;
    font-family: 'Space Mono', monospace !important;
    font-weight: 700 !important;
}

/* Services headline */
[data-theme="disruptor"] #services > h2 {
    font-family: 'Ranchers', cursive !important;
    text-transform: uppercase !important;
    color: #FFFFFF !important;
}

[data-theme="disruptor"] #services > h2 span.text-\[\#666666\],
[data-theme="disruptor"] #services h2 > span {
    color: #CCFF00 !important;
}

/* Services grid container — remove fill bg */
[data-theme="disruptor"] #services .grid.bg-\[\#222222\],
[data-theme="disruptor"] #services .grid.grid-cols-1.md\:grid-cols-3 {
    background-color: transparent !important;
    gap: 0 !important;
    border-radius: 0 !important;
    overflow: visible !important;
}

/* Service cards */
[data-theme="disruptor"] #services .grid > div.bg-\[\#0a0a0a\],
[data-theme="disruptor"] #services .grid.grid-cols-1.md\:grid-cols-3 > div {
    background-color: #FFFFFF !important;
    color: #000000 !important;
    border: 4px solid #000000 !important;
    border-radius: 0 !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}

[data-theme="disruptor"] #services .grid.grid-cols-1.md\:grid-cols-3 > div:hover {
    background-color: #FFFFFF !important;
    transform: translate(-4px, -4px) !important;
    box-shadow: 8px 8px 0 #000000 !important;
}

/* Service icon boxes */
[data-theme="disruptor"] #services .w-14.h-14 {
    background-color: #CCFF00 !important;
    border: 4px solid #000000 !important;
    box-shadow: 4px 4px 0 #000000 !important;
    border-radius: 0 !important;
}

[data-theme="disruptor"] #services .w-14.h-14 iconify-icon,
[data-theme="disruptor"] #services .service-icon {
    color: #000000 !important;
}

/* Service headings */
[data-theme="disruptor"] #services .grid.grid-cols-1.md\:grid-cols-3 h3 {
    font-family: 'Ranchers', cursive !important;
    color: #000000 !important;
    text-transform: uppercase !important;
}

/* Service body text */
[data-theme="disruptor"] #services .grid.grid-cols-1.md\:grid-cols-3 p {
    color: #333333 !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
}

/* Service list items */
[data-theme="disruptor"] #services .grid.grid-cols-1.md\:grid-cols-3 ul li {
    color: #555555 !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
}

[data-theme="disruptor"] #services .grid.grid-cols-1.md\:grid-cols-3 .group:hover ul li {
    color: #333333 !important;
}

/* Service card inner border */
[data-theme="disruptor"] #services .grid.grid-cols-1.md\:grid-cols-3 .border-t.border-\[\#222222\] {
    border-top-color: #000000 !important;
}

/* Service list dots */
[data-theme="disruptor"] #services .grid.grid-cols-1.md\:grid-cols-3 ul li span.bg-\[\#FF6B50\] {
    background-color: #CCFF00 !important;
}

/* Shopify callout */
[data-theme="disruptor"] #services .mt-8 .tilt-card,
[data-theme="disruptor"] #services .mt-8 > .tilt-card {
    background-color: #CCFF00 !important;
    border: 8px solid #000000 !important;
    box-shadow: 8px 8px 0 #000000 !important;
    border-radius: 0 !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}

[data-theme="disruptor"] #services .mt-8 .tilt-card:hover {
    border-color: #000000 !important;
    transform: translate(-4px, -4px) !important;
    box-shadow: 12px 12px 0 #000000 !important;
}

/* Shopify callout text */
[data-theme="disruptor"] #services .mt-8 .tilt-card h3 {
    font-family: 'Ranchers', cursive !important;
    color: #000000 !important;
    text-transform: uppercase !important;
}

[data-theme="disruptor"] #services .mt-8 .tilt-card p {
    color: #000000 !important;
}

/* Shopify icon box */
[data-theme="disruptor"] #services .mt-8 .tilt-card .w-16.h-16 {
    background: #000000 !important;
    background-image: none !important;
    border: 4px solid #000000 !important;
    border-radius: 0 !important;
}

[data-theme="disruptor"] #services .mt-8 .tilt-card .w-16.h-16 iconify-icon {
    color: #CCFF00 !important;
}

/* Shopify CTA button */
[data-theme="disruptor"] #services .mt-8 .tilt-card a[href="#contact"] {
    background-color: #000000 !important;
    color: #CCFF00 !important;
    border: 4px solid #000000 !important;
    border-radius: 0 !important;
    box-shadow: 4px 4px 0 #CCFF00 !important;
    font-family: 'Space Mono', monospace !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    font-weight: 700 !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}

[data-theme="disruptor"] #services .mt-8 .tilt-card a[href="#contact"]:hover {
    background-color: #CCFF00 !important;
    color: #000000 !important;
    transform: translate(4px, 4px) !important;
    box-shadow: 0 0 0 #000000 !important;
}


/* ------------------------------------------
   9. WORK / PORTFOLIO SECTION
   ------------------------------------------ */
[data-theme="disruptor"] #work {
    background-color: #121212 !important;
}

/* Section header bar */
[data-theme="disruptor"] #work .border-b.border-\[\#222222\],
[data-theme="disruptor"] #work > .flex.border-b {
    border-bottom: 4px solid #FFFFFF !important;
}

[data-theme="disruptor"] #work .text-\[\#FF6B50\] {
    color: #CCFF00 !important;
    font-family: 'Space Mono', monospace !important;
}

[data-theme="disruptor"] #work .text-\[\#FFFFFF\].text-xs {
    color: #FFFFFF !important;
    font-family: 'Space Mono', monospace !important;
}

/* Portfolio image containers */
[data-theme="disruptor"] #work article .aspect-\[4\/3\] {
    border: 4px solid #000000 !important;
    box-shadow: 8px 8px 0 #000000 !important;
    border-radius: 0 !important;
    overflow: hidden !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease !important;
}

[data-theme="disruptor"] #work article:hover .aspect-\[4\/3\] {
    transform: translate(-4px, -4px) !important;
    box-shadow: 12px 12px 0 #000000 !important;
}

/* Portfolio images */
[data-theme="disruptor"] #work article img {
    border-radius: 0 !important;
    opacity: 0.8 !important;
}

[data-theme="disruptor"] #work article:hover img {
    opacity: 1 !important;
}

/* Hide gradient overlay on hover */
[data-theme="disruptor"] #work article .bg-gradient-to-t {
    display: none !important;
}

/* Portfolio hover badge */
[data-theme="disruptor"] #work article .bg-\[\#FF6B50\] {
    background-color: #CCFF00 !important;
    color: #000000 !important;
    border: 3px solid #000000 !important;
    border-radius: 0 !important;
    font-family: 'Space Mono', monospace !important;
    font-weight: 700 !important;
}

/* Project titles */
[data-theme="disruptor"] #work article h3 {
    font-family: 'Ranchers', cursive !important;
    color: #FFFFFF !important;
    text-transform: uppercase !important;
}

[data-theme="disruptor"] #work article:hover h3,
[data-theme="disruptor"] #work article .group-hover\:text-\[\#FF6B50\] {
    color: #CCFF00 !important;
}

/* Project type labels */
[data-theme="disruptor"] #work article .text-\[\#666666\] {
    color: #999999 !important;
    font-family: 'Space Mono', monospace !important;
}

/* Arrow icon container */
[data-theme="disruptor"] #work article .p-3.rounded-full.border {
    border: 4px solid #FFFFFF !important;
    border-radius: 0 !important;
    transition: all 0.15s ease !important;
}

[data-theme="disruptor"] #work article:hover .p-3.rounded-full.border,
[data-theme="disruptor"] #work article .group-hover\:bg-\[\#FF6B50\] {
    background-color: #CCFF00 !important;
    color: #000000 !important;
    border-color: #000000 !important;
}


/* ------------------------------------------
   10. FOOTER / CONTACT SECTION
   ------------------------------------------ */
[data-theme="disruptor"] #contact {
    background-color: #000000 !important;
    border-top: 8px solid #CCFF00 !important;
}

/* "LET'S GO." headline */
[data-theme="disruptor"] #contact h2 {
    font-family: 'Ranchers', cursive !important;
    color: #CCFF00 !important;
    text-transform: uppercase !important;
    text-shadow: 6px 6px 0 #333333 !important;
}

[data-theme="disruptor"] #contact h2 span {
    color: #CCFF00 !important;
}

[data-theme="disruptor"] #contact h2 span:hover {
    color: #FFFFFF !important;
}

/* Location text */
[data-theme="disruptor"] #contact .text-\[\#666666\] {
    color: #999999 !important;
    font-family: 'Space Mono', monospace !important;
}

/* Social buttons */
[data-theme="disruptor"] #contact .social-btn {
    background-color: #FFFFFF !important;
    border: 4px solid #000000 !important;
    border-radius: 0 !important;
    box-shadow: 4px 4px 0 #000000 !important;
    color: #000000 !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease !important;
}

[data-theme="disruptor"] #contact .social-btn iconify-icon {
    color: #000000 !important;
}

[data-theme="disruptor"] #contact .social-btn:hover {
    background-color: #CCFF00 !important;
    color: #000000 !important;
    transform: translate(4px, 4px) !important;
    box-shadow: 0 0 0 #000000 !important;
}

[data-theme="disruptor"] #contact .social-btn:hover iconify-icon {
    color: #000000 !important;
}

[data-theme="disruptor"] #contact .social-btn:active {
    transform: translate(2px, 2px) !important;
    box-shadow: 2px 2px 0 #000000 !important;
}

/* Contact form container */
[data-theme="disruptor"] #contact .contact-form,
[data-theme="disruptor"] #contact form {
    background-color: #FFFFFF !important;
    border: 4px solid #000000 !important;
    box-shadow: 8px 8px 0 #000000 !important;
    border-radius: 0 !important;
    padding: 40px !important;
}

/* Form heading */
[data-theme="disruptor"] #contact .contact-form h3 {
    font-family: 'Ranchers', cursive !important;
    color: #000000 !important;
    text-transform: uppercase !important;
}

/* Form description */
[data-theme="disruptor"] #contact .contact-form p {
    color: #555555 !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
}

/* Form labels */
[data-theme="disruptor"] #contact .form-label {
    color: #000000 !important;
    font-family: 'Space Mono', monospace !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    font-weight: 700 !important;
    font-size: 11px !important;
}

[data-theme="disruptor"] #contact .form-label span {
    color: #999999 !important;
}

/* Form inputs */
[data-theme="disruptor"] #contact .form-input {
    background-color: #FFFFFF !important;
    color: #000000 !important;
    border: 4px solid #000000 !important;
    border-radius: 0 !important;
    font-family: 'Plus Jakarta Sans', sans-serif !important;
    outline: none !important;
    box-shadow: none !important;
}

[data-theme="disruptor"] #contact .form-input::placeholder {
    color: #999999 !important;
    font-family: 'Space Mono', monospace !important;
    font-size: 12px !important;
}

[data-theme="disruptor"] #contact .form-input:focus {
    border-color: #CCFF00 !important;
    box-shadow: 4px 4px 0 #CCFF00 !important;
    outline: none !important;
}

/* Form textarea */
[data-theme="disruptor"] #contact .form-textarea {
    background-color: #FFFFFF !important;
    color: #000000 !important;
    border: 4px solid #000000 !important;
    border-radius: 0 !important;
}

/* Submit button */
[data-theme="disruptor"] #contact .form-submit {
    background-color: #000000 !important;
    color: #CCFF00 !important;
    border: 4px solid #000000 !important;
    border-radius: 0 !important;
    box-shadow: 4px 4px 0 #000000 !important;
    font-family: 'Space Mono', monospace !important;
    text-transform: uppercase !important;
    letter-spacing: 0.1em !important;
    font-weight: 700 !important;
    transition: transform 0.15s ease, box-shadow 0.15s ease, background-color 0.15s ease, color 0.15s ease !important;
}

[data-theme="disruptor"] #contact .form-submit:hover {
    background-color: #CCFF00 !important;
    color: #000000 !important;
    transform: translate(4px, 4px) !important;
    box-shadow: 0 0 0 #000000 !important;
}

[data-theme="disruptor"] #contact .form-submit:active {
    transform: translate(2px, 2px) !important;
    box-shadow: 2px 2px 0 #000000 !important;
}

[data-theme="disruptor"] #contact .form-submit .form-submit-text {
    color: inherit !important;
}

[data-theme="disruptor"] #contact .form-submit .form-submit-icon {
    color: inherit !important;
}

/* Form success message */
[data-theme="disruptor"] #contact .form-success iconify-icon {
    color: #CCFF00 !important;
}

[data-theme="disruptor"] #contact .form-success p:first-of-type {
    color: #000000 !important;
    font-family: 'Ranchers', cursive !important;
}

[data-theme="disruptor"] #contact .form-success p:last-of-type {
    color: #555555 !important;
}


/* ------------------------------------------
   11. BOTTOM BAR (inside footer)
   ------------------------------------------ */
[data-theme="disruptor"] #contact .border-t.border-\[\#111111\],
[data-theme="disruptor"] #contact > .max-w-7xl.mx-auto.mt-40 {
    border-top-color: #333333 !important;
}

[data-theme="disruptor"] #contact .border-t.border-\[\#111111\] p,
[data-theme="disruptor"] #contact > .max-w-7xl.mx-auto.mt-40 p {
    color: #FFFFFF !important;
    font-family: 'Space Mono', monospace !important;
}

[data-theme="disruptor"] #contact .border-t.border-\[\#111111\] a,
[data-theme="disruptor"] #contact > .max-w-7xl.mx-auto.mt-40 a {
    color: #CCFF00 !important;
    font-family: 'Space Mono', monospace !important;
}

[data-theme="disruptor"] #contact .border-t.border-\[\#111111\] a:hover,
[data-theme="disruptor"] #contact > .max-w-7xl.mx-auto.mt-40 a:hover {
    text-decoration: underline !important;
    color: #CCFF00 !important;
}


/* ------------------------------------------
   12. SCROLL REVEAL OVERRIDES
   ------------------------------------------ */
[data-theme="disruptor"] .reveal {
    transition: opacity 0.3s ease, transform 0.3s ease !important;
}

[data-theme="disruptor"] .reveal.active {
    opacity: 1 !important;
    transform: translateY(0) !important;
    transition: opacity 0.3s ease, transform 0.3s ease !important;
}


/* ------------------------------------------
   13. GLOBAL LINK & BUTTON OVERRIDES
   ------------------------------------------ */

/* Override coral/accent link underlines */
[data-theme="disruptor"] .link-underline {
    color: #CCFF00 !important;
    text-decoration: none !important;
    border-bottom: 3px solid #CCFF00 !important;
    font-family: 'Space Mono', monospace !important;
    text-transform: uppercase !important;
    font-weight: 700 !important;
    letter-spacing: 0.05em !important;
}

[data-theme="disruptor"] .link-underline:hover {
    color: #FFFFFF !important;
    border-bottom-color: #FFFFFF !important;
}

/* Override magnetic-btn so it doesn't interfere */
[data-theme="disruptor"] .magnetic-btn {
    cursor: auto !important;
}

/* Generic button neo-brutalist pattern */
[data-theme="disruptor"] button:not(.theme-toggle):not(.form-submit) {
    border-radius: 0 !important;
}


/* ------------------------------------------
   14. SECTION DIVIDERS
   ------------------------------------------ */
/* Add heavy borders between major sections */
[data-theme="disruptor"] #about {
    border-top: 8px solid #000000 !important;
}

[data-theme="disruptor"] #services {
    border-top: 8px solid #000000 !important;
}

[data-theme="disruptor"] #work {
    border-top: 8px solid #000000 !important;
}


/* ------------------------------------------
   15. MISC OVERRIDES — PREVENT LEAKS
   ------------------------------------------ */

/* Override all #050505 backgrounds */
[data-theme="disruptor"] [class*="bg-[#050505]"],
[data-theme="disruptor"] .bg-\[\#050505\] {
    background-color: #121212 !important;
}

/* Override all #0a0a0a backgrounds */
[data-theme="disruptor"] [class*="bg-[#0a0a0a]"],
[data-theme="disruptor"] .bg-\[\#0a0a0a\] {
    background-color: #121212 !important;
}

/* Override all #111111 backgrounds (except where specifically styled) */
[data-theme="disruptor"] .bg-\[\#111111\] {
    background-color: #1a1a1a !important;
}

/* Override #1a1a1a backgrounds */
[data-theme="disruptor"] .bg-\[\#1a1a1a\] {
    background-color: #222222 !important;
}

/* Override coral/orange accent color everywhere */
[data-theme="disruptor"] .text-\[\#FF6B50\] {
    color: #CCFF00 !important;
}

[data-theme="disruptor"] .bg-\[\#FF6B50\] {
    background-color: #CCFF00 !important;
    color: #000000 !important;
}

[data-theme="disruptor"] .hover\:text-\[\#FF6B50\]:hover {
    color: #CCFF00 !important;
}

[data-theme="disruptor"] .hover\:bg-\[\#FF6B50\]:hover {
    background-color: #CCFF00 !important;
}

[data-theme="disruptor"] .border-\[\#FF6B50\] {
    border-color: #CCFF00 !important;
}

[data-theme="disruptor"] .group-hover\:border-\[\#FF6B50\] {
    border-color: #CCFF00 !important;
}

[data-theme="disruptor"] .group-hover\:text-\[\#FF6B50\] {
    color: #CCFF00 !important;
}

[data-theme="disruptor"] .group-hover\:bg-\[\#FF6B50\] {
    background-color: #CCFF00 !important;
}

/* Override #666666 text */
[data-theme="disruptor"] .text-\[\#666666\] {
    color: #999999 !important;
}

/* Override #888888 text */
[data-theme="disruptor"] .text-\[\#888888\] {
    color: #AAAAAA !important;
}

/* Override #444444 text */
[data-theme="disruptor"] .text-\[\#444444\] {
    color: #777777 !important;
}

/* Override #333333 borders */
[data-theme="disruptor"] .border-\[\#333333\] {
    border-color: #000000 !important;
}

[data-theme="disruptor"] .border-\[\#222222\] {
    border-color: #000000 !important;
}

[data-theme="disruptor"] .border-\[\#1a1a1a\] {
    border-color: #000000 !important;
}

[data-theme="disruptor"] .border-\[\#111111\] {
    border-color: #333333 !important;
}

/* Override purple gradients */
[data-theme="disruptor"] .from-\[\#4F46E5\],
[data-theme="disruptor"] .to-\[\#7C3AED\],
[data-theme="disruptor"] .bg-gradient-to-br.from-\[\#4F46E5\].to-\[\#7C3AED\] {
    background: #CCFF00 !important;
    background-image: none !important;
}

/* Override stat glow effect */
[data-theme="disruptor"] .stat-glow {
    text-shadow: none !important;
    filter: none !important;
}

/* Override radial gradient backgrounds */
[data-theme="disruptor"] [style*="radial-gradient"] {
    background: #121212 !important;
}

/* Override any remaining rounded-full for non-dot elements */
[data-theme="disruptor"] .rounded-full:not(.w-1):not(.h-1):not(.w-1\.5):not(.h-1\.5):not(.w-2):not(.h-2):not(.w-2\.5):not(.h-2\.5) {
    border-radius: 0 !important;
}

/* Small dots can keep their radius for visual purposes */
[data-theme="disruptor"] .w-1.h-1.rounded-full,
[data-theme="disruptor"] .w-1\.5.h-1\.5.rounded-full,
[data-theme="disruptor"] .w-2.h-2.rounded-full,
[data-theme="disruptor"] .w-2\.5.h-2\.5.rounded-full {
    border-radius: 0 !important;
}

/* Override hover:bg-white on nav CTA */
[data-theme="disruptor"] .hover\:bg-white:hover {
    background-color: #CCFF00 !important;
}

/* Override rounded-2xl and rounded-xl */
[data-theme="disruptor"] .rounded-2xl,
[data-theme="disruptor"] .rounded-xl,
[data-theme="disruptor"] .rounded-lg,
[data-theme="disruptor"] .rounded-\[2\.5rem\],
[data-theme="disruptor"] .rounded-\[2rem\] {
    border-radius: 0 !important;
}

/* Override shadow-2xl with neo-shadow */
[data-theme="disruptor"] .shadow-2xl {
    box-shadow: 8px 8px 0 #000000 !important;
}

/* Override all Tailwind text-white to ensure it stays white */
[data-theme="disruptor"] #about .text-white,
[data-theme="disruptor"] #services .text-white,
[data-theme="disruptor"] #work .text-white,
[data-theme="disruptor"] #contact .text-white {
    color: #FFFFFF !important;
}

/* Override Shopify green gradient */
[data-theme="disruptor"] .from-\[\#95BF47\],
[data-theme="disruptor"] .to-\[\#5E8E3E\] {
    background: #000000 !important;
    background-image: none !important;
}


/* ------------------------------------------
   16. RESPONSIVE ADJUSTMENTS
   ------------------------------------------ */
@media (max-width: 768px) {
    [data-theme="disruptor"] #heroText,
    [data-theme="disruptor"] .hero-text {
        font-size: clamp(50px, 15vw, 100px) !important;
        text-shadow: 4px 4px 0 #000000 !important;
    }

    [data-theme="disruptor"] header .relative.z-10::before {
        top: -25px !important;
        right: -10px !important;
        font-size: 8px !important;
        padding: 6px 12px !important;
        border-width: 3px !important;
    }

    [data-theme="disruptor"] #contact h2 {
        text-shadow: 4px 4px 0 #333333 !important;
    }

    [data-theme="disruptor"] #bottomNav {
        border-width: 3px !important;
        box-shadow: 6px 6px 0 #000000 !important;
    }

    /* Service cards stack — keep borders */
    [data-theme="disruptor"] #services .grid.grid-cols-1.md\:grid-cols-3 > div {
        border: 3px solid #000000 !important;
        margin-bottom: 8px !important;
    }

    /* Stats section borders */
    [data-theme="disruptor"] #stats {
        border-top-width: 6px !important;
        border-bottom-width: 6px !important;
    }
}

/* ==========================================
   STRUCTURAL LAYOUT OVERRIDES
   Full-bleed tension, asymmetric corners,
   compressed sections, edge-to-edge blocks
   ========================================== */

/* 1. HERO — extreme asymmetric tension */
[data-theme="disruptor"] header {
    display: grid !important;
    grid-template-rows: 1fr auto !important;
    grid-template-columns: 1fr 1fr !important;
    align-items: end !important;
    padding: 0 !important;
    position: relative !important;
}

[data-theme="disruptor"] header .relative.z-10 {
    grid-column: 1 / -1 !important;
    grid-row: 1 !important;
    padding: 0 48px 80px !important;
    align-self: end !important;
    z-index: 2 !important;
}

[data-theme="disruptor"] header h1,
[data-theme="disruptor"] header .hero-text {
    text-align: left !important;
    font-size: clamp(4rem, 15vw, 12rem) !important;
    line-height: 0.85 !important;
}

[data-theme="disruptor"] header #heroSub {
    text-align: left !important;
    opacity: 1 !important;
    transform: none !important;
}

/* Bold accent block filling right 40% of hero */
[data-theme="disruptor"] header::after {
    content: '' !important;
    position: absolute !important;
    top: 0 !important;
    right: 0 !important;
    width: 35% !important;
    height: 100% !important;
    background: #CCFF00 !important;
    z-index: 0 !important;
    pointer-events: none !important;
}

/* Hero tagline stays bottom-left */
[data-theme="disruptor"] header .absolute.bottom-12.left-8 {
    z-index: 3 !important;
}

/* Hero contact link on top of accent block */
[data-theme="disruptor"] header .absolute.bottom-12.right-8 {
    z-index: 3 !important;
}

[data-theme="disruptor"] header .absolute.bottom-12.right-8 a {
    color: #000000 !important;
}

/* Scroll indicator */
[data-theme="disruptor"] header .animate-bounce {
    z-index: 3 !important;
}
[data-theme="disruptor"] header .animate-bounce span,
[data-theme="disruptor"] header .animate-bounce iconify-icon {
    color: #000000 !important;
}

/* 2. ABOUT — reverse card order, full-bleed */
[data-theme="disruptor"] #about {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
}

[data-theme="disruptor"] #about > .flex,
[data-theme="disruptor"] #about > div:first-child {
    padding-left: 48px !important;
}

[data-theme="disruptor"] #about > h2 {
    padding-left: 48px !important;
    padding-right: 48px !important;
}

[data-theme="disruptor"] #about > .grid {
    grid-template-columns: 1fr 1fr !important;
    gap: 0 !important;
}

/* Reverse card order — mockup left, text right */
[data-theme="disruptor"] #about > .grid > .tilt-card:first-child {
    order: 2 !important;
}
[data-theme="disruptor"] #about > .grid > .tilt-card:last-child {
    order: 1 !important;
}

[data-theme="disruptor"] #about .tilt-card {
    min-height: 500px !important;
    border: 4px solid #000000 !important;
}

/* 3. STATS — horizontal ticker strip, edge-to-edge */
[data-theme="disruptor"] #stats {
    padding: 0 !important;
    max-width: 100% !important;
}

[data-theme="disruptor"] #stats > .max-w-7xl {
    max-width: 100% !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 0 !important;
}

[data-theme="disruptor"] #stats .text-center {
    padding: 32px 24px !important;
    border-right: 4px solid #000000 !important;
    text-align: left !important;
}

[data-theme="disruptor"] #stats .text-center:last-child {
    border-right: none !important;
}

/* 4. SERVICES — full-width vertical stack, no grid */
[data-theme="disruptor"] #services {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
}

[data-theme="disruptor"] #services > div:first-child,
[data-theme="disruptor"] #services > .flex {
    padding-left: 48px !important;
}

[data-theme="disruptor"] #services > h2 {
    padding-left: 48px !important;
    padding-right: 48px !important;
}

[data-theme="disruptor"] #services > .grid {
    grid-template-columns: 1fr !important;
    gap: 0 !important;
    border-radius: 0 !important;
}

[data-theme="disruptor"] #services > .grid > div {
    border-bottom: 4px solid #000000 !important;
    padding: 48px !important;
    display: grid !important;
    grid-template-columns: auto 1fr auto !important;
    gap: 24px !important;
    align-items: start !important;
}

/* Service sub-items flow horizontally */
[data-theme="disruptor"] #services > .grid > div > .mt-auto {
    margin-top: 0 !important;
    padding-top: 0 !important;
    border-top: none !important;
}

/* Shopify callout — full-width banner */
[data-theme="disruptor"] #services > .mt-8 {
    margin-top: 0 !important;
    padding: 0 !important;
}

[data-theme="disruptor"] #services > .mt-8 .tilt-card {
    border: none !important;
    border-top: 4px solid #000000 !important;
    border-bottom: 4px solid #000000 !important;
    padding: 48px !important;
}

/* 5. PORTFOLIO — overlapping, intentionally misaligned */
[data-theme="disruptor"] #work {
    padding-left: 48px !important;
    padding-right: 48px !important;
    max-width: 100% !important;
}

[data-theme="disruptor"] #work > .grid {
    gap: 0 !important;
    grid-template-columns: 1fr 1fr !important;
}

/* First project pushes right */
[data-theme="disruptor"] #work article:first-child {
    transform: translateX(30px) !important;
    z-index: 2 !important;
    position: relative !important;
}

/* Second project pushes left and overlaps */
[data-theme="disruptor"] #work article:nth-child(2) {
    transform: translate(-30px, -40px) !important;
    z-index: 1 !important;
    margin-top: 0 !important;
}

[data-theme="disruptor"] #work article .aspect-\[4\/3\] {
    border: 4px solid #000000 !important;
}

/* Kill all hover transitions — instant snap */
[data-theme="disruptor"] #work article * {
    transition-duration: 0ms !important;
}

/* 6. FOOTER — huge headline, form becomes sidebar */
[data-theme="disruptor"] #contact {
    padding-left: 0 !important;
    padding-right: 0 !important;
    max-width: 100% !important;
}

[data-theme="disruptor"] #contact > div {
    max-width: 100% !important;
    display: grid !important;
    grid-template-columns: 2fr 1fr !important;
    gap: 0 !important;
    align-items: start !important;
}

/* Left column — huge CTA */
[data-theme="disruptor"] #contact > div > .flex-1 {
    padding: 48px !important;
    border-right: 4px solid #000000 !important;
}

/* CTA headline fills the space */
[data-theme="disruptor"] #contact h2 {
    font-size: clamp(4rem, 12vw, 10rem) !important;
    line-height: 0.85 !important;
}

/* Right column — form strip */
[data-theme="disruptor"] #contact > div > .w-full {
    width: 100% !important;
    padding: 48px 32px !important;
    border-left: none !important;
    background: #1a1a1a !important;
    min-height: 100% !important;
}

/* Footer bottom bar — edge-to-edge */
[data-theme="disruptor"] #contact .border-t {
    max-width: 100% !important;
    padding-left: 48px !important;
    padding-right: 48px !important;
}

/* 7. NAV — heavy thick */
[data-theme="disruptor"] #topNav {
    padding: 16px 48px !important;
}

/* Bottom nav — chunky */
[data-theme="disruptor"] #bottomNav {
    bottom: 16px !important;
}

/* 8. RESPONSIVE */
@media (max-width: 768px) {
    [data-theme="disruptor"] header::after {
        width: 30% !important;
    }

    [data-theme="disruptor"] header .relative.z-10 {
        padding: 0 24px 60px !important;
    }

    [data-theme="disruptor"] #about > .grid {
        grid-template-columns: 1fr !important;
    }

    [data-theme="disruptor"] #about > .flex,
    [data-theme="disruptor"] #about > div:first-child,
    [data-theme="disruptor"] #about > h2 {
        padding-left: 24px !important;
        padding-right: 24px !important;
    }

    [data-theme="disruptor"] #stats > .max-w-7xl {
        grid-template-columns: repeat(2, 1fr) !important;
    }

    [data-theme="disruptor"] #stats .text-center {
        border-bottom: 4px solid #000000 !important;
    }

    [data-theme="disruptor"] #services > .grid > div {
        grid-template-columns: 1fr !important;
        padding: 24px !important;
    }

    [data-theme="disruptor"] #services > div:first-child,
    [data-theme="disruptor"] #services > .flex,
    [data-theme="disruptor"] #services > h2 {
        padding-left: 24px !important;
        padding-right: 24px !important;
    }

    [data-theme="disruptor"] #work {
        padding-left: 16px !important;
        padding-right: 16px !important;
    }

    [data-theme="disruptor"] #work article:first-child,
    [data-theme="disruptor"] #work article:nth-child(2) {
        transform: none !important;
    }

    [data-theme="disruptor"] #work > .grid {
        grid-template-columns: 1fr !important;
    }

    [data-theme="disruptor"] #contact > div {
        grid-template-columns: 1fr !important;
    }

    [data-theme="disruptor"] #contact > div > .flex-1 {
        padding: 24px !important;
        border-right: none !important;
        border-bottom: 4px solid #000000 !important;
    }

    [data-theme="disruptor"] #contact > div > .w-full {
        padding: 24px !important;
    }
}


/* ==========================================
   ABOUT.HTML — STRUCTURAL OVERRIDES
   Full-bleed brutalist layout for about page
   ========================================== */

/* About hero — full-bleed, edge-to-edge */
[data-theme="disruptor"] header.relative.pt-48 {
    max-width: 100% !important;
    padding-left: 48px !important;
    padding-right: 48px !important;
    border-bottom: 4px solid #000000 !important;
}

[data-theme="disruptor"] header.relative.pt-48 h1 {
    font-size: clamp(3rem, 10vw, 8rem) !important;
    line-height: 0.9 !important;
}

/* Our Story — full-bleed with thick divider */
[data-theme="disruptor"] section.border-t {
    max-width: 100% !important;
    padding-left: 48px !important;
    padding-right: 48px !important;
    border-top-width: 4px !important;
    border-color: #000000 !important;
}

/* Story grid — reverse order */
[data-theme="disruptor"] section.border-t .grid.grid-cols-1.md\:grid-cols-2 {
    direction: rtl !important;
}

[data-theme="disruptor"] section.border-t .grid.grid-cols-1.md\:grid-cols-2 > * {
    direction: ltr !important;
}

/* Stats boxes — thick borders */
[data-theme="disruptor"] section.border-t .grid.grid-cols-2 > div {
    border: 3px solid #000000 !important;
}

/* Team section — full-bleed */
[data-theme="disruptor"] section .grid.grid-cols-1.md\:grid-cols-3 {
    gap: 0 !important;
}

/* Team cards — thick borders, no gap */
[data-theme="disruptor"] section .grid.grid-cols-1.md\:grid-cols-3 > .tilt-card {
    border: 3px solid #000000 !important;
    margin: -1.5px !important;
}

/* About footer — huge CTA */
[data-theme="disruptor"] footer .max-w-7xl.text-center h2 {
    font-size: clamp(3rem, 10vw, 8rem) !important;
    line-height: 0.9 !important;
}

@media (max-width: 768px) {
    [data-theme="disruptor"] header.relative.pt-48 {
        padding-left: 24px !important;
        padding-right: 24px !important;
    }

    [data-theme="disruptor"] section.border-t {
        padding-left: 24px !important;
        padding-right: 24px !important;
    }
}
