Update src/app/styles/variables.css

Update src/app/page.tsx
Update src/app/layout.tsx
2026-03-03 07:03:16 +00:00 · 2026-03-03 07:03:15 +00:00 · 2026-03-03 07:03:15 +00:00 · 2026-03-03 06:58:27 +00:00 · 2026-03-03 06:58:23 +00:00 · 2026-03-03 06:53:30 +00:00
4 changed files with 236 additions and 83 deletions
--- a/src/app/layout.tsx
+++ b/src/app/layout.tsx
@@ -1,14 +1,17 @@
 import type { Metadata } from "next";
-import { Halant } from "next/font/google";
+import { DM_Sans } from "next/font/google";
 import { Inter } from "next/font/google";
-import { Nunito_Sans } from "next/font/google";
 import "./globals.css";
 import { ServiceWrapper } from "@/components/ServiceWrapper";
 import Tag from "@/tag/Tag";
-import { Open_Sans } from "next/font/google";
-

+const dmSans = DM_Sans({
+  variable: "--font-dm-sans",  subsets: ["latin"],
+});

+const inter = Inter({
+  variable: "--font-inter",  subsets: ["latin"],
+});

 export const metadata: Metadata = {
  title: "UNBRKABLE Pre-Order Waitlist - March 15, 2026",  description: "Join the UNBRKABLE waitlist and be the first to know. Exclusive pre-order access launching March 15, 2026. Limited availability.",  keywords: "UNBRKABLE, pre-order, waitlist, exclusive, launch, 2026",  metadataBase: new URL("https://unbrkable.com"),
@@ -24,15 +27,6 @@ export const metadata: Metadata = {
  },
 };

-const inter = Inter({
-  variable: "--font-inter",
-  subsets: ["latin"],
-});
-const openSans = Open_Sans({
-  variable: "--font-open-sans",
-  subsets: ["latin"],
-});
-
 export default function RootLayout({
  children,
 }: Readonly<{
@@ -41,7 +35,7 @@ export default function RootLayout({
  return (
    <html lang="en" suppressHydrationWarning>
      <ServiceWrapper>
-        <body className={`${inter.variable} ${openSans.variable} antialiased`}>
+        <body className={`${dmSans.variable} ${inter.variable} antialiased`}>
          <Tag />
          {children}
        
@@ -286,7 +280,9 @@ export default function RootLayout({
  const getElementInfo = (element, assignId = false) => {
    const rect = element.getBoundingClientRect();
    const tagName = element.tagName.toLowerCase();
-            
+    const selector = getUniqueSelector(element, assignId);
+    const sectionId = getSectionId(element);
+    
    let className = undefined;
    try {
      if (element.className) {
@@ -314,7 +310,8 @@ export default function RootLayout({
    };
    
    if (tagName === 'img') {
-            info.imageData = {
+      const originalSrc = extractOriginalUrl(element.src);
+      info.imageData = {
        src: originalSrc,
        alt: element.alt || undefined,
        naturalWidth: element.naturalWidth,
@@ -325,7 +322,8 @@ export default function RootLayout({

    if (tagName === 'video') {
      const rawSrc = element.src || element.currentSrc || (element.querySelector('source') && element.querySelector('source').src) || '';
-            info.imageData = {
+      const resolvedSrc = extractOriginalUrl(rawSrc);
+      info.imageData = {
        src: resolvedSrc,
        alt: element.getAttribute('aria-label') || undefined,
        isBackground: false,
@@ -338,7 +336,8 @@ export default function RootLayout({
    if (backgroundImage && backgroundImage !== 'none') {
      const urlMatch = backgroundImage.match(/url(['"]?([^'")]+)['"]?)/);
      if (urlMatch) {
-                if (tagName !== 'img') {
+        const originalBgSrc = extractOriginalUrl(urlMatch[1]);
+        if (tagName !== 'img') {
          info.imageData = {
            src: originalBgSrc,
            isBackground: true
@@ -350,7 +349,8 @@ export default function RootLayout({
      }
    }
    
-        info.elementType = elementType;
+    const elementType = getElementType(element);
+    info.elementType = elementType;
    
    if (elementType === 'Button') {
      const buttonText = element.textContent?.trim() || element.value || element.getAttribute('aria-label') || '';
@@ -443,11 +443,13 @@ export default function RootLayout({
  };

  const isTextElement = (element) => {
-        return elementType === 'Text';
+    const elementType = getElementType(element);
+    return elementType === 'Text';
  };

  const isButtonElement = (element) => {
-        return elementType === 'Button';
+    const elementType = getElementType(element);
+    return elementType === 'Button';
  };

  const updateButtonText = (element, newText) => {
@@ -522,7 +524,8 @@ export default function RootLayout({
    };
    
    const handleInput = () => {
-            let currentText = element.textContent;
+      const elementInfo = getElementInfo(element);
+      let currentText = element.textContent;
      
      // Ensure there's always at least a space to keep the element editable
      if (currentText === '' || currentText === null || currentText.length === 0) {
@@ -635,7 +638,8 @@ export default function RootLayout({
    }, '*');
    
    if (save && originalContent !== element.textContent) {
-            let finalText = element.textContent;
+      const elementInfo = getElementInfo(element);
+      let finalText = element.textContent;
      
      // Trim the final text and convert space-only to empty string for saving
      if (finalText === ' ' || finalText.trim() === '') {
@@ -764,7 +768,7 @@ export default function RootLayout({
    lastMouseX = e.clientX;
    lastMouseY = e.clientY;

-    || e.target;
+    const target = getMostSpecificElement(e.clientX, e.clientY) || e.target;

    if (!isValidElement(target) || target === hoveredElement || target === selectedElement) {
      return;
@@ -796,7 +800,8 @@ export default function RootLayout({
      hoverOverlay = createHoverOverlay(target);
    }
    
-        showElementTypeLabel(target, elementType);
+    const elementType = getElementType(target);
+    showElementTypeLabel(target, elementType);
    
    window.parent.postMessage({
      type: 'webild-element-hover',
@@ -838,7 +843,7 @@ export default function RootLayout({
  e.preventDefault();
  e.stopPropagation();

-  || e.target;  
+  const target = getMostSpecificElement(e.clientX, e.clientY) || e.target;  
  if (!isValidElement(target)) return;
    
    if (selectedElement && selectedElement !== target) {
@@ -883,7 +888,8 @@ export default function RootLayout({
      hoveredElement = null;
    }
    
-        selectedElement.dataset.webildSelector = elementInfo.selector;
+    const elementInfo = getElementInfo(target, true);
+    selectedElement.dataset.webildSelector = elementInfo.selector;
    showElementTypeLabel(target, elementInfo.elementType);
    
    window.parent.postMessage({
@@ -966,7 +972,8 @@ export default function RootLayout({
      isScrolling = false;

      if (lastMouseX > 0 && lastMouseY > 0) {
-                if (target && isValidElement(target) && target !== selectedElement) {
+        const target = getMostSpecificElement(lastMouseX, lastMouseY);
+        if (target && isValidElement(target) && target !== selectedElement) {
          hoveredElement = target;

          const computedStyle = window.getComputedStyle(target);
@@ -980,7 +987,8 @@ export default function RootLayout({
          hoveredElement.classList.add(hoverClass);
          hoverOverlay = createHoverOverlay(target);

-                    showElementTypeLabel(target, elementType);
+          const elementType = getElementType(target);
+          showElementTypeLabel(target, elementType);

          window.parent.postMessage({
            type: 'webild-element-hover',
@@ -1003,7 +1011,8 @@ export default function RootLayout({

  const saveChangeToStorage = (change) => {
    try {
-            const existingChanges = JSON.parse(localStorage.getItem(storageKey) || '[]');
+      const storageKey = getStorageKey();
+      const existingChanges = JSON.parse(localStorage.getItem(storageKey) || '[]');

      const filteredChanges = existingChanges.filter(c => {
        return !(c.oldValue === change.oldValue && c.sectionId === change.sectionId);
@@ -1023,7 +1032,8 @@ export default function RootLayout({

  const clearLocalChanges = () => {
    try {
-            localStorage.removeItem(storageKey);
+      const storageKey = getStorageKey();
+      localStorage.removeItem(storageKey);
      window.parent.postMessage({
        type: 'webild-local-changes-cleared',
        data: {}
@@ -1072,7 +1082,8 @@ export default function RootLayout({

    if (e.data.type === 'webild-cancel-changes') {
      try {
-                const savedChanges = localStorage.getItem(storageKey);
+        const storageKey = getStorageKey();
+        const savedChanges = localStorage.getItem(storageKey);
        if (savedChanges) {
          const changes = JSON.parse(savedChanges);
          changes.forEach(change => {
@@ -1094,7 +1105,8 @@ export default function RootLayout({
                if (isBackground) {
                  element.style.backgroundImage = change.oldValue ? 'url(' + change.oldValue + ')' : '';
                } else {
-                                    if (revertTag === 'video' && oldMediaType === 'image') {
+                  const oldMediaType = getMediaTypeFromUrl(change.oldValue);
+                  if (revertTag === 'video' && oldMediaType === 'image') {
                    swapMediaElement(element, 'img', change.oldValue);
                  } else if (revertTag === 'img' && oldMediaType === 'video') {
                    swapMediaElement(element, 'video', change.oldValue);
@@ -1142,7 +1154,8 @@ export default function RootLayout({
              const el = textElements[i];
              if (isTextElement(el) && el.textContent.trim() === (oldValue || '').trim()) {
                element = el;
-                                if (newSelector) {
+                const newSelector = getUniqueSelector(element, true);
+                if (newSelector) {
                  element.dataset.webildSelector = newSelector;
                }
                break;
@@ -1233,8 +1246,10 @@ export default function RootLayout({
          replaced = true;
        } else if (element.tagName.toLowerCase() === 'img') {
          oldValue = element.src;
-                    if (newMediaType === 'video' && allowMediaTypeSwap) {
-                        if (selectedElement === element) selectedElement = swapped;
+          const newMediaType = getMediaTypeFromUrl(newSrc);
+          if (newMediaType === 'video' && allowMediaTypeSwap) {
+            const swapped = swapMediaElement(element, 'video', newSrc);
+            if (selectedElement === element) selectedElement = swapped;
            element = swapped;
          } else {
            element.src = newSrc;
@@ -1242,9 +1257,11 @@ export default function RootLayout({
          replaced = true;
        } else if (element.tagName.toLowerCase() === 'video') {
          oldValue = element.src || element.currentSrc || '';
-                    const sources = element.querySelectorAll('source');
+          const newMediaType = getMediaTypeFromUrl(newSrc);
+          const sources = element.querySelectorAll('source');
          if (newMediaType === 'image' && allowMediaTypeSwap) {
-                        if (selectedElement === element) selectedElement = swapped;
+            const swapped = swapMediaElement(element, 'img', newSrc);
+            if (selectedElement === element) selectedElement = swapped;
            element = swapped;
          } else {
            if (sources.length > 0) {
@@ -1266,7 +1283,8 @@ export default function RootLayout({
        }

        if (replaced) {
-          
+          const elementInfo = getElementInfo(element);
+
          let cleanOldValue = oldValue;
          if (oldValue.includes('url(')) {
            const urlMatch = oldValue.match(/url(['"]?([^'")]+)['"]?)/);
@@ -1337,7 +1355,13 @@ export default function RootLayout({
    }
  }, true);
  
-    
+  const urlCheckInterval = setInterval(() => {
+    if (lastPathname !== window.location.pathname) {
+      lastPathname = window.location.pathname;
+      notifyPageChange();
+    }
+  }, 500);
+  
  notifyPageChange();
  
  window.webildCleanup = () => {
--- a/src/app/page.tsx
+++ b/src/app/page.tsx
@@ -6,20 +6,49 @@ import HeroBillboardCarousel from "@/components/sections/hero/HeroBillboardCarou
 import ProductCardThree from "@/components/sections/product/ProductCardThree";
 import SocialProofOne from "@/components/sections/socialProof/SocialProofOne";
 import FooterCard from "@/components/sections/footer/FooterCard";
-import { Instagram } from "lucide-react";
+import { Instagram, Clock } from "lucide-react";
+import { useEffect, useState } from "react";

 export default function LandingPage() {
+  const [timeLeft, setTimeLeft] = useState({
+    days: 0,
+    hours: 0,
+    minutes: 0,
+    seconds: 0,
+  });
+
+  useEffect(() => {
+    const calculateTimeLeft = () => {
+      const targetDate = new Date("2026-03-15T15:00:00+01:00").getTime();
+      const now = new Date().getTime();
+      const difference = targetDate - now;
+
+      if (difference > 0) {
+        setTimeLeft({
+          days: Math.floor(difference / (1000 * 60 * 60 * 24)),
+          hours: Math.floor((difference / (1000 * 60 * 60)) % 24),
+          minutes: Math.floor((difference / 1000 / 60) % 60),
+          seconds: Math.floor((difference / 1000) % 60),
+        });
+      }
+    };
+
+    calculateTimeLeft();
+    const timer = setInterval(calculateTimeLeft, 1000);
+    return () => clearInterval(timer);
+  }, []);
+
  return (
    <ThemeProvider
-      defaultButtonVariant="text-shift"
-      defaultTextAnimation="background-highlight"
+      defaultButtonVariant="icon-arrow"
+      defaultTextAnimation="reveal-blur"
      borderRadius="rounded"
-      contentWidth="smallMedium"
-      sizing="largeSmall"
-      background="circleGradient"
-      cardStyle="gradient-mesh"
-      primaryButtonStyle="primary-glow"
-      secondaryButtonStyle="solid"
+      contentWidth="medium"
+      sizing="large"
+      background="none"
+      cardStyle="glass-elevated"
+      primaryButtonStyle="radial-glow"
+      secondaryButtonStyle="glass"
      headingFontWeight="bold"
    >
      <div id="nav" data-section="nav">
@@ -40,35 +69,135 @@ export default function LandingPage() {
          tag="PRE-ORDER COMING SOON"
          tagAnimation="slide-up"
          title="UNBRKABLE"
-          description="Countdown to launch"
+          description="Resilience Engineered. Premium Streetwear Redefined."
          background={{ variant: "sparkles-gradient" }}
          mediaItems={[
            {
-              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AP7wU63U5Z6xUyQgGM5ThlIUPo/uploaded-1772520151997-tdn3qcwt.png",              imageAlt: "UNBRKABLE Hero"},
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/water-drop-body-water_417767-87.jpg",              imageAlt: "dark cinematic luxury premium background"},
-            {
-              imageSrc: "http://img.b2bpic.net/free-photo/burning-paper-background-still-life_23-2150093336.jpg",              imageAlt: "glass molten preview product teaser"},
-            {
-              imageSrc: "http://img.b2bpic.net/free-vector/creative-realistic-teaser-background_23-2148903983.jpg?_wi=1",              imageAlt: "product coming soon glass display"},
-            {
-              imageSrc: "http://img.b2bpic.net/free-vector/creative-realistic-teaser-background_23-2148903983.jpg?_wi=2",              imageAlt: "product coming soon glass display"},
+              imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3AP7wU63U5Z6xUyQgGM5ThlIUPo/uploaded-1772520151997-tdn3qcwt.png",              imageAlt: "UNBRKABLE Logo"},
          ]}
          buttonAnimation="slide-up"
-          buttons={[{ text: "BE THE FIRST TO KNOW", href: "#email-capture" }]}
+          buttons={[{ text: "JOIN WAITLIST NOW", href: "#email-capture" }]}
          className="min-h-screen flex items-center justify-center"
-          containerClassName="max-w-4xl mx-auto px-6"
-          titleClassName="text-6xl md:text-8xl font-bold tracking-wide mb-8 drop-shadow-lg"
-          descriptionClassName="hidden"
-          tagClassName="text-sm md:text-base font-semibold tracking-widest uppercase mb-6 text-accent"
+          containerClassName="max-w-6xl mx-auto px-6"
+          titleClassName="text-6xl md:text-8xl font-bold tracking-wider mb-8 drop-shadow-2xl"
+          descriptionClassName="text-lg md:text-2xl text-accent/80 mb-12 font-light tracking-wide"
+          tagClassName="text-xs md:text-sm font-semibold tracking-widest uppercase mb-6 text-accent"
        />
      </div>

+      <div
+        id="countdown"
+        data-section="countdown"
+        className="relative w-full py-20 px-6 overflow-hidden"
+        style={{
+          background: "radial-gradient(circle at 50% 50%, rgba(255, 255, 255, 0.1) 0%, transparent 70%)"}}
+      >
+        <div className="max-w-4xl mx-auto">
+          <div className="flex items-center justify-center gap-4 mb-12">
+            <Clock className="w-6 h-6 text-accent" />
+            <h2 className="text-3xl md:text-4xl font-bold text-foreground">LAUNCHING MARCH 15, 2026 AT 3:00 PM CET</h2>
+          </div>
+          <div className="grid grid-cols-4 gap-4 md:gap-6">
+            {[
+              { label: "DAYS", value: timeLeft.days },
+              { label: "HOURS", value: timeLeft.hours },
+              { label: "MINUTES", value: timeLeft.minutes },
+              { label: "SECONDS", value: timeLeft.seconds },
+            ].map((unit, idx) => (
+              <div
+                key={idx}
+                className="relative group backdrop-blur-xl bg-gradient-to-b from-white/20 to-white/5 border border-white/30 rounded-2xl p-4 md:p-6 text-center"
+                style={{
+                  boxShadow:
+                    "0 8px 32px rgba(255, 255, 255, 0.15), inset 0 1px 1px rgba(255, 255, 255, 0.2)"}}
+              >
+                <div
+                  className="absolute inset-0 rounded-2xl opacity-0 group-hover:opacity-100 transition-opacity duration-300"
+                  style={{
+                    background: "radial-gradient(circle at 50% 0%, rgba(255, 255, 255, 0.3) 0%, transparent 70%)"}}
+                />
+                <div className="relative">
+                  <div className="text-4xl md:text-5xl font-bold text-accent mb-2">
+                    {String(unit.value).padStart(2, "0")}
+                  </div>
+                  <div className="text-xs md:text-sm font-semibold tracking-widest text-foreground/60 uppercase">
+                    {unit.label}
+                  </div>
+                </div>
+              </div>
+            ))}
+          </div>
+        </div>
+      </div>
+
+      <div id="email-capture" data-section="email-capture" className="relative w-full py-20 px-6">
+        <div className="max-w-2xl mx-auto">
+          <div
+            className="backdrop-blur-xl bg-gradient-to-b from-white/20 to-white/5 border border-white/30 rounded-3xl p-8 md:p-12"
+            style={{
+              boxShadow:
+                "0 8px 32px rgba(255, 255, 255, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.2)"}}
+          >
+            <h2 className="text-3xl md:text-4xl font-bold text-foreground mb-4 text-center">GET EXCLUSIVE ACCESS</h2>
+            <p className="text-base md:text-lg text-foreground/70 text-center mb-8">
+              Join our waitlist and be among the first to experience UNBRKABLE
+            </p>
+            <form
+              className="flex flex-col gap-4 mb-6"
+              onSubmit={(e) => {
+                e.preventDefault();
+                console.log("Email captured");
+              }}
+            >
+              <input
+                type="email"
+                placeholder="Enter your email"
+                className="w-full px-6 py-3 rounded-lg bg-white/10 border border-white/20 text-foreground placeholder:text-foreground/50 focus:outline-none focus:border-accent/50 transition-colors"
+                required
+              />
+              <button
+                type="submit"
+                className="w-full px-6 py-3 rounded-lg bg-gradient-to-r from-accent to-accent/80 text-background font-bold hover:shadow-lg transition-shadow"
+              >
+                JOIN WAITLIST
+              </button>
+            </form>
+            <p className="text-xs text-foreground/50 text-center">✓ We respect your privacy. Unsubscribe at any time.</p>
+          </div>
+        </div>
+      </div>
+
+      <div id="video-teaser" data-section="video-teaser" className="relative w-full py-20 px-6">
+        <div className="max-w-4xl mx-auto">
+          <div className="text-center mb-12">
+            <h2 className="text-3xl md:text-4xl font-bold text-foreground mb-4">UNBREAKABLE RESILIENCE</h2>
+            <p className="text-base md:text-lg text-foreground/70">
+              Designed for those who never back down. Premium streetwear built to last through anything.
+            </p>
+          </div>
+          <div
+            className="backdrop-blur-xl bg-gradient-to-b from-white/10 to-white/5 border border-white/30 rounded-3xl overflow-hidden"
+            style={{
+              boxShadow:
+                "0 8px 32px rgba(255, 255, 255, 0.1), inset 0 1px 1px rgba(255, 255, 255, 0.2)"}}
+          >
+            <div className="aspect-video bg-gradient-to-b from-black/40 to-black/60 flex items-center justify-center">
+              <div className="text-center text-white">
+                <svg className="w-20 h-20 mx-auto mb-4 opacity-80" fill="currentColor" viewBox="0 0 20 20">
+                  <path d="M6.3 2.841A1.5 1.5 0 004 4.11V15.89a1.5 1.5 0 002.3 1.269l9.344-5.89a1.5 1.5 0 000-2.538L6.3 2.84z" />
+                </svg>
+                <p className="text-sm font-semibold">TEASER VIDEO</p>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+
      <div id="teaser" data-section="teaser">
        <ProductCardThree
          title="COMING SOON"
-          description="Discover what's next"
-          tag="PRODUCT TEASER"
+          description="Discover our premium collection launching exclusively on March 15, 2026"
+          tag="PRODUCT PREVIEW"
          tagAnimation="slide-up"
          animationType="slide-up"
          textboxLayout="default"
@@ -93,12 +222,12 @@ export default function LandingPage() {
      <div id="social-proof" data-section="social-proof">
        <SocialProofOne
          title="FOLLOW THE MOVEMENT"
-          description="Stay connected with UNBRKABLE updates and exclusive previews"
+          description="Stay connected with UNBRKABLE updates and exclusive previews on Instagram"
          tag="INSTAGRAM"
          tagAnimation="slide-up"
          textboxLayout="default"
          useInvertedBackground={false}
-          names={["UNBRKABLE", "PREMIUM", "EXCLUSIVE", "LAUNCH", "MARCH 2026"]}
+          names={["@UNBRKABLE", "PREMIUM", "EXCLUSIVE", "LAUNCH", "MARCH 2026"]}
          speed={40}
          showCard={true}
          containerClassName="py-16 px-6"
@@ -117,7 +246,7 @@ export default function LandingPage() {
              href: "https://instagram.com/unbrkable",              ariaLabel: "Instagram"},
          ]}
          containerClassName="py-12 px-6"
-          cardClassName="max-w-4xl mx-auto backdrop-blur-md bg-white/10 rounded-2xl border border-white/20"
+          cardClassName="max-w-4xl mx-auto backdrop-blur-xl bg-gradient-to-b from-white/20 to-white/5 rounded-3xl border border-white/30 p-8"
          logoClassName="text-2xl font-bold tracking-widest text-accent mb-6"
          copyrightTextClassName="text-sm text-accent/60"
        />
--- a/src/app/styles/base.css
+++ b/src/app/styles/base.css
@@ -11,7 +11,7 @@ html {
 body {
  background-color: var(--background);
  color: var(--foreground);
-  font-family: var(--font-open-sans), sans-serif;
+  font-family: var(--font-dm-sans), sans-serif;
  position: relative;
  min-height: 100vh;
  overscroll-behavior: none;
@@ -24,5 +24,5 @@ h3,
 h4,
 h5,
 h6 {
-  font-family: var(--font-inter), sans-serif;
+  font-family: var(--font-dm-sans), sans-serif;
 }
--- a/src/app/styles/variables.css
+++ b/src/app/styles/variables.css
@@ -2,23 +2,23 @@
  /* Base units */
  /* --vw is set by ThemeProvider */

-  /* --background: #f5f4ef;;
-  --card: #dad6cd;;
-  --foreground: #2a2928;;
-  --primary-cta: #2a2928;;
-  --secondary-cta: #ecebea;;
+  /* --background: #000000;;
+  --card: #0c0c0c;;
+  --foreground: #ffffff;;
+  --primary-cta: #ffffff;;
+  --secondary-cta: #000000;;
  --accent: #ffffff;;
-  --background-accent: #c6b180;; */
+  --background-accent: #ffffff;; */

-  --background: #f5f4ef;;
-  --card: #dad6cd;;
-  --foreground: #2a2928;;
-  --primary-cta: #2a2928;;
+  --background: #000000;;
+  --card: #0c0c0c;;
+  --foreground: #ffffff;;
+  --primary-cta: #ffffff;;
  --primary-cta-text: #f5f4ef;;
-  --secondary-cta: #ecebea;;
+  --secondary-cta: #000000;;
  --secondary-cta-text: #2a2928;;
  --accent: #ffffff;;
-  --background-accent: #c6b180;;
+  --background-accent: #ffffff;;

  /* text sizing - set by ThemeProvider */
  /* --text-2xs: clamp(0.465rem, 0.62vw, 0.62rem);
Author	SHA1	Message	Date
bender	42485fc2cf	Update src/app/styles/variables.css	2026-03-03 07:03:16 +00:00
bender	8f044e8bc2	Update src/app/page.tsx	2026-03-03 07:03:15 +00:00
bender	430b239c6e	Update src/app/layout.tsx	2026-03-03 07:03:15 +00:00
bender	2f20d938ed	Merge version_3 into main Merge version_3 into main	2026-03-03 06:58:27 +00:00
bender	9e29cbaa8c	Update src/app/page.tsx	2026-03-03 06:58:23 +00:00
bender	40d895e222	Merge version_2 into main Merge version_2 into main	2026-03-03 06:53:30 +00:00
bender	16dbd0fa09	Update src/app/styles/variables.css	2026-03-03 06:53:26 +00:00
bender	4c375d68d7	Update src/app/styles/base.css	2026-03-03 06:53:25 +00:00
bender	2ca35ac6b3	Update src/app/page.tsx	2026-03-03 06:53:24 +00:00
bender	6525066940	Update src/app/layout.tsx	2026-03-03 06:53:24 +00:00
bender	5a9fc3a28a	Merge version_1 into main Merge version_1 into main	2026-03-03 06:50:18 +00:00
bender	48c8aede9e	Merge version_1 into main Merge version_1 into main	2026-03-03 06:46:19 +00:00
bender	e4ab5ba43b	Merge version_1 into main Merge version_1 into main	2026-03-03 06:44:47 +00:00
bender	57bcce139c	Merge version_1 into main Merge version_1 into main	2026-03-03 06:43:26 +00:00