Replace the landing with the artifact design and rebuild the admin in Ant Design.
Adds consultation leads, section editors, and the one-time content reset for this release. Co-authored-by: Cursor <cursoragent@cursor.com>
This commit is contained in:
Cursor
@@ -1,65 +1,7 @@
|
||||
/* IRANSans (FaNum) — local webfonts; paths quoted for special characters */
|
||||
@font-face {
|
||||
font-family: "IRANSans";
|
||||
src: url("../fonts/iranSans/woff2/IRANSansWeb(FaNum)_UltraLight.woff2") format("woff2"),
|
||||
url("../fonts/iranSans/woff/IRANSansWeb(FaNum)_UltraLight.woff") format("woff");
|
||||
font-weight: 200;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
@font-face {
|
||||
font-family: "IRANSans";
|
||||
src: url("../fonts/iranSans/woff2/IRANSansWeb(FaNum)_Light.woff2") format("woff2"),
|
||||
url("../fonts/iranSans/woff/IRANSansWeb(FaNum)_Light.woff") format("woff");
|
||||
font-weight: 300;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
@font-face {
|
||||
font-family: "IRANSans";
|
||||
src: url("../fonts/iranSans/woff2/IRANSansWeb(FaNum).woff2") format("woff2"),
|
||||
url("../fonts/iranSans/woff/IRANSansWeb(FaNum).woff") format("woff");
|
||||
font-weight: 400;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
@font-face {
|
||||
font-family: "IRANSans";
|
||||
src: url("../fonts/iranSans/woff2/IRANSansWeb(FaNum)_Medium.woff2") format("woff2"),
|
||||
url("../fonts/iranSans/woff/IRANSansWeb(FaNum)_Medium.woff") format("woff");
|
||||
font-weight: 500;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
@font-face {
|
||||
font-family: "IRANSans";
|
||||
src: url("../fonts/iranSans/woff2/IRANSansWeb(FaNum)_Medium.woff2") format("woff2"),
|
||||
url("../fonts/iranSans/woff/IRANSansWeb(FaNum)_Medium.woff") format("woff");
|
||||
font-weight: 600;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
@font-face {
|
||||
font-family: "IRANSans";
|
||||
src: url("../fonts/iranSans/woff2/IRANSansWeb(FaNum)_Bold.woff2") format("woff2"),
|
||||
url("../fonts/iranSans/woff/IRANSansWeb(FaNum)_Bold.woff") format("woff");
|
||||
font-weight: 700;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
@font-face {
|
||||
font-family: "IRANSans";
|
||||
src: url("../fonts/iranSans/woff2/IRANSansWeb(FaNum)_Black.woff2") format("woff2"),
|
||||
url("../fonts/iranSans/woff/IRANSansWeb(FaNum)_Black.woff") format("woff");
|
||||
font-weight: 800;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
@font-face {
|
||||
font-family: "IRANSans";
|
||||
src: url("../fonts/iranSans/woff2/IRANSansWeb(FaNum)_Black.woff2") format("woff2"),
|
||||
url("../fonts/iranSans/woff/IRANSansWeb(FaNum)_Black.woff") format("woff");
|
||||
font-weight: 900;
|
||||
font-style: normal;
|
||||
font-display: swap;
|
||||
}
|
||||
/* Self-hosted Vazirmatn (arabic + latin subsets via unicode-range, font-display: swap). Only weights used by the UI. */
|
||||
@import "@fontsource/vazirmatn/400.css";
|
||||
@import "@fontsource/vazirmatn/500.css";
|
||||
@import "@fontsource/vazirmatn/600.css";
|
||||
@import "@fontsource/vazirmatn/700.css";
|
||||
@import "@fontsource/vazirmatn/800.css";
|
||||
@import "@fontsource/vazirmatn/900.css";
|
||||
|
||||
@@ -1,107 +1,231 @@
|
||||
@import "./fonts.css";
|
||||
@import "tailwindcss";
|
||||
/*
|
||||
* Design-specific global styles. They are declared before the Tailwind layers on purpose:
|
||||
* utilities must keep winning equal-specificity conflicts (e.g. `.fade-item` + `transition-all`).
|
||||
*/
|
||||
|
||||
@theme {
|
||||
--color-ink: #0a0a0b;
|
||||
--color-coal: #121215;
|
||||
--color-smoke: #1b1b1f;
|
||||
--color-bone: #f2f2ee;
|
||||
--color-ash: #8b8b93;
|
||||
--color-volt: #c8ff2e;
|
||||
|
||||
--font-display: "IRANSans", ui-sans-serif, system-ui, sans-serif;
|
||||
--font-body: "IRANSans", ui-sans-serif, system-ui, sans-serif;
|
||||
--font-serif: "IRANSans", ui-serif, Georgia, serif;
|
||||
--font-mono: "IRANSans", ui-monospace, monospace;
|
||||
/* Lenis */
|
||||
html.lenis,
|
||||
html.lenis body {
|
||||
height: auto;
|
||||
}
|
||||
.lenis.lenis-smooth {
|
||||
scroll-behavior: auto !important;
|
||||
}
|
||||
.lenis.lenis-smooth [data-lenis-prevent] {
|
||||
overscroll-behavior: contain;
|
||||
}
|
||||
.lenis.lenis-stopped {
|
||||
overflow: hidden;
|
||||
}
|
||||
|
||||
html { background: var(--color-ink); }
|
||||
body {
|
||||
@apply bg-ink text-bone font-body antialiased;
|
||||
overflow-x: clip;
|
||||
font-family: "IRANSans", ui-sans-serif, system-ui, sans-serif;
|
||||
}
|
||||
::selection {
|
||||
background: var(--color-volt);
|
||||
color: var(--color-ink);
|
||||
font-family: "Vazirmatn", sans-serif;
|
||||
background-color: #fafcff;
|
||||
color: #0f172a;
|
||||
overflow-x: hidden;
|
||||
text-rendering: optimizeLegibility;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
transition: background-color 0.3s ease, color 0.3s ease;
|
||||
}
|
||||
|
||||
html.lenis, html.lenis body { height: auto; }
|
||||
.lenis.lenis-smooth { scroll-behavior: auto !important; }
|
||||
.hero-mesh {
|
||||
background-image:
|
||||
radial-gradient(circle at 15% 15%, rgba(0, 98, 245, 0.06) 0%, transparent 45%),
|
||||
radial-gradient(circle at 85% 25%, rgba(56, 178, 248, 0.07) 0%, transparent 40%),
|
||||
radial-gradient(circle at 50% 80%, rgba(2, 132, 199, 0.05) 0%, transparent 60%);
|
||||
}
|
||||
html.dark .hero-mesh {
|
||||
background-image:
|
||||
radial-gradient(circle at 15% 15%, rgba(0, 98, 245, 0.18) 0%, transparent 50%),
|
||||
radial-gradient(circle at 85% 25%, rgba(56, 178, 248, 0.12) 0%, transparent 45%),
|
||||
radial-gradient(circle at 50% 80%, rgba(2, 132, 199, 0.09) 0%, transparent 65%);
|
||||
}
|
||||
|
||||
.noise {
|
||||
position: fixed;
|
||||
inset: -50%;
|
||||
width: 200%;
|
||||
height: 200%;
|
||||
.perspective-stage {
|
||||
perspective: 1800px;
|
||||
perspective-origin: 50% 45%;
|
||||
}
|
||||
|
||||
.studio-botanical-leaf {
|
||||
position: absolute;
|
||||
top: -45px;
|
||||
right: 25px;
|
||||
width: 280px;
|
||||
height: 300px;
|
||||
pointer-events: none;
|
||||
z-index: 999;
|
||||
opacity: 0.032;
|
||||
background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
|
||||
animation: grain 8s steps(10) infinite;
|
||||
}
|
||||
@keyframes grain {
|
||||
0%, 100% { transform: translate(0, 0); }
|
||||
10% { transform: translate(-5%, -8%); }
|
||||
20% { transform: translate(-12%, 4%); }
|
||||
30% { transform: translate(6%, -14%); }
|
||||
40% { transform: translate(-4%, 12%); }
|
||||
50% { transform: translate(-12%, 7%); }
|
||||
60% { transform: translate(11%, 0%); }
|
||||
70% { transform: translate(0%, 10%); }
|
||||
80% { transform: translate(3%, 13%); }
|
||||
90% { transform: translate(-8%, 8%); }
|
||||
z-index: 5;
|
||||
filter: blur(12px) saturate(1.15);
|
||||
opacity: 0.42;
|
||||
transform: rotate(22deg) scale(1.08);
|
||||
transform-origin: top right;
|
||||
}
|
||||
|
||||
@keyframes marquee {
|
||||
from { transform: translate3d(0, 0, 0); }
|
||||
to { transform: translate3d(-50%, 0, 0); }
|
||||
.mockup-macbook-wrap {
|
||||
transform-style: preserve-3d;
|
||||
will-change: transform;
|
||||
transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease;
|
||||
filter: drop-shadow(0 35px 55px rgba(15, 23, 42, 0.26)) drop-shadow(0 15px 25px rgba(0, 98, 245, 0.12));
|
||||
}
|
||||
.animate-marquee {
|
||||
animation: marquee var(--marquee-duration, 28s) linear infinite;
|
||||
|
||||
.macbook-screen-chassis {
|
||||
background: linear-gradient(145deg, #1e293b 0%, #0f172a 100%);
|
||||
border: 1.5px solid rgba(255, 255, 255, 0.2);
|
||||
box-shadow:
|
||||
inset 0 0 0 1px rgba(0, 0, 0, 0.95),
|
||||
inset 0 1px 2px rgba(255, 255, 255, 0.35),
|
||||
0 1px 0 rgba(255, 255, 255, 0.1);
|
||||
}
|
||||
|
||||
.macbook-deck-base {
|
||||
background: linear-gradient(180deg, #94a3b8 0%, #64748b 35%, #334155 70%, #1e293b 100%);
|
||||
border-top: 1px solid rgba(255, 255, 255, 0.3);
|
||||
box-shadow:
|
||||
0 20px 45px -5px rgba(15, 23, 42, 0.45),
|
||||
0 6px 14px rgba(0, 0, 0, 0.25),
|
||||
inset 0 1px 0 rgba(255, 255, 255, 0.5);
|
||||
}
|
||||
|
||||
.mockup-iphone-wrap {
|
||||
transform-style: preserve-3d;
|
||||
will-change: transform;
|
||||
transition: transform 0.32s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.35s ease;
|
||||
filter: drop-shadow(0 32px 50px rgba(15, 23, 42, 0.42)) drop-shadow(0 14px 24px rgba(0, 98, 245, 0.2));
|
||||
}
|
||||
|
||||
.iphone-titanium-bezel {
|
||||
background: linear-gradient(135deg, #475569 0%, #1e293b 35%, #0f172a 75%, #334155 100%);
|
||||
border: 2.5px solid #475569;
|
||||
box-shadow:
|
||||
inset 0 0 0 1px rgba(255, 255, 255, 0.35),
|
||||
inset 0 2px 4px rgba(255, 255, 255, 0.25),
|
||||
0 0 0 2px rgba(15, 23, 42, 0.9);
|
||||
position: relative;
|
||||
}
|
||||
.iphone-titanium-bezel::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: -5.5px;
|
||||
top: 95px;
|
||||
width: 3.5px;
|
||||
height: 48px;
|
||||
background: #475569;
|
||||
border-radius: 2px 0 0 2px;
|
||||
box-shadow: -1px 0 2px rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
.iphone-titanium-bezel::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
right: -5.5px;
|
||||
top: 85px;
|
||||
width: 3.5px;
|
||||
height: 65px;
|
||||
background: #475569;
|
||||
border-radius: 0 2px 2px 0;
|
||||
box-shadow: 1px 0 2px rgba(0, 0, 0, 0.4);
|
||||
}
|
||||
|
||||
.mockup-glass-sheen {
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: linear-gradient(132deg, rgba(255, 255, 255, 0.22) 0%, rgba(255, 255, 255, 0.05) 30%, transparent 60%);
|
||||
pointer-events: none;
|
||||
z-index: 30;
|
||||
}
|
||||
|
||||
.gold-bar-realistic {
|
||||
background: linear-gradient(135deg, #fffbeb 0%, #fef08a 22%, #f59e0b 55%, #b45309 85%, #78350f 100%);
|
||||
box-shadow:
|
||||
inset 0 1.5px 3px rgba(255, 255, 255, 0.95),
|
||||
inset 0 -2px 4px rgba(0, 0, 0, 0.45),
|
||||
0 8px 16px -3px rgba(217, 119, 6, 0.4);
|
||||
}
|
||||
|
||||
.device-ground-shadow {
|
||||
position: absolute;
|
||||
bottom: -15px;
|
||||
left: 6%;
|
||||
right: 6%;
|
||||
height: 38px;
|
||||
background: radial-gradient(ellipse at center, rgba(15, 23, 42, 0.35) 0%, rgba(15, 23, 42, 0.12) 50%, transparent 80%);
|
||||
filter: blur(9px);
|
||||
pointer-events: none;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.spotlight-card {
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
transition: transform 0.3s cubic-bezier(0.16, 1, 0.3, 1), box-shadow 0.3s ease, border-color 0.3s ease;
|
||||
will-change: transform;
|
||||
}
|
||||
.spotlight-card::before {
|
||||
content: "";
|
||||
position: absolute;
|
||||
inset: 0;
|
||||
background: radial-gradient(300px circle at var(--mouse-x, -200px) var(--mouse-y, -200px), rgba(0, 98, 245, 0.12), transparent 70%);
|
||||
pointer-events: none;
|
||||
z-index: 10;
|
||||
opacity: 0;
|
||||
transition: opacity 0.3s ease;
|
||||
}
|
||||
.spotlight-card:hover::before {
|
||||
opacity: 1;
|
||||
}
|
||||
|
||||
.scroll-progress {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
height: 3.5px;
|
||||
background: linear-gradient(90deg, #38b2f8, #0062f5, #0050d8);
|
||||
z-index: 100;
|
||||
transform-origin: 0% 50%;
|
||||
transform: scaleX(0);
|
||||
}
|
||||
|
||||
.fade-item {
|
||||
opacity: 0;
|
||||
transform: translateY(24px);
|
||||
transition: opacity 0.75s cubic-bezier(0.16, 1, 0.3, 1), transform 0.75s cubic-bezier(0.16, 1, 0.3, 1);
|
||||
will-change: opacity, transform;
|
||||
}
|
||||
.fade-item.revealed {
|
||||
opacity: 1;
|
||||
transform: translateY(0);
|
||||
}
|
||||
|
||||
::-webkit-scrollbar {
|
||||
width: 7px;
|
||||
}
|
||||
::-webkit-scrollbar-track {
|
||||
background: #f1f5f9;
|
||||
}
|
||||
html.dark ::-webkit-scrollbar-track {
|
||||
background: #0b1329;
|
||||
}
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #cbd5e1;
|
||||
border-radius: 9999px;
|
||||
}
|
||||
html.dark ::-webkit-scrollbar-thumb {
|
||||
background: #334155;
|
||||
}
|
||||
::-webkit-scrollbar-thumb:hover {
|
||||
background: #94a3b8;
|
||||
}
|
||||
html.dark ::-webkit-scrollbar-thumb:hover {
|
||||
background: #475569;
|
||||
}
|
||||
|
||||
@media (prefers-reduced-motion: reduce) {
|
||||
.animate-marquee { animation: none; }
|
||||
.fade-item {
|
||||
opacity: 1;
|
||||
transform: none;
|
||||
transition: none;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes blink {
|
||||
0%, 100% { opacity: 1; }
|
||||
50% { opacity: 0.15; }
|
||||
}
|
||||
.animate-blink { animation: blink 1.4s ease-in-out infinite; }
|
||||
|
||||
@keyframes spin-slow {
|
||||
to { transform: rotate(360deg); }
|
||||
}
|
||||
.animate-spin-slow { animation: spin-slow 18s linear infinite; }
|
||||
|
||||
@keyframes fade-up {
|
||||
from { opacity: 0; transform: translateY(28px); }
|
||||
to { opacity: 1; transform: translateY(0); }
|
||||
}
|
||||
.animate-fade-up {
|
||||
animation: fade-up 1s cubic-bezier(0.22, 1, 0.36, 1) both;
|
||||
}
|
||||
|
||||
@keyframes scroll-line {
|
||||
0% { transform: scaleY(0); transform-origin: top; opacity: 0; }
|
||||
40% { transform: scaleY(1); transform-origin: top; opacity: 1; }
|
||||
60% { transform: scaleY(1); transform-origin: bottom; opacity: 1; }
|
||||
100% { transform: scaleY(0); transform-origin: bottom; opacity: 0; }
|
||||
}
|
||||
.animate-scroll-line {
|
||||
animation: scroll-line 1.8s ease-in-out infinite;
|
||||
}
|
||||
|
||||
.text-outline {
|
||||
-webkit-text-stroke: 1.5px rgba(242, 242, 238, 0.22);
|
||||
color: transparent;
|
||||
}
|
||||
|
||||
/* Persian accent — volt + lighter weight (Instrument Serif has no Arabic glyphs) */
|
||||
.font-accent {
|
||||
font-family: "IRANSans", ui-sans-serif, system-ui, sans-serif;
|
||||
font-weight: 500;
|
||||
font-style: normal;
|
||||
letter-spacing: -0.01em;
|
||||
}
|
||||
@tailwind base;
|
||||
@tailwind components;
|
||||
@tailwind utilities;
|
||||
|
||||
Reference in New Issue
Block a user