:root {--color-primary:#0b1012;--color-secondary:#fff;--color-accent:#a98cff;--color-accent-blue:#86b9ff;--color-background:#f7f8fa;--color-surface:#fff;--color-text:#111416;--color-text-muted:#646b70;--color-border:#dfe3e6;--color-lavender:#f1effb;--color-blue:#eaf4ff;--color-cream:#f5f4e7;--font-body:'Source Sans 3',sans-serif;--font-display:'Fraunces',serif;--container:1180px;--radius:18px;--shadow:0 24px 70px rgba(0,0,0,.18);}
* {box-sizing:border-box;}
html {scroll-behavior:smooth;}
body {margin:0;background:var(--color-background);color:var(--color-text);font-family:var(--font-body);font-size:17px;line-height:1.5;}
a {color:inherit;text-decoration:none;}
button,input,textarea,select {font:inherit;}
img {max-width:100%;display:block;}
.container {width:min(calc(100% - 48px),var(--container));margin:0 auto;}
.bg-primary {background:var(--color-primary);}
.bg-secondary {background:var(--color-secondary);}
.bg-accent {background:var(--color-accent);}
.text-primary {color:var(--color-primary);}
.text-secondary {color:var(--color-secondary);}
.text-accent {color:var(--color-accent);}
.text-muted {color:var(--color-text-muted);}
.site-header {position:absolute;z-index:20;top:0;left:0;width:100%;color:#fff;}
.header-row {height:88px;display:flex;align-items:center;justify-content:space-between;}

.brand {display:inline-flex;align-items:center;font-size:28px;letter-spacing:-1.3px;line-height:1;}
.brand-icon {width:44px;height:44px;flex:0 0 auto;}
.brand-myown {font-weight:700;}
.brand-dot {color:var(--color-accent);font-weight:700;}
.brand-studio {font-weight:400;}

.primary-nav {display:flex;align-items:center;gap:34px;font-size:15px;}
.primary-nav>a:not(.btn) {position:relative;padding:12px 0;color:rgba(255,255,255,.82);}
.primary-nav>a:not(.btn)::after {content:"";position:absolute;left:0;bottom:5px;width:0;height:1px;background:#fff;transition:width .2s ease;}
.primary-nav>a:not(.btn):hover::after,.primary-nav>a.active::after {width:100%;}
.primary-nav>a:hover {color:#fff;}
.nav-toggle {display:none;border:0;background:transparent;padding:8px;}
.nav-toggle span {display:block;width:25px;height:2px;background:#fff;margin:5px 0;}
.btn {display:inline-flex;align-items:center;justify-content:center;gap:20px;min-height:48px;padding:0 24px;border-radius:999px;font-weight:600;transition:transform .2s ease,background .2s ease,border-color .2s ease;}
.btn:hover {transform:translateY(-2px);}
.btn:focus-visible,a:focus-visible,button:focus-visible {outline:3px solid var(--color-accent-blue);outline-offset:3px;}
.btn-light {background:#fff;color:#101416;border:1px solid #fff;}
.btn-light:hover {background:#edf0f2;}
.btn-outline {color:#fff;border:1px solid rgba(255,255,255,.75);}
.btn-outline:hover {background:rgba(255,255,255,.1);}
.nav-cta {margin-left:20px;min-height:42px;padding:0 22px;}
.hero {position:relative;min-height:650px;padding:150px 0 50px;overflow:hidden;background:radial-gradient(circle at 80% 30%,#263034 0,#111719 33%,#090d0f 72%);color:#fff;}
.hero::after {content:"";position:absolute;right:-70px;top:80px;width:470px;height:470px;border-radius:50%;background:radial-gradient(circle,rgba(77,113,83,.38),rgba(77,113,83,0) 68%);filter:blur(8px);}
.hero-glow {position:absolute;border-radius:50%;filter:blur(70px);opacity:.18;}
.hero-glow-one {width:260px;height:260px;background:var(--color-accent);left:32%;top:30%;}
.hero-glow-two {width:300px;height:300px;background:#6fa8ff;right:3%;bottom:-15%;}
.hero-grid {position:relative;z-index:2;display:grid;grid-template-columns:1fr 1.05fr;gap:45px;align-items:center;}
.hero-copy {min-width:0;}
.hero-slides {position:relative;min-height:390px;}
.hero-slide {position:absolute;inset:0;opacity:0;visibility:hidden;transform:translateX(20px);transition:opacity .55s ease,transform .55s ease,visibility .55s;}
.hero-slide.active {opacity:1;visibility:visible;transform:translateX(0);}
.eyebrow {margin:0 0 18px;text-transform:uppercase;letter-spacing:3px;font-size:12px;font-weight:700;color:rgba(255,255,255,.78);}
.eyebrow span {margin:0 9px;color:#fff;}
.eyebrow.dark {color:#5e666b;}
.hero h1 {margin:0 0 18px;font-family:var(--font-body);font-size:72px;line-height:.94;letter-spacing:-4px;}
.hero h1 span,.about-section h2 span {background:linear-gradient(90deg,#c28fff,#82b9ff);-webkit-background-clip:text;background-clip:text;color:transparent;}
.hero-lead {max-width:570px;margin:0 0 28px;color:#c6cccf;font-size:19px;}
.hero-actions {display:flex;gap:14px;flex-wrap:wrap;}
.hero-features {display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:28px;padding-top:24px;border-top:1px solid rgba(255,255,255,.12);}
.hero-features>div {display:flex;gap:12px;align-items:center;font-size:14px;color:#e0e4e6;}
.feature-icon {font-size:27px;color:#b9cfff;}
.hero-visual {position:relative;height:430px;}
.device {position:absolute;box-shadow:var(--shadow);}
.laptop {width:560px;right:30px;top:28px;transform:perspective(1000px) rotateY(-6deg) rotateX(1deg);}
.laptop-screen {height:335px;padding:22px;border:10px solid #050708;border-radius:18px 18px 7px 7px;background:linear-gradient(135deg,#f1f0ed,#d7d1c8);color:#151515;overflow:hidden;}
.laptop-base {width:610px;height:17px;margin-left:-25px;border-radius:2px 2px 14px 14px;background:linear-gradient(#444,#151515);}
.mini-nav {display:flex;justify-content:space-between;font-size:10px;}
.mini-site {padding:58px 15px;}
.mini-site p {font-size:10px;letter-spacing:2px;}
.mini-site h3 {margin:5px 0 20px;font-family:var(--font-display);font-size:37px;line-height:1.03;}
.mini-button {display:inline-block;padding:8px 14px;border-radius:20px;background:#101416;color:#fff;font-size:10px;}
.phone {z-index:4;width:172px;height:350px;right:-5px;bottom:-5px;padding:30px 17px 18px;border:7px solid #141719;border-radius:30px;background:linear-gradient(160deg,#070b10,#111b2c);color:#fff;transform:rotate(2deg);}
.phone-speaker {position:absolute;top:10px;left:50%;width:45px;height:5px;border-radius:10px;background:#292d31;transform:translateX(-50%);}
.phone small {font-weight:600;}
.phone h3 {margin:12px 0 8px;font-size:25px;line-height:1;}
.phone p {font-size:11px;color:#c4cad4;}
.ai-orb {width:58px;height:58px;margin-top:28px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle,#3e63bb,#17234c 60%,transparent 72%);color:#d4c5ff;font-size:26px;}
.ai-orb.small {width:48px;height:48px;margin:20px auto 10px;}
.phone-button {position:absolute;bottom:20px;left:17px;right:17px;padding:9px;text-align:center;border-radius:20px;background:#d8e2ff;color:#17213c;font-size:10px;font-weight:700;}
.hero-dots {position:absolute;z-index:5;left:50%;bottom:20px;display:flex;gap:8px;transform:translateX(-50%);}
.hero-dots button {width:7px;height:7px;padding:0;border:0;border-radius:50%;background:rgba(255,255,255,.35);cursor:pointer;}
.hero-dots button.active {width:24px;border-radius:10px;background:#fff;}
.section {padding:78px 0;}
.section-intro {display:grid;grid-template-columns:1.15fr .85fr;gap:100px;align-items:end;margin-bottom:38px;}
.section h2 {margin:0;font-size:48px;line-height:1.03;letter-spacing:-2px;}
.section-intro>p {margin:0;color:var(--color-text-muted);font-size:18px;}
.service-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.service-card {min-height:290px;padding:30px;border-radius:var(--radius);transition:transform .2s ease,box-shadow .2s ease;}
.service-card:hover {transform:translateY(-5px);box-shadow:0 18px 45px rgba(20,25,30,.09);}
.card-lavender {background:linear-gradient(135deg,#f7f6fb,var(--color-lavender));}
.card-blue {background:linear-gradient(135deg,#f6f9fc,var(--color-blue));}
.card-cream {background:linear-gradient(135deg,#fafaf5,var(--color-cream));}
.service-icon {font-size:28px;}
.card-label {margin:14px 0;text-transform:uppercase;font-size:12px;font-weight:700;}
.service-card h3 {margin:0 0 12px;font-size:27px;line-height:1.08;}
.service-card>p:not(.card-label) {color:var(--color-text-muted);}
.service-card>a {display:inline-block;margin-top:5px;font-size:25px;}
.service-card>a:hover {transform:translateX(5px);}
.work-section {padding-top:30px;background:#fff;}
.section-heading-row {display:flex;align-items:end;justify-content:space-between;margin-bottom:28px;}
.text-link {font-weight:600;}
.text-link:hover {text-decoration:underline;}
.work-grid {display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.project-preview {height:235px;padding:22px;border-radius:13px;overflow:hidden;}
.project-preview h3 {margin:45px 0 15px;font-size:34px;line-height:1;}
.project-brand {font-size:13px;font-weight:700;}
.project-market {background:linear-gradient(120deg,#f6f0e7,#dce7d7);}
.project-farm {background:linear-gradient(150deg,#101514,#1e382c);color:#fff;}
.project-ai {text-align:center;background:radial-gradient(circle at 50% 35%,#2d3063,#0d1019 65%);color:#fff;}
.project-ai h3 {margin:8px 0;}
.fake-chart {display:flex;height:55px;gap:8px;align-items:end;margin-top:22px;}
.fake-chart i {display:block;flex:1;background:#82a99a;border-radius:4px 4px 0 0;}
.fake-chart i:nth-child(1) {height:28%;}
.fake-chart i:nth-child(2) {height:48%;}
.fake-chart i:nth-child(3) {height:42%;}
.fake-chart i:nth-child(4) {height:75%;}
.fake-chart i:nth-child(5) {height:92%;}
.project-meta {display:flex;justify-content:space-between;padding:14px 4px;}
.project-meta div {display:flex;flex-direction:column;}
.project-meta span {color:var(--color-text-muted);font-size:14px;}
.about-section {background:#0c1114;color:#fff;}
.about-grid {display:grid;grid-template-columns:.7fr 1.3fr 1fr;gap:45px;align-items:center;}
.about-grid .eyebrow {margin:0;}
.about-section h2 {font-size:54px;}
.about-grid>p:not(.eyebrow) {color:#b8c0c4;}
.about-grid .btn {grid-column:2/4;justify-self:start;}
.site-footer {padding:70px 0 24px;background:#070a0c;color:#fff;}
.footer-grid {display:grid;grid-template-columns:1fr 1fr;gap:70px;}
.footer-brand {margin-bottom:15px;}
.footer-grid>div:first-child>p {max-width:330px;color:#8f989d;}
.footer-cta h2 {margin:0 0 25px;font-size:38px;}
.footer-bottom {display:flex;justify-content:space-between;margin-top:60px;padding-top:20px;border-top:1px solid rgba(255,255,255,.12);color:#7d878c;font-size:13px;}

@media (max-width:1050px) {
    .hero h1 {font-size:60px;}.hero-grid {grid-template-columns:1fr .85fr;}.laptop {width:470px;right:-40px;}.laptop-screen {height:290px;}.laptop-base {width:520px;}.phone {right:-20px;}.section-intro {gap:50px;}
}

@media (max-width:820px) {
    .header-row {height:76px;}.nav-toggle {display:block;}.primary-nav {display:none;position:absolute;top:70px;left:24px;right:24px;padding:22px;flex-direction:column;align-items:stretch;gap:4px;border:1px solid rgba(255,255,255,.12);border-radius:15px;background:#101719;box-shadow:var(--shadow);}.primary-nav.open {display:flex;}.primary-nav .nav-cta {margin:12px 0 0;}.hero {padding-top:120px;}.hero-grid {grid-template-columns:1fr;}.hero-visual {height:340px;margin-top:10px;}.laptop {width:min(90%,520px);left:2%;right:auto;}.laptop-screen {height:275px;}.laptop-base {width:108%;margin-left:-4%;}.phone {right:4%;bottom:-10px;}.hero-features {margin-top:12px;}.section-intro,.about-grid {grid-template-columns:1fr;gap:25px;}.service-grid,.work-grid {grid-template-columns:1fr;}.service-card {min-height:auto;}.about-grid .btn {grid-column:auto;}.footer-grid {grid-template-columns:1fr;}
}

@media (max-width:560px) {
    .container {width:min(calc(100% - 32px),var(--container));}
    .brand {font-size:24px;}
    .brand-icon {width:32px;height:32px;}
    .hero {min-height:860px;padding-top:110px;}
    .hero h1 {font-size:52px;letter-spacing:-3px;}
    .hero-lead {font-size:17px;}
    .hero-slides {min-height:430px;}
    .hero-actions .btn {width:100%;}
    .hero-features {grid-template-columns:1fr;gap:12px;}
    .hero-features>div {border-bottom:1px solid rgba(255,255,255,.08);padding-bottom:10px;}
    .hero-visual {height:285px;}
    .laptop {width:95%;top:5px;}
    .laptop-screen {height:225px;padding:14px;border-width:7px;}
    .laptop-base {height:12px;}
    .mini-site {padding:35px 8px;}
    .mini-site h3 {font-size:27px;}
    .phone {width:135px;height:275px;padding:26px 12px 12px;border-width:5px;border-radius:23px;right:0;bottom:-10px;}
    .phone h3 {font-size:19px;}
    .phone p {font-size:9px;}
    .ai-orb {width:42px;height:42px;margin-top:15px;}
    .phone-button {left:10px;right:10px;bottom:12px;}
    .section {padding:55px 0;}
    .section h2 {font-size:38px;}
    .section-intro {margin-bottom:28px;}
    .section-heading-row {align-items:start;gap:15px;flex-direction:column;}
    .project-preview {height:210px;}
    .about-section h2 {font-size:43px;}
    .footer-grid {gap:40px;}
    .footer-bottom {gap:12px;flex-direction:column;}
}

@media (prefers-reduced-motion:reduce) {
    html {scroll-behavior:auto;}*,*::before,*::after {transition:none!important;animation:none!important;}
}