feat: özellikleri gerçek ürün kapsamına göre genişlet, güven ve SSS ekle
Özellikler bölümü rapordaki gerçek modüllere göre yeniden yapılandırıldı (dosya analizi, otomasyon, interaktif AI, içtihat arama, UYAP entegrasyonu). Güven bölümüne mesleki sorumluluk maddesi, itiraz giderme için yeni bir SSS bölümü ve iletişim formuna sonraki adım açıklaması eklendi. Contact form ve favicon, sitenin brutalist tema sistemiyle tutarlı hale getirildi.
This commit is contained in:
mstfyldz
+398
-296
@@ -1,25 +1,20 @@
|
|||||||
'use client'
|
'use client'
|
||||||
|
|
||||||
import { useRef, useState } from 'react'
|
import { useRef } from 'react'
|
||||||
import Link from 'next/link'
|
|
||||||
import { motion, useInView } from 'framer-motion'
|
import { motion, useInView } from 'framer-motion'
|
||||||
import ContactForm from '@/components/contact-form'
|
import ContactForm from '@/components/contact-form'
|
||||||
|
|
||||||
/* ─── Design system tokens (Classical) ────────────────────────────────── */
|
/* ─── Design system tokens (Industrial / Swiss Print) ─────────────────── */
|
||||||
const T = {
|
const T = {
|
||||||
bg: '#f3f2f2',
|
bg: '#F4F4F0',
|
||||||
surface: '#eae9e9',
|
ink: '#0A0A0A',
|
||||||
text: '#201f1d',
|
inkSoft: 'rgba(10,10,10,0.6)',
|
||||||
divider: 'rgba(32,31,29,0.16)',
|
inkFaint: 'rgba(10,10,10,0.38)',
|
||||||
accent: '#b68235',
|
red: '#E61919',
|
||||||
accentDark: '#7d5411',
|
divider: 'rgba(10,10,10,0.16)',
|
||||||
neutral100: '#f8f4f4',
|
dividerHv: 'rgba(10,10,10,0.9)',
|
||||||
fontHead: '"Sora", sans-serif',
|
fontHead: '"Archivo", sans-serif',
|
||||||
fontBody: '"Inter", sans-serif',
|
fontMono: '"JetBrains Mono", monospace',
|
||||||
radiusMd: '4px',
|
|
||||||
radiusLg: '7px',
|
|
||||||
shadowSm: '0 1px 2px rgba(45,43,43,0.14)',
|
|
||||||
shadowMd: '0 3px 10px rgba(45,43,43,0.16)',
|
|
||||||
}
|
}
|
||||||
|
|
||||||
/* ─── Reveal animation ─────────────────────────────────────────────────── */
|
/* ─── Reveal animation ─────────────────────────────────────────────────── */
|
||||||
@@ -31,9 +26,9 @@ function Reveal({ children, className = '', delay = 0 }: {
|
|||||||
return (
|
return (
|
||||||
<motion.div
|
<motion.div
|
||||||
ref={ref}
|
ref={ref}
|
||||||
initial={{ opacity: 0, y: 28 }}
|
initial={{ opacity: 0, y: 16 }}
|
||||||
animate={inView ? { opacity: 1, y: 0 } : { opacity: 0, y: 28 }}
|
animate={inView ? { opacity: 1, y: 0 } : { opacity: 0, y: 16 }}
|
||||||
transition={{ duration: 0.7, ease: [0.25, 0.46, 0.45, 0.94], delay }}
|
transition={{ duration: 0.45, ease: 'easeOut', delay }}
|
||||||
className={className}
|
className={className}
|
||||||
>
|
>
|
||||||
{children}
|
{children}
|
||||||
@@ -43,61 +38,65 @@ function Reveal({ children, className = '', delay = 0 }: {
|
|||||||
|
|
||||||
/* ─── Rail nav ──────────────────────────────────────────────────────────── */
|
/* ─── Rail nav ──────────────────────────────────────────────────────────── */
|
||||||
const RAIL_ITEMS = [
|
const RAIL_ITEMS = [
|
||||||
{ id: '02', href: '#is-akisi', label: '02' },
|
{ id: '02', href: '#is-akisi' },
|
||||||
{ id: '03', href: '#farklilasim', label: '03' },
|
{ id: '03', href: '#farklilasim' },
|
||||||
{ id: '04', href: '#ozellikler', label: '04' },
|
{ id: '04', href: '#ozellikler' },
|
||||||
{ id: '05', href: '#fiyatlandirma', label: '05' },
|
{ id: '05', href: '#fiyatlandirma' },
|
||||||
{ id: '06', href: '#guven', label: '06' },
|
{ id: '06', href: '#guven' },
|
||||||
{ id: '07', href: '#iletisim', label: '07' },
|
{ id: '07', href: '#iletisim' },
|
||||||
]
|
]
|
||||||
|
|
||||||
/* ─── Component ─────────────────────────────────────────────────────────── */
|
/* ─── Component ─────────────────────────────────────────────────────────── */
|
||||||
export default function HomePage() {
|
export default function HomePage() {
|
||||||
return (
|
return (
|
||||||
<div style={{ background: T.bg, color: T.text, fontFamily: T.fontBody, minHeight: '100vh', position: 'relative' }}>
|
<div style={{ background: T.bg, color: T.ink, fontFamily: T.fontMono, minHeight: '100vh', position: 'relative' }}>
|
||||||
|
|
||||||
{/* ── Inline fonts ── */}
|
{/* ── Inline fonts + global rules ── */}
|
||||||
<style>{`
|
<style>{`
|
||||||
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Sora:wght@300;400;500;600&display=swap');
|
@import url('https://fonts.googleapis.com/css2?family=Archivo:wght@500;700;900&family=JetBrains+Mono:wght@400;500;600;700&display=swap');
|
||||||
* { box-sizing: border-box; }
|
* { box-sizing: border-box; border-radius: 0 !important; }
|
||||||
body { margin: 0; }
|
body { margin: 0; }
|
||||||
a { color: ${T.accent}; text-underline-offset: 3px; }
|
a { color: ${T.red}; }
|
||||||
:focus-visible { outline: 2px solid ${T.accent}; outline-offset: 2px; }
|
:focus-visible { outline: 2px solid ${T.red}; outline-offset: 2px; }
|
||||||
::selection { background: rgba(182,130,53,0.25); }
|
::selection { background: ${T.red}; color: #fff; }
|
||||||
.rail-link { text-decoration: none; writing-mode: vertical-rl; font-size: 11px; letter-spacing: 0.08em; transition: color .2s; font-family: ${T.fontHead}; }
|
.rail-link { text-decoration: none; writing-mode: vertical-rl; font-size: 10px; letter-spacing: 0.14em; font-family: ${T.fontMono}; font-weight: 600; }
|
||||||
.hr-line { height: 1px; border: 0; background: ${T.divider}; margin: 0; }
|
.hr-line { height: 1px; border: 0; background: ${T.divider}; margin: 0; }
|
||||||
.plate { filter: sepia(0.22) saturate(0.82) contrast(1.05); box-sizing: border-box; border: 6px solid ${T.surface}; outline: 1px solid ${T.divider}; }
|
.hr-line-hv { height: 2px; border: 0; background: ${T.ink}; margin: 0; }
|
||||||
.btn-primary { display: inline-flex; align-items: center; justify-content: center; gap: 6px; cursor: pointer; text-decoration: none; font-family: ${T.fontHead}; font-weight: 600; font-size: 14px; color: ${T.accent}; background: transparent; border: 1px solid ${T.accent}; padding: 9px 16px; border-radius: ${T.radiusMd}; transition: background .15s; }
|
.doc-label { display: inline-flex; align-items: center; gap: 8px; font-family: ${T.fontMono}; font-size: 11.5px; letter-spacing: 0.14em; text-transform: uppercase; color: ${T.ink}; }
|
||||||
.btn-primary:hover { background: rgba(182,130,53,0.1); }
|
.doc-label .bullet { width: 7px; height: 7px; background: ${T.red}; flex-shrink: 0; }
|
||||||
.btn-ghost { display: inline-flex; align-items: center; justify-content: center; gap: 6px; cursor: pointer; text-decoration: none; font-family: ${T.fontHead}; font-weight: 600; font-size: 14px; color: ${T.accent}; background: transparent; border: none; padding: 9px 4px; border-radius: ${T.radiusMd}; transition: background .15s; }
|
.btn-solid { display: inline-flex; align-items: center; justify-content: center; gap: 8px; cursor: pointer; text-decoration: none; font-family: ${T.fontMono}; font-weight: 700; font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; color: #fff; background: ${T.ink}; border: 2px solid ${T.ink}; padding: 14px 22px; transition: background .12s, color .12s; }
|
||||||
.btn-ghost:hover { background: rgba(182,130,53,0.08); }
|
.btn-solid:hover { background: ${T.red}; border-color: ${T.red}; }
|
||||||
.btn-primary-lg { display: inline-flex; align-items: center; justify-content: center; gap: 6px; cursor: pointer; text-decoration: none; font-family: ${T.fontHead}; font-weight: 600; font-size: 15px; color: ${T.accent}; background: transparent; border: 1px solid ${T.accent}; padding: 13px 24px; border-radius: ${T.radiusMd}; transition: background .15s; width: 100%; }
|
.btn-outline { display: inline-flex; align-items: center; justify-content: center; gap: 8px; cursor: pointer; text-decoration: none; font-family: ${T.fontMono}; font-weight: 700; font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; color: ${T.ink}; background: transparent; border: 2px solid ${T.ink}; padding: 14px 22px; transition: background .12s, color .12s; }
|
||||||
.btn-primary-lg:hover { background: rgba(182,130,53,0.1); }
|
.btn-outline:hover { background: ${T.ink}; color: #fff; }
|
||||||
.card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
|
.btn-solid-lg { display: inline-flex; align-items: center; justify-content: center; gap: 8px; cursor: pointer; text-decoration: none; font-family: ${T.fontMono}; font-weight: 700; font-size: 13px; letter-spacing: 0.06em; text-transform: uppercase; color: #fff; background: ${T.ink}; border: 2px solid ${T.ink}; padding: 16px; width: 100%; transition: background .12s; }
|
||||||
.card { display: flex; flex-direction: column; gap: 9px; padding: 13.8px; border-radius: ${T.radiusMd}; background: transparent; border: 1px solid ${T.divider}; box-shadow: ${T.shadowSm}; }
|
.btn-solid-lg:hover { background: ${T.red}; border-color: ${T.red}; }
|
||||||
.card-kicker { font-size: 10px; letter-spacing: 0.1em; text-transform: uppercase; color: ${T.accent}; }
|
.nav-link { color: ${T.ink}; text-decoration: none; font-size: 12px; font-family: ${T.fontMono}; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
|
||||||
.card-title { font-family: ${T.fontHead}; font-weight: 600; font-size: 17px; line-height: 1.2; margin: 0; }
|
.nav-link:hover { color: ${T.red}; }
|
||||||
.card-body { margin: 0; font-size: 13px; opacity: 0.8; }
|
.grid-1px { display: grid; background: ${T.divider}; gap: 1px; }
|
||||||
.field > label { display: block; font-size: 12px; margin-bottom: 5px; color: rgba(32,31,29,0.7); }
|
.grid-cell { background: ${T.bg}; }
|
||||||
.legal-input { width: 100%; min-height: 36px; padding: 6px 10px; font-family: ${T.fontBody}; font-size: 14px; color: ${T.text}; background: transparent; border: 1px solid ${T.divider}; border-radius: ${T.radiusMd}; transition: border-color .15s; }
|
.card-kicker { font-size: 10.5px; letter-spacing: 0.12em; text-transform: uppercase; color: ${T.red}; font-family: ${T.fontMono}; font-weight: 700; }
|
||||||
.legal-input:hover { border-color: rgba(32,31,29,0.45); }
|
.card-title { font-family: ${T.fontHead}; font-weight: 900; font-size: 19px; line-height: 1.08; margin: 0; text-transform: uppercase; letter-spacing: -0.01em; }
|
||||||
.legal-input:focus { outline: none; border-color: ${T.accent}; }
|
.card-body { margin: 0; font-size: 13px; opacity: 0.72; line-height: 1.55; font-family: ${T.fontMono}; }
|
||||||
.tag-outline { display: inline-flex; align-items: center; font-size: 10.5px; letter-spacing: 0.02em; padding: 3px 10px; border-radius: 3px; border: 1px solid ${T.accent}; color: ${T.accent}; }
|
.field > label { display: block; font-size: 10.5px; letter-spacing: 0.1em; text-transform: uppercase; margin-bottom: 6px; color: ${T.inkSoft}; font-family: ${T.fontMono}; font-weight: 600; }
|
||||||
@media (max-width: 900px) { .rail-fixed { display: none !important; } .hero-badges { display: none !important; } .card-grid { grid-template-columns: 1fr; } }
|
.tag-outline { display: inline-flex; align-items: center; font-size: 9.5px; letter-spacing: 0.08em; text-transform: uppercase; padding: 3px 8px; border: 1px solid ${T.red}; color: ${T.red}; font-family: ${T.fontMono}; font-weight: 700; }
|
||||||
@media (max-width: 700px) { .hero-two-col { grid-template-columns: 1fr !important; } .contact-two-col { grid-template-columns: 1fr !important; } }
|
.noise::before { content: ''; position: fixed; inset: 0; pointer-events: none; z-index: 1; opacity: 0.025; mix-blend-mode: multiply; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); }
|
||||||
|
@media (max-width: 900px) { .rail-fixed { display: none !important; } .hero-badges { display: none !important; } .card-grid { grid-template-columns: 1fr !important; } }
|
||||||
|
@media (max-width: 700px) { .hero-two-col { grid-template-columns: 1fr !important; } .contact-two-col { grid-template-columns: 1fr !important; } .stats-grid { grid-template-columns: repeat(2,1fr) !important; } }
|
||||||
`}</style>
|
`}</style>
|
||||||
|
|
||||||
|
<div className="noise" />
|
||||||
|
|
||||||
{/* ── Left rail ── */}
|
{/* ── Left rail ── */}
|
||||||
<div
|
<div
|
||||||
className="rail-fixed"
|
className="rail-fixed"
|
||||||
style={{ position: 'fixed', left: '22px', top: 0, bottom: 0, width: '26px', display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', gap: '26px', zIndex: 20 }}
|
style={{ position: 'fixed', left: '22px', top: 0, bottom: 0, width: '22px', display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', gap: '24px', zIndex: 20 }}
|
||||||
>
|
>
|
||||||
{RAIL_ITEMS.map(item => (
|
{RAIL_ITEMS.map(item => (
|
||||||
<a key={item.id} href={item.href} className="rail-link" style={{ color: 'rgba(32,31,29,0.4)', fontWeight: 400 }}
|
<a key={item.id} href={item.href} className="rail-link" style={{ color: T.inkFaint }}
|
||||||
onMouseEnter={e => { e.currentTarget.style.color = T.accentDark; e.currentTarget.style.fontWeight = '600' }}
|
onMouseEnter={e => { e.currentTarget.style.color = T.red }}
|
||||||
onMouseLeave={e => { e.currentTarget.style.color = 'rgba(32,31,29,0.4)'; e.currentTarget.style.fontWeight = '400' }}
|
onMouseLeave={e => { e.currentTarget.style.color = T.inkFaint }}
|
||||||
>
|
>
|
||||||
{item.label}
|
{item.id}
|
||||||
</a>
|
</a>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
@@ -107,125 +106,116 @@ export default function HomePage() {
|
|||||||
position: 'sticky', top: 0, zIndex: 30,
|
position: 'sticky', top: 0, zIndex: 30,
|
||||||
display: 'flex', alignItems: 'center', justifyContent: 'space-between',
|
display: 'flex', alignItems: 'center', justifyContent: 'space-between',
|
||||||
flexWrap: 'wrap', gap: '16px',
|
flexWrap: 'wrap', gap: '16px',
|
||||||
padding: '14px clamp(20px,6vw,64px)',
|
padding: '18px clamp(20px,6vw,64px)',
|
||||||
borderBottom: `1px solid ${T.divider}`,
|
borderBottom: `2px solid ${T.ink}`,
|
||||||
background: T.bg,
|
background: T.bg,
|
||||||
backdropFilter: 'blur(10px)',
|
|
||||||
}}>
|
}}>
|
||||||
<div style={{ display: 'flex', alignItems: 'center', gap: '10px' }}>
|
<div style={{ display: 'flex', alignItems: 'center', gap: '10px' }}>
|
||||||
<img src="/logo.png" alt="AyrisLegal" style={{ height: '24px', width: 'auto', objectFit: 'contain' }} />
|
<img src="/logo.png" alt="AyrisLegal" style={{ height: '22px', width: 'auto', objectFit: 'contain' }} />
|
||||||
</div>
|
</div>
|
||||||
<div style={{ display: 'flex', alignItems: 'center', gap: '24px', flexWrap: 'wrap' }}>
|
<div style={{ display: 'flex', alignItems: 'center', gap: '28px', flexWrap: 'wrap' }}>
|
||||||
<a href="#farklilasim" style={{ color: 'inherit', textDecoration: 'none', fontSize: '14px', fontFamily: T.fontBody }}
|
<a href="#farklilasim" className="nav-link">Farklılaşım</a>
|
||||||
onMouseEnter={e => (e.currentTarget.style.color = T.accent)}
|
<a href="#ozellikler" className="nav-link">Özellikler</a>
|
||||||
onMouseLeave={e => (e.currentTarget.style.color = 'inherit')}
|
<a href="#fiyatlandirma" className="nav-link">Fiyatlandırma</a>
|
||||||
>Farklılaşım</a>
|
<a href="#iletisim" className="btn-solid">Demo Talep Et</a>
|
||||||
<a href="#ozellikler" style={{ color: 'inherit', textDecoration: 'none', fontSize: '14px', fontFamily: T.fontBody }}
|
|
||||||
onMouseEnter={e => (e.currentTarget.style.color = T.accent)}
|
|
||||||
onMouseLeave={e => (e.currentTarget.style.color = 'inherit')}
|
|
||||||
>Özellikler</a>
|
|
||||||
<a href="#fiyatlandirma" style={{ color: 'inherit', textDecoration: 'none', fontSize: '14px', fontFamily: T.fontBody }}
|
|
||||||
onMouseEnter={e => (e.currentTarget.style.color = T.accent)}
|
|
||||||
onMouseLeave={e => (e.currentTarget.style.color = 'inherit')}
|
|
||||||
>Fiyatlandırma</a>
|
|
||||||
<a href="#iletisim" className="btn-primary">Demo Talep Et</a>
|
|
||||||
</div>
|
</div>
|
||||||
</nav>
|
</nav>
|
||||||
|
|
||||||
{/* ══════════════════════════════ HERO ════════════════════════════ */}
|
{/* ══════════════════════════════ HERO ════════════════════════════ */}
|
||||||
<section style={{ maxWidth: '1240px', margin: '0 auto', padding: 'clamp(64px,11vw,132px) clamp(20px,6vw,72px) clamp(48px,7vw,80px)', position: 'relative', overflow: 'hidden' }}>
|
<section style={{ maxWidth: '1280px', margin: '0 auto', padding: 'clamp(48px,9vw,96px) clamp(20px,6vw,72px) clamp(48px,7vw,72px)', position: 'relative' }}>
|
||||||
<Reveal>
|
<Reveal>
|
||||||
<span style={{ display: 'inline-block', fontSize: '13px', letterSpacing: '0.1em', textTransform: 'uppercase', color: T.accentDark, borderBottom: `1px solid ${T.accent}`, paddingBottom: '4px', marginBottom: '26px' }}>
|
<span className="doc-label" style={{ marginBottom: '28px' }}>
|
||||||
Madde 01 — Değer Önermesi
|
<span className="bullet" />
|
||||||
|
DOC-01 // DEĞER ÖNERMESİ
|
||||||
</span>
|
</span>
|
||||||
</Reveal>
|
</Reveal>
|
||||||
<div className="hero-two-col" style={{ display: 'grid', gridTemplateColumns: 'minmax(0,7fr) minmax(0,5fr)', gap: '56px', alignItems: 'center' }}>
|
<div className="hero-two-col" style={{ display: 'grid', gridTemplateColumns: 'minmax(0,7fr) minmax(0,5fr)', gap: '48px', alignItems: 'start' }}>
|
||||||
<div>
|
<div>
|
||||||
<Reveal delay={0.05}>
|
<Reveal delay={0.04}>
|
||||||
<h1 style={{ fontFamily: T.fontHead, fontWeight: 400, fontSize: 'clamp(46px,7.4vw,96px)', lineHeight: 0.98, letterSpacing: '-0.015em', margin: 0, marginLeft: '-0.03em', marginBottom: '0' }}>
|
<h1 style={{ fontFamily: T.fontHead, fontWeight: 900, fontSize: 'clamp(42px,7vw,88px)', lineHeight: 0.92, letterSpacing: '-0.03em', textTransform: 'uppercase', margin: 0 }}>
|
||||||
<span style={{ display: 'block' }}>Dosyanızı okur,</span>
|
<span style={{ display: 'block' }}>DOSYANIZI OKUR,</span>
|
||||||
<span style={{ display: 'block' }}>sizinle <em style={{ fontStyle: 'italic', color: T.accentDark }}>tartışır.</em></span>
|
<span style={{ display: 'block' }}>SİZİNLE <span style={{ color: T.red }}>TARTIŞIR.</span></span>
|
||||||
</h1>
|
</h1>
|
||||||
</Reveal>
|
</Reveal>
|
||||||
<Reveal delay={0.12}>
|
<Reveal delay={0.08}>
|
||||||
<p style={{ fontSize: 'clamp(17px,1.7vw,20px)', lineHeight: 1.65, maxWidth: '52ch', margin: '30px 0 0', color: 'rgba(32,31,29,0.82)', fontFamily: T.fontBody }}>
|
<p style={{ fontSize: 'clamp(15px,1.4vw,17px)', lineHeight: 1.7, maxWidth: '54ch', margin: '28px 0 0', color: T.inkSoft }}>
|
||||||
AyrisLegal, yüklediğiniz dava dosyasını analiz eden, içtihat bulan ve dilekçe taslağı çıkaran bir yapay zeka çalışma ortağı — pasif bir arama motoru değil, dosya üzerinde sizinle muhakeme eden bir meslektaş.
|
AyrisLegal, yüklediğiniz dava dosyasını analiz eden, içtihat bulan ve dilekçe taslağı çıkaran bir yapay zeka çalışma ortağı — pasif bir arama motoru değil, dosya üzerinde sizinle muhakeme eden bir meslektaş.
|
||||||
</p>
|
</p>
|
||||||
</Reveal>
|
</Reveal>
|
||||||
<Reveal delay={0.18}>
|
<Reveal delay={0.12}>
|
||||||
<div style={{ display: 'flex', gap: '14px', flexWrap: 'wrap', marginTop: '36px', alignItems: 'center' }}>
|
<div style={{ display: 'flex', gap: '12px', flexWrap: 'wrap', marginTop: '32px', alignItems: 'center' }}>
|
||||||
<a href="#iletisim" className="btn-primary" style={{ fontSize: '15px', padding: '13px 24px' }}>Demo Talep Et</a>
|
<a href="#iletisim" className="btn-solid" style={{ fontSize: '13.5px', padding: '15px 26px' }}>Demo Talep Et</a>
|
||||||
<a href="#farklilasim" className="btn-ghost" style={{ fontSize: '15px' }}>Nasıl çalışır ↓</a>
|
<a href="#farklilasim" className="btn-outline" style={{ fontSize: '13.5px', padding: '15px 26px' }}>Nasıl Çalışır ↓</a>
|
||||||
</div>
|
</div>
|
||||||
<p style={{ fontSize: '13px', marginTop: '24px', color: 'rgba(32,31,29,0.6)', fontFamily: T.fontBody }}>
|
<p style={{ fontSize: '11.5px', letterSpacing: '0.05em', textTransform: 'uppercase', marginTop: '22px', color: T.inkFaint }}>
|
||||||
Şu an erken erişim aşamasındayız — kurucu ekiple doğrudan görüşün.
|
>>> Şu an erken erişim aşamasındayız — kurucu ekiple doğrudan görüşün.
|
||||||
</p>
|
</p>
|
||||||
</Reveal>
|
</Reveal>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* Hero right: mock UI badges + plate */}
|
{/* Hero right: process log panel */}
|
||||||
<div style={{ position: 'relative' }}>
|
<Reveal delay={0.1}>
|
||||||
<div className="hero-badges" style={{ position: 'absolute', top: '-18px', right: '6px', zIndex: 2, background: T.bg, border: `1px solid ${T.divider}`, borderRadius: T.radiusMd, padding: '8px 14px', fontSize: '12.5px', boxShadow: T.shadowSm, transform: 'rotate(-2deg)', fontFamily: T.fontBody }}>
|
<div style={{ border: `2px solid ${T.ink}`, background: '#fff' }}>
|
||||||
İçtihat bulundu · 3 emsal
|
<div style={{ borderBottom: `2px solid ${T.ink}`, padding: '10px 16px', display: 'flex', justifyContent: 'space-between', alignItems: 'center' }}>
|
||||||
|
<span style={{ fontSize: '10.5px', letterSpacing: '0.12em', fontWeight: 700 }}>PROCESS LOG</span>
|
||||||
|
<span style={{ fontSize: '10.5px', color: T.red, fontWeight: 700 }}>● LIVE</span>
|
||||||
|
</div>
|
||||||
|
<div style={{ padding: '18px', display: 'flex', flexDirection: 'column', gap: '2px' }}>
|
||||||
|
{[
|
||||||
|
{ t: '00:01', s: 'DOSYA YÜKLENDİ', done: true },
|
||||||
|
{ t: '00:04', s: 'AI ANALİZ EDİYOR…', done: true },
|
||||||
|
{ t: '00:09', s: 'ARGÜMAN DEĞERLENDİRMESİ', done: true },
|
||||||
|
{ t: '00:13', s: 'EMSAL: YARGITAY 2024/1234', done: true },
|
||||||
|
{ t: '00:21', s: 'DİLEKÇE TASLAĞI OLUŞTURULDU', done: true, final: true },
|
||||||
|
].map((row, i) => (
|
||||||
|
<div key={i} style={{ display: 'flex', alignItems: 'center', gap: '12px', padding: '9px 10px', background: row.final ? T.ink : 'transparent', color: row.final ? '#fff' : T.ink }}>
|
||||||
|
<span style={{ fontSize: '10.5px', opacity: row.final ? 0.7 : 0.4, flexShrink: 0 }}>[{row.t}]</span>
|
||||||
|
<span style={{ fontSize: '11.5px', letterSpacing: '0.03em', flex: 1 }}>{row.s}</span>
|
||||||
|
<span style={{ fontSize: '10px', color: row.final ? '#fff' : T.red, fontWeight: 700, flexShrink: 0 }}>{row.final ? 'OK' : '✓'}</span>
|
||||||
|
</div>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div className="hero-badges" style={{ position: 'absolute', bottom: '-16px', left: '-14px', zIndex: 2, background: T.bg, border: `1px solid ${T.divider}`, borderRadius: T.radiusMd, padding: '8px 14px', fontSize: '12.5px', boxShadow: T.shadowSm, transform: 'rotate(2deg)', fontFamily: T.fontBody }}>
|
</Reveal>
|
||||||
Dilekçe taslağı hazır
|
|
||||||
</div>
|
|
||||||
{/* Placeholder plate */}
|
|
||||||
<div className="plate" style={{ width: '100%', aspectRatio: '4/5', background: T.surface, display: 'flex', flexDirection: 'column', gap: '12px', padding: '24px', justifyContent: 'center' }}>
|
|
||||||
{['Dava dosyası yüklendi', 'AI analiz ediyor…', 'Argüman değerlendirmesi', 'Emsal: Yargıtay 2024/1234', 'Dilekçe taslağı oluşturuldu'].map((step, i) => (
|
|
||||||
<div key={i} style={{ padding: '10px 14px', borderRadius: T.radiusMd, background: T.bg, border: `1px solid ${T.divider}`, fontSize: '13px', color: i === 4 ? T.accentDark : 'rgba(32,31,29,0.75)', fontFamily: T.fontBody, display: 'flex', alignItems: 'center', gap: '10px' }}>
|
|
||||||
<span style={{ width: '18px', height: '18px', borderRadius: '50%', background: i === 4 ? T.accent : T.divider, display: 'inline-flex', alignItems: 'center', justifyContent: 'center', fontSize: '10px', color: i === 4 ? '#fff' : 'rgba(32,31,29,0.5)', flexShrink: 0, fontFamily: T.fontHead }}>
|
|
||||||
{i + 1}
|
|
||||||
</span>
|
|
||||||
{step}
|
|
||||||
</div>
|
|
||||||
))}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
{/* ══════════════════════════════ STATS ═══════════════════════════ */}
|
{/* ══════════════════════════════ STATS ═══════════════════════════ */}
|
||||||
<section style={{ maxWidth: '1240px', margin: '0 auto', padding: '0 clamp(20px,6vw,72px) clamp(56px,8vw,88px)', display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(180px,1fr))', borderTop: `1px solid ${T.divider}`, borderBottom: `1px solid ${T.divider}` }}>
|
<section className="grid-1px stats-grid" style={{ maxWidth: '1280px', margin: '0 auto', gridTemplateColumns: 'repeat(4, 1fr)', borderTop: `2px solid ${T.ink}`, borderBottom: `2px solid ${T.ink}` }}>
|
||||||
{[
|
{[
|
||||||
{ value: '01', label: 'Sabit fiyat, tüm avukatlara' },
|
{ value: '01', label: 'SABİT FİYAT, TÜM AVUKATLARA' },
|
||||||
{ value: '40.000 TL', label: 'Yıllık, gizli ücret yok' },
|
{ value: '40.000 ₺', label: 'YILLIK, GİZLİ ÜCRET YOK' },
|
||||||
{ value: '%100', label: "Veri Türkiye'de kalır" },
|
{ value: '5', label: 'MAHKEME KAYNAĞI TEK EKRANDA' },
|
||||||
{ value: '7/24', label: 'Dosyanızla çalışan ortak' },
|
{ value: '7/24', label: 'DOSYANIZLA ÇALIŞAN ORTAK' },
|
||||||
].map((s, i, arr) => (
|
].map((s) => (
|
||||||
<Reveal key={s.label} delay={i * 0.05}>
|
<div key={s.label} className="grid-cell" style={{ padding: '30px 20px', textAlign: 'center' }}>
|
||||||
<div style={{ padding: '28px 20px', borderRight: i < arr.length - 1 ? `1px solid ${T.divider}` : undefined, textAlign: 'center' }}>
|
<div style={{ fontFamily: T.fontHead, fontWeight: 900, fontSize: 'clamp(28px,3.6vw,40px)', letterSpacing: '-0.02em' }}>{s.value}</div>
|
||||||
<div style={{ fontFamily: T.fontHead, fontWeight: 400, fontSize: 'clamp(30px,4vw,44px)', color: T.accentDark }}>{s.value}</div>
|
<div style={{ fontSize: '10.5px', marginTop: '8px', letterSpacing: '0.08em', color: T.inkSoft }}>{s.label}</div>
|
||||||
<div style={{ fontSize: '13px', marginTop: '6px', color: 'rgba(32,31,29,0.65)', letterSpacing: '0.02em' }}>{s.label}</div>
|
</div>
|
||||||
</div>
|
|
||||||
</Reveal>
|
|
||||||
))}
|
))}
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
{/* ══════════════════════════════ PROBLEM ═════════════════════════ */}
|
{/* ══════════════════════════════ PROBLEM ═════════════════════════ */}
|
||||||
<section id="is-akisi" style={{ maxWidth: '1240px', margin: '0 auto', padding: 'clamp(48px,8vw,96px) clamp(20px,6vw,72px)' }}>
|
<section id="is-akisi" style={{ maxWidth: '1280px', margin: '0 auto', padding: 'clamp(48px,8vw,88px) clamp(20px,6vw,72px)' }}>
|
||||||
<Reveal>
|
<Reveal>
|
||||||
<span style={{ display: 'block', fontSize: '13px', letterSpacing: '0.08em', textTransform: 'uppercase', color: T.accentDark, marginBottom: '14px' }}>
|
<span className="doc-label" style={{ marginBottom: '20px' }}><span className="bullet" />DOC-02 // BUGÜNÜN İŞ AKIŞI</span>
|
||||||
Madde 02 — Bugünün iş akışı
|
<h2 style={{ fontFamily: T.fontHead, fontWeight: 900, fontSize: 'clamp(26px,3.2vw,40px)', margin: '18px 0 40px', letterSpacing: '-0.02em', textTransform: 'uppercase', maxWidth: '22ch' }}>
|
||||||
</span>
|
|
||||||
<h2 style={{ fontFamily: T.fontHead, fontWeight: 400, fontSize: 'clamp(30px,3.6vw,44px)', margin: '0 0 44px', letterSpacing: '-0.008em', maxWidth: '24ch' }}>
|
|
||||||
Dosya, arama, şablon, tekrar.
|
Dosya, arama, şablon, tekrar.
|
||||||
</h2>
|
</h2>
|
||||||
</Reveal>
|
</Reveal>
|
||||||
<div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fit,minmax(280px,1fr))', gap: 0, borderTop: `1px solid ${T.divider}` }}>
|
<div className="grid-1px" style={{ gridTemplateColumns: 'repeat(auto-fit,minmax(280px,1fr))', borderTop: `2px solid ${T.ink}` }}>
|
||||||
<Reveal delay={0.05}>
|
<Reveal delay={0.03}>
|
||||||
<div style={{ padding: '32px 28px 32px 0', borderRight: `1px solid ${T.divider}` }}>
|
<div className="grid-cell" style={{ padding: '30px 28px' }}>
|
||||||
<span style={{ fontFamily: T.fontHead, fontSize: '15px', color: 'rgba(32,31,29,0.45)' }}>01 / Bugün</span>
|
<span style={{ fontFamily: T.fontMono, fontSize: '11px', fontWeight: 700, letterSpacing: '0.1em', color: T.red, textDecoration: 'line-through', textDecorationThickness: '2px' }}>01 / BUGÜN</span>
|
||||||
<p style={{ fontSize: '15.5px', lineHeight: 1.7, margin: '14px 0 0', textAlign: 'justify', hyphens: 'auto', color: 'rgba(32,31,29,0.78)' } as React.CSSProperties}>
|
<p style={{ fontSize: '14px', lineHeight: 1.75, margin: '14px 0 0', color: T.inkSoft }}>
|
||||||
Dosya incelemesi bir programda, içtihat araması ayrı bir siteye açılan sekmede, dilekçe taslağı eski bir Word şablonunda. Her adımda bağlam yeniden kurulur, saatler kaybolur.
|
Dosya incelemesi bir programda, içtihat araması ayrı bir siteye açılan sekmede, dilekçe taslağı eski bir Word şablonunda. Her adımda bağlam yeniden kurulur, saatler kaybolur.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</Reveal>
|
</Reveal>
|
||||||
<Reveal delay={0.1}>
|
<Reveal delay={0.06}>
|
||||||
<div style={{ padding: '32px 0 32px 28px' }}>
|
<div className="grid-cell" style={{ padding: '30px 28px' }}>
|
||||||
<span style={{ fontFamily: T.fontHead, fontSize: '15px', color: T.accentDark }}>02 / AyrisLegal ile</span>
|
<span style={{ fontFamily: T.fontMono, fontSize: '11px', fontWeight: 700, letterSpacing: '0.1em' }}>02 / AYRISLEGAL İLE</span>
|
||||||
<p style={{ fontSize: '15.5px', lineHeight: 1.7, margin: '14px 0 0', textAlign: 'justify', hyphens: 'auto', color: 'rgba(32,31,29,0.78)' } as React.CSSProperties}>
|
<p style={{ fontSize: '14px', lineHeight: 1.75, margin: '14px 0 0', color: T.inkSoft }}>
|
||||||
Tek bir çalışma alanı: dosyanızı yükleyin, AyrisLegal ile tartışın, içtihat bulun, dilekçe taslağı üretin — hepsi aynı ekranda, bağlamı hiç kaybetmeden.
|
Tek bir çalışma alanı: dosyanızı yükleyin, AyrisLegal ile tartışın, içtihat bulun, dilekçe taslağı üretin — hepsi aynı ekranda, bağlamı hiç kaybetmeden.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
@@ -233,183 +223,281 @@ export default function HomePage() {
|
|||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<hr className="hr-line" style={{ maxWidth: '1240px', margin: '0 auto' }} />
|
|
||||||
|
|
||||||
{/* ══════════════════════════════ DIFFERENTIATOR ══════════════════ */}
|
{/* ══════════════════════════════ DIFFERENTIATOR ══════════════════ */}
|
||||||
<section id="farklilasim" style={{ maxWidth: '1240px', margin: '0 auto', padding: 'clamp(56px,9vw,108px) clamp(20px,6vw,72px)' }}>
|
<section id="farklilasim" style={{ maxWidth: '1280px', margin: '0 auto', padding: 'clamp(48px,9vw,96px) clamp(20px,6vw,72px)', borderTop: `2px solid ${T.ink}` }}>
|
||||||
<Reveal>
|
<Reveal>
|
||||||
<span style={{ display: 'block', fontSize: '13px', letterSpacing: '0.08em', textTransform: 'uppercase', color: T.accentDark, marginBottom: '14px' }}>
|
<span className="doc-label" style={{ marginBottom: '20px' }}><span className="bullet" />DOC-03 // TARTIŞMA ODAKLI YAPAY ZEKA</span>
|
||||||
Madde 03 — Tartışma odaklı yapay zeka
|
|
||||||
</span>
|
|
||||||
</Reveal>
|
</Reveal>
|
||||||
<div className="hero-two-col" style={{ display: 'grid', gridTemplateColumns: 'minmax(0,5fr) minmax(0,7fr)', gap: '56px', alignItems: 'center' }}>
|
<div className="hero-two-col" style={{ display: 'grid', gridTemplateColumns: 'minmax(0,5fr) minmax(0,7fr)', gap: '48px', alignItems: 'start', marginTop: '20px' }}>
|
||||||
<Reveal delay={0.05}>
|
<Reveal delay={0.04}>
|
||||||
<div>
|
<div>
|
||||||
<h2 style={{ fontFamily: T.fontHead, fontWeight: 400, fontSize: 'clamp(28px,3.2vw,40px)', margin: '0 0 20px', letterSpacing: '-0.008em', maxWidth: '16ch' }}>
|
<h2 style={{ fontFamily: T.fontHead, fontWeight: 900, fontSize: 'clamp(24px,2.8vw,36px)', margin: '0 0 18px', letterSpacing: '-0.02em', textTransform: 'uppercase', maxWidth: '16ch' }}>
|
||||||
Bulmakla yetinmez, sizinle tartışır.
|
Bulmakla yetinmez, tartışır.
|
||||||
</h2>
|
</h2>
|
||||||
<p style={{ fontSize: '15.5px', lineHeight: 1.7, margin: '0 0 16px', maxWidth: '46ch', textAlign: 'justify', hyphens: 'auto', color: 'rgba(32,31,29,0.78)' } as React.CSSProperties}>
|
<p style={{ fontSize: '14px', lineHeight: 1.75, margin: '0 0 16px', maxWidth: '46ch', color: T.inkSoft }}>
|
||||||
Çoğu hukuk yazılımı özet çıkarır ya da anahtar kelimeyle arar. AyrisLegal dosyanızdaki argümanı okur, zayıf noktasını sorar, karşı görüş üretir, sizi ikna etmeye çalışır — ya da ikna olur.
|
Çoğu hukuk yazılımı özet çıkarır ya da anahtar kelimeyle arar. AyrisLegal dosyanızdaki argümanı okur, zayıf noktasını sorar, karşı görüş üretir, sizi ikna etmeye çalışır — ya da ikna olur.
|
||||||
</p>
|
</p>
|
||||||
<p style={{ fontSize: '13px', margin: 0, color: 'rgba(32,31,29,0.58)' }}>
|
<p style={{ fontSize: '11px', margin: 0, color: T.inkFaint, letterSpacing: '0.02em' }}>
|
||||||
Aşağıdaki görsel, bu tartışmanın nasıl göründüğünü gösteren temsili bir tasarımdır.
|
>>> Aşağıdaki panel, bu tartışmanın nasıl göründüğünü gösteren temsili bir tasarımdır.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
</Reveal>
|
</Reveal>
|
||||||
|
|
||||||
{/* Chat simulation */}
|
{/* Chat simulation as terminal transcript */}
|
||||||
<Reveal delay={0.1}>
|
<Reveal delay={0.08}>
|
||||||
<div className="plate" style={{ margin: 0, padding: '28px', display: 'flex', flexDirection: 'column', gap: '14px' }}>
|
<div style={{ border: `2px solid ${T.ink}`, background: '#fff', padding: '20px', display: 'flex', flexDirection: 'column', gap: '2px', fontSize: '13px', lineHeight: 1.6 }}>
|
||||||
{/* Lawyer message */}
|
<div style={{ padding: '12px 14px', borderBottom: `1px solid ${T.divider}` }}>
|
||||||
<div style={{ alignSelf: 'flex-end', maxWidth: '78%', background: T.bg, border: `1px solid ${T.divider}`, borderRadius: `${T.radiusMd} ${T.radiusMd} 4px ${T.radiusMd}`, padding: '14px 16px' }}>
|
<span style={{ color: T.inkFaint, fontSize: '10.5px', letterSpacing: '0.08em' }}>[AVUKAT]</span>
|
||||||
<div style={{ fontSize: '11px', letterSpacing: '0.06em', textTransform: 'uppercase', color: 'rgba(32,31,29,0.55)', marginBottom: '6px' }}>Avukat</div>
|
<p style={{ margin: '6px 0 0' }}>Müvekkilin haklı olduğunu düşünüyorum, mülkiyet devri geçerli.</p>
|
||||||
<p style={{ margin: 0, fontSize: '14.5px', lineHeight: 1.6, fontFamily: T.fontBody }}>Müvekkilin haklı olduğunu düşünüyorum, mülkiyet devri geçerli.</p>
|
|
||||||
</div>
|
</div>
|
||||||
{/* AyrisLegal response */}
|
<div style={{ padding: '12px 14px', borderBottom: `1px solid ${T.divider}`, background: 'rgba(230,25,25,0.04)' }}>
|
||||||
<div style={{ alignSelf: 'flex-start', maxWidth: '82%', background: T.surface, border: `1px solid ${T.accent}`, borderRadius: `${T.radiusMd} ${T.radiusMd} ${T.radiusMd} 4px`, padding: '14px 16px' }}>
|
<span style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>
|
||||||
<div style={{ display: 'flex', alignItems: 'center', gap: '8px', marginBottom: '6px' }}>
|
<span style={{ color: T.red, fontSize: '10.5px', letterSpacing: '0.08em', fontWeight: 700 }}>[AYRISLEGAL // İTİRAZ]</span>
|
||||||
<span style={{ fontSize: '11px', letterSpacing: '0.06em', textTransform: 'uppercase', color: T.accentDark }}>AyrisLegal</span>
|
</span>
|
||||||
<span className="tag-outline" style={{ fontSize: '10.5px' }}>İtiraz</span>
|
<p style={{ margin: '6px 0 0' }}>Devir tarihinde tapuda şerh var — bu, iyi niyet iddianızı zayıflatabilir. Şerhin kaldırılış tarihini kontrol ettiniz mi?</p>
|
||||||
</div>
|
|
||||||
<p style={{ margin: 0, fontSize: '14.5px', lineHeight: 1.6, fontFamily: T.fontBody }}>Devir tarihinde tapuda şerh var — bu, iyi niyet iddianızı zayıflatabilir. Şerhin kaldırılış tarihini kontrol ettiniz mi?</p>
|
|
||||||
</div>
|
</div>
|
||||||
{/* Lawyer reply */}
|
<div style={{ padding: '12px 14px' }}>
|
||||||
<div style={{ alignSelf: 'flex-end', maxWidth: '78%', background: T.bg, border: `1px solid ${T.divider}`, borderRadius: `${T.radiusMd} ${T.radiusMd} 4px ${T.radiusMd}`, padding: '14px 16px' }}>
|
<span style={{ color: T.inkFaint, fontSize: '10.5px', letterSpacing: '0.08em' }}>[AVUKAT]</span>
|
||||||
<p style={{ margin: 0, fontSize: '14.5px', lineHeight: 1.6, fontFamily: T.fontBody }}>Haklısınız — 3 emsal kararla bu noktayı destekleyelim.</p>
|
<p style={{ margin: '6px 0 0' }}>Haklısınız — 3 emsal kararla bu noktayı destekleyelim.</p>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</Reveal>
|
</Reveal>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<hr className="hr-line" style={{ maxWidth: '1240px', margin: '0 auto' }} />
|
|
||||||
|
|
||||||
{/* ══════════════════════════════ FEATURES ════════════════════════ */}
|
{/* ══════════════════════════════ FEATURES ════════════════════════ */}
|
||||||
<section id="ozellikler" style={{ maxWidth: '1240px', margin: '0 auto', padding: 'clamp(56px,9vw,108px) clamp(20px,6vw,72px)' }}>
|
<section id="ozellikler" style={{ maxWidth: '1280px', margin: '0 auto', padding: 'clamp(48px,9vw,96px) clamp(20px,6vw,72px)', borderTop: `2px solid ${T.ink}` }}>
|
||||||
<Reveal>
|
<Reveal>
|
||||||
<span style={{ display: 'block', fontSize: '13px', letterSpacing: '0.08em', textTransform: 'uppercase', color: T.accentDark, marginBottom: '14px' }}>
|
<span className="doc-label" style={{ marginBottom: '20px' }}><span className="bullet" />DOC-04 // PLATFORM</span>
|
||||||
Madde 04 — Platform
|
<h2 style={{ fontFamily: T.fontHead, fontWeight: 900, fontSize: 'clamp(26px,3.2vw,40px)', margin: '18px 0 14px', letterSpacing: '-0.02em', textTransform: 'uppercase' }}>
|
||||||
</span>
|
|
||||||
<h2 style={{ fontFamily: T.fontHead, fontWeight: 400, fontSize: 'clamp(30px,3.6vw,44px)', margin: '0 0 40px', letterSpacing: '-0.008em' }}>
|
|
||||||
Bir avukatın ihtiyaç duyduğu şeyler.
|
Bir avukatın ihtiyaç duyduğu şeyler.
|
||||||
</h2>
|
</h2>
|
||||||
|
<p style={{ fontSize: '14px', lineHeight: 1.7, maxWidth: '58ch', margin: '0 0 8px', color: T.inkSoft }}>
|
||||||
|
Dosyayı yükleyin — gerisini AyrisLegal üstlenir: okur, çapraz sorgular, strateji kurar, içtihat bulur, dilekçeyi yazar.
|
||||||
|
</p>
|
||||||
</Reveal>
|
</Reveal>
|
||||||
<div className="card-grid">
|
|
||||||
{/* Main feature — spans 2 cols */}
|
{/* — 04.1 Dosya Analizi — */}
|
||||||
|
<Reveal>
|
||||||
|
<div style={{ display: 'flex', alignItems: 'baseline', gap: '12px', margin: '44px 0 16px' }}>
|
||||||
|
<span style={{ fontFamily: T.fontMono, fontSize: '11px', fontWeight: 700, letterSpacing: '0.1em', color: T.red, flexShrink: 0 }}>04.1</span>
|
||||||
|
<span style={{ fontFamily: T.fontMono, fontSize: '11px', fontWeight: 700, letterSpacing: '0.1em', color: T.inkSoft, textTransform: 'uppercase', flexShrink: 0 }}>Dosya Analizi</span>
|
||||||
|
<span style={{ flex: 1, height: '1px', background: T.divider }} />
|
||||||
|
</div>
|
||||||
|
</Reveal>
|
||||||
|
<div className="grid-1px card-grid" style={{ gridTemplateColumns: 'repeat(3, 1fr)', border: `1px solid ${T.divider}` }}>
|
||||||
<Reveal>
|
<Reveal>
|
||||||
<div className="card" style={{ gridColumn: 'span 2' }}>
|
<div className="grid-cell card" style={{ gridColumn: 'span 2', padding: '26px', display: 'flex', flexDirection: 'column', gap: '10px' }}>
|
||||||
<span className="card-kicker">AI tartışma ortağı</span>
|
<span className="card-kicker">ÇELİŞKİ AVCISI 🚨</span>
|
||||||
<h3 className="card-title" style={{ fontSize: '26px' }}>Argümanınızı sınar, meslektaş gibi</h3>
|
<h3 className="card-title" style={{ fontSize: '22px' }}>İfadeleri çapraz sorgular</h3>
|
||||||
<p className="card-body">Zayıf noktaları sorar, karşı görüş üretir, sizi zorlar — pasif özet değil, aktif muhakeme. AyrisLegal'ın temel farkı budur.</p>
|
<p className="card-body">Özellikle ceza dosyalarında: müşteki, sanık ve tanıkların karakol, savcılık ve mahkeme aşamalarındaki beyanlarını karşılaştırır, çelişen ifadeleri kırmızı alarmla işaretler.</p>
|
||||||
</div>
|
</div>
|
||||||
</Reveal>
|
</Reveal>
|
||||||
<Reveal delay={0.05}>
|
<Reveal delay={0.03}>
|
||||||
<div className="card">
|
<div className="grid-cell card" style={{ padding: '26px', display: 'flex', flexDirection: 'column', gap: '10px' }}>
|
||||||
<span className="card-kicker">Dosya analizi</span>
|
<span className="card-kicker">DOSYA ÖZETİ</span>
|
||||||
<h3 className="card-title">Dava dosyasını okur</h3>
|
<h3 className="card-title">Yüzlerce sayfayı tek raporda toplar</h3>
|
||||||
<p className="card-body">Olay örgüsünü, tarafları ve hukuki dayanakları çıkarır.</p>
|
<p className="card-body">Tüm iddia, savunma ve delilleri birleştirip olay örgüsü, yargılama süreci ve son durumu anlatan yapılandırılmış bir rapor çıkarır.</p>
|
||||||
</div>
|
</div>
|
||||||
</Reveal>
|
</Reveal>
|
||||||
<Reveal delay={0.1}>
|
<Reveal delay={0.06}>
|
||||||
<div className="card">
|
<div className="grid-cell card" style={{ padding: '26px', display: 'flex', flexDirection: 'column', gap: '10px' }}>
|
||||||
<span className="card-kicker">İçtihat arama</span>
|
<span className="card-kicker">DOSYA RÖNTGENİ</span>
|
||||||
<h3 className="card-title">Bağlama uygun emsal bulur</h3>
|
<h3 className="card-title">Gözden kaçanı bulur</h3>
|
||||||
<p className="card-body">Anahtar kelime eşleşmesiyle değil, hukuki benzerlikle emsal kararları bulur.</p>
|
<p className="card-body">Olası usul eksikliklerini, zamanaşımı risklerini ve toplanmamış delilleri tarar.</p>
|
||||||
|
</div>
|
||||||
|
</Reveal>
|
||||||
|
<Reveal delay={0.09}>
|
||||||
|
<div className="grid-cell card" style={{ padding: '26px', display: 'flex', flexDirection: 'column', gap: '10px' }}>
|
||||||
|
<span className="card-kicker">DAVA STRATEJİSİ</span>
|
||||||
|
<h3 className="card-title">Yol haritası çıkarır</h3>
|
||||||
|
<p className="card-body">Zayıf noktalar, karşı tarafın açıkları, usul hataları ve talep edilmesi gereken deliller için müvekkile özel strateji üretir.</p>
|
||||||
</div>
|
</div>
|
||||||
</Reveal>
|
</Reveal>
|
||||||
<Reveal delay={0.12}>
|
<Reveal delay={0.12}>
|
||||||
<div className="card">
|
<div className="grid-cell card" style={{ padding: '26px', display: 'flex', flexDirection: 'column', gap: '10px' }}>
|
||||||
<span className="card-kicker">Dilekçe taslağı</span>
|
<span className="card-kicker">MÜZAKERE VE ARABULUCULUK</span>
|
||||||
<h3 className="card-title">Tartışmayı taslağa döker</h3>
|
<h3 className="card-title">Pazarlık marjını hesaplar</h3>
|
||||||
<p className="card-body">Vardığınız sonucu, düzenlenebilir bir dilekçe taslağına dönüştürür.</p>
|
<p className="card-body">Kazanma/kaybetme olasılığını, yargılama masrafı, süre ve riskleri değerlendirip arabuluculuk için en mantıklı marjı sunar.</p>
|
||||||
</div>
|
|
||||||
</Reveal>
|
|
||||||
<Reveal delay={0.15}>
|
|
||||||
<div className="card">
|
|
||||||
<span className="card-kicker" style={{ display: 'flex', alignItems: 'center', gap: '8px' }}>
|
|
||||||
Büro paylaşımı <span className="tag-outline">Yakında</span>
|
|
||||||
</span>
|
|
||||||
<h3 className="card-title">Ekip çalışması</h3>
|
|
||||||
<p className="card-body">Dosya ve tartışma geçmişini büro içindeki meslektaşlarınızla paylaşın.</p>
|
|
||||||
</div>
|
</div>
|
||||||
</Reveal>
|
</Reveal>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
{/* — 04.2 Otomasyon ve Araçlar — */}
|
||||||
|
<Reveal>
|
||||||
|
<div style={{ display: 'flex', alignItems: 'baseline', gap: '12px', margin: '44px 0 16px' }}>
|
||||||
|
<span style={{ fontFamily: T.fontMono, fontSize: '11px', fontWeight: 700, letterSpacing: '0.1em', color: T.red, flexShrink: 0 }}>04.2</span>
|
||||||
|
<span style={{ fontFamily: T.fontMono, fontSize: '11px', fontWeight: 700, letterSpacing: '0.1em', color: T.inkSoft, textTransform: 'uppercase', flexShrink: 0 }}>Otomasyon ve Araçlar</span>
|
||||||
|
<span style={{ flex: 1, height: '1px', background: T.divider }} />
|
||||||
|
</div>
|
||||||
|
</Reveal>
|
||||||
|
<div className="grid-1px card-grid" style={{ gridTemplateColumns: 'repeat(2, 1fr)', border: `1px solid ${T.divider}` }}>
|
||||||
|
<Reveal>
|
||||||
|
<div className="grid-cell card" style={{ padding: '26px', display: 'flex', flexDirection: 'column', gap: '10px' }}>
|
||||||
|
<span className="card-kicker">TAKVİM & SÜRELER</span>
|
||||||
|
<h3 className="card-title">Kesin süreleri kaçırmazsınız</h3>
|
||||||
|
<p className="card-body">Duruşma tarihlerini ve kesin süreleri (cevap dilekçesi, istinaf vb.) dosyadan tespit edip takvime işler ve takibini yapar.</p>
|
||||||
|
</div>
|
||||||
|
</Reveal>
|
||||||
|
<Reveal delay={0.03}>
|
||||||
|
<div className="grid-cell card" style={{ padding: '26px', display: 'flex', flexDirection: 'column', gap: '10px' }}>
|
||||||
|
<span className="card-kicker">DİLEKÇE HAZIRLAMA</span>
|
||||||
|
<h3 className="card-title">Tek tıkla hazır taslak</h3>
|
||||||
|
<p className="card-body">Süre tutum, mazeret ve vekaletname sunma dilekçelerini saniyeler içinde hazırlar; hepsi "Dilekçeler" sekmesinde arşivlenir ve anında düzenlenebilir.</p>
|
||||||
|
</div>
|
||||||
|
</Reveal>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* — 04.3 İnteraktif Yapay Zeka — */}
|
||||||
|
<Reveal>
|
||||||
|
<div style={{ display: 'flex', alignItems: 'baseline', gap: '12px', margin: '44px 0 16px' }}>
|
||||||
|
<span style={{ fontFamily: T.fontMono, fontSize: '11px', fontWeight: 700, letterSpacing: '0.1em', color: T.red, flexShrink: 0 }}>04.3</span>
|
||||||
|
<span style={{ fontFamily: T.fontMono, fontSize: '11px', fontWeight: 700, letterSpacing: '0.1em', color: T.inkSoft, textTransform: 'uppercase', flexShrink: 0 }}>İnteraktif Yapay Zeka</span>
|
||||||
|
<span style={{ flex: 1, height: '1px', background: T.divider }} />
|
||||||
|
</div>
|
||||||
|
</Reveal>
|
||||||
|
<div className="grid-1px card-grid" style={{ gridTemplateColumns: 'repeat(3, 1fr)', border: `1px solid ${T.divider}` }}>
|
||||||
|
<Reveal>
|
||||||
|
<div className="grid-cell card" style={{ padding: '26px', display: 'flex', flexDirection: 'column', gap: '10px' }}>
|
||||||
|
<span className="card-kicker">AYRISLEGAL'E SOR</span>
|
||||||
|
<h3 className="card-title">Dosyaya özel sohbet</h3>
|
||||||
|
<p className="card-body">"İddianamede bahsedilen bıçak kime aitmiş?" gibi dosyaya özel sorularınızı, tüm evrakların bağlamını bilen bir chat bot yanıtlar.</p>
|
||||||
|
</div>
|
||||||
|
</Reveal>
|
||||||
|
<Reveal delay={0.03}>
|
||||||
|
<div className="grid-cell card" style={{ padding: '26px', display: 'flex', flexDirection: 'column', gap: '10px' }}>
|
||||||
|
<span className="card-kicker">DİJİTAL STAJYER</span>
|
||||||
|
<h3 className="card-title">Uzun soluklu görevler devreder</h3>
|
||||||
|
<p className="card-body">Sanal bir hukuk stajyerine görev verir gibi, araştırma ve metin yazım görevlerini AyrisLegal'a atayabilirsiniz.</p>
|
||||||
|
</div>
|
||||||
|
</Reveal>
|
||||||
|
<Reveal delay={0.06}>
|
||||||
|
<div className="grid-cell card" style={{ padding: '26px', display: 'flex', flexDirection: 'column', gap: '10px' }}>
|
||||||
|
<span className="card-kicker">SİMÜLATÖR</span>
|
||||||
|
<h3 className="card-title">Duruşma provası yapar</h3>
|
||||||
|
<p className="card-body">Mahkemeye çıkmadan önce yapay zeka "Hakim", "Savcı" veya "Karşı Taraf Avukatı" rolüne girer; savunmanızı olası sorulara karşı önceden dener.</p>
|
||||||
|
</div>
|
||||||
|
</Reveal>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* — 04.4 İçtihat Araştırma — */}
|
||||||
|
<Reveal>
|
||||||
|
<div style={{ display: 'flex', alignItems: 'baseline', gap: '12px', margin: '44px 0 16px' }}>
|
||||||
|
<span style={{ fontFamily: T.fontMono, fontSize: '11px', fontWeight: 700, letterSpacing: '0.1em', color: T.red, flexShrink: 0 }}>04.4</span>
|
||||||
|
<span style={{ fontFamily: T.fontMono, fontSize: '11px', fontWeight: 700, letterSpacing: '0.1em', color: T.inkSoft, textTransform: 'uppercase', flexShrink: 0 }}>İçtihat Araştırma</span>
|
||||||
|
<span style={{ flex: 1, height: '1px', background: T.divider }} />
|
||||||
|
</div>
|
||||||
|
</Reveal>
|
||||||
|
<div className="grid-1px card-grid" style={{ gridTemplateColumns: 'repeat(3, 1fr)', border: `1px solid ${T.divider}` }}>
|
||||||
|
<Reveal>
|
||||||
|
<div className="grid-cell card" style={{ padding: '26px', display: 'flex', flexDirection: 'column', gap: '10px' }}>
|
||||||
|
<span className="card-kicker">SEMANTİK EMSAL ARAMA</span>
|
||||||
|
<h3 className="card-title">Anlamla arar, kelimeyle değil</h3>
|
||||||
|
<p className="card-body">Anahtar kelime eşleşmesinin ötesinde, vektörel arama ile konuya en uygun Yargıtay, Danıştay ve BAM kararlarını getirir.</p>
|
||||||
|
</div>
|
||||||
|
</Reveal>
|
||||||
|
<Reveal delay={0.03}>
|
||||||
|
<div className="grid-cell card" style={{ padding: '26px', display: 'flex', flexDirection: 'column', gap: '10px' }}>
|
||||||
|
<span className="card-kicker">MAHKEME FİLTRELERİ</span>
|
||||||
|
<h3 className="card-title">Kaynağa göre daraltır</h3>
|
||||||
|
<p className="card-body">Aramaları Yargıtay, Bölge Adliye Mahkemesi, AYM gibi belirli kurumlara göre filtreler.</p>
|
||||||
|
</div>
|
||||||
|
</Reveal>
|
||||||
|
<Reveal delay={0.06}>
|
||||||
|
<div className="grid-cell card" style={{ padding: '26px', display: 'flex', flexDirection: 'column', gap: '10px' }}>
|
||||||
|
<span className="card-kicker">HIZLI KOPYALAMA</span>
|
||||||
|
<h3 className="card-title">Dilekçeye anında aktarır</h3>
|
||||||
|
<p className="card-body">Okuma ekranındaki kararlar veya bölümler tek tıkla kopyalanıp dilekçelere entegre edilir.</p>
|
||||||
|
</div>
|
||||||
|
</Reveal>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
{/* — 04.5 UYAP Entegrasyonu — */}
|
||||||
|
<Reveal>
|
||||||
|
<div style={{ display: 'flex', alignItems: 'baseline', gap: '12px', margin: '44px 0 16px' }}>
|
||||||
|
<span style={{ fontFamily: T.fontMono, fontSize: '11px', fontWeight: 700, letterSpacing: '0.1em', color: T.red, flexShrink: 0 }}>04.5</span>
|
||||||
|
<span style={{ fontFamily: T.fontMono, fontSize: '11px', fontWeight: 700, letterSpacing: '0.1em', color: T.inkSoft, textTransform: 'uppercase', flexShrink: 0 }}>UYAP Entegrasyonu</span>
|
||||||
|
<span style={{ flex: 1, height: '1px', background: T.divider }} />
|
||||||
|
</div>
|
||||||
|
</Reveal>
|
||||||
|
<Reveal delay={0.03}>
|
||||||
|
<div style={{ border: `1px solid ${T.divider}`, padding: '26px', display: 'flex', flexDirection: 'column', gap: '10px' }}>
|
||||||
|
<span className="card-kicker">CHROME EKLENTİSİ</span>
|
||||||
|
<h3 className="card-title" style={{ fontSize: '20px' }}>Manuel indir-yükle derdi yok</h3>
|
||||||
|
<p className="card-body" style={{ maxWidth: '70ch' }}>
|
||||||
|
AyrisLegal, bir web eklentisi aracılığıyla doğrudan UYAP portalıyla haberleşir: taraf bilgilerini, mahkeme bilgilerini, esas numarasını ve safahatı otomatik çeker.
|
||||||
|
Evraklar UYAP üzerinden okunup doğrudan AyrisLegal'a aktarılır; arka planda OCR ile içerikleri metne dönüştürülüp yapay zekanın analiz edebileceği hale getirilir.
|
||||||
|
</p>
|
||||||
|
</div>
|
||||||
|
</Reveal>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<hr className="hr-line" style={{ maxWidth: '1240px', margin: '0 auto' }} />
|
|
||||||
|
|
||||||
{/* ══════════════════════════════ PRICING ═════════════════════════ */}
|
{/* ══════════════════════════════ PRICING ═════════════════════════ */}
|
||||||
<section id="fiyatlandirma" style={{ maxWidth: '1240px', margin: '0 auto', padding: 'clamp(56px,9vw,108px) clamp(20px,6vw,72px)' }}>
|
<section id="fiyatlandirma" style={{ maxWidth: '1280px', margin: '0 auto', padding: 'clamp(48px,9vw,96px) clamp(20px,6vw,72px)', borderTop: `2px solid ${T.ink}` }}>
|
||||||
<Reveal>
|
<Reveal>
|
||||||
<span style={{ display: 'block', fontSize: '13px', letterSpacing: '0.08em', textTransform: 'uppercase', color: T.accentDark, marginBottom: '14px', textAlign: 'center' }}>
|
<span className="doc-label" style={{ justifyContent: 'center', marginBottom: '20px', display: 'flex' }}><span className="bullet" />DOC-05 // FİYATLANDIRMA</span>
|
||||||
Madde 05 — Fiyatlandırma
|
<h2 style={{ fontFamily: T.fontHead, fontWeight: 900, fontSize: 'clamp(26px,3.2vw,40px)', margin: '18px 0 40px', textAlign: 'center', letterSpacing: '-0.02em', textTransform: 'uppercase' }}>
|
||||||
</span>
|
|
||||||
<h2 style={{ fontFamily: T.fontHead, fontWeight: 400, fontSize: 'clamp(30px,3.6vw,44px)', margin: '0 0 44px', textAlign: 'center', letterSpacing: '-0.008em' }}>
|
|
||||||
İhtiyacınıza uygun modeller.
|
İhtiyacınıza uygun modeller.
|
||||||
</h2>
|
</h2>
|
||||||
</Reveal>
|
</Reveal>
|
||||||
|
|
||||||
<div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(320px, 1fr))', gap: '32px', maxWidth: '960px', margin: '0 auto' }}>
|
<div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fit, minmax(320px, 1fr))', gap: '24px', maxWidth: '960px', margin: '0 auto' }}>
|
||||||
|
|
||||||
{/* ── Bireysel ── */}
|
{/* ── Bireysel ── */}
|
||||||
<Reveal delay={0.08}>
|
<Reveal delay={0.05}>
|
||||||
<div style={{ display: 'flex', border: `1px solid ${T.divider}`, borderRadius: T.radiusLg, boxShadow: T.shadowMd, overflow: 'hidden', height: '100%' }}>
|
<div style={{ display: 'flex', border: `2px solid ${T.ink}`, height: '100%' }}>
|
||||||
<div style={{ width: '34px', background: T.neutral100, display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'space-evenly', borderRight: `1px solid ${T.divider}`, padding: '20px 0' }}>
|
<div style={{ width: '32px', background: T.ink, display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'space-evenly', padding: '20px 0' }}>
|
||||||
{['01','02','03','04','05'].map(t => (
|
{['01','02','03','04','05'].map(t => (
|
||||||
<span key={t} style={{ fontSize: '11px', color: T.accentDark, writingMode: 'vertical-rl', fontFamily: T.fontHead }}>{t}</span>
|
<span key={t} style={{ fontSize: '10px', color: '#fff', writingMode: 'vertical-rl', fontFamily: T.fontMono, fontWeight: 700 }}>{t}</span>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
<div style={{ flex: 1, padding: '40px 36px', textAlign: 'center', display: 'flex', flexDirection: 'column' }}>
|
<div style={{ flex: 1, padding: '36px 32px', textAlign: 'center', display: 'flex', flexDirection: 'column' }}>
|
||||||
<p style={{ margin: 0, fontFamily: T.fontHead, fontWeight: 400, fontSize: 'clamp(42px,5vw,56px)', lineHeight: 1 }}>40.000 TL</p>
|
<p style={{ margin: 0, fontFamily: T.fontHead, fontWeight: 900, fontSize: 'clamp(38px,4.6vw,50px)', lineHeight: 1, letterSpacing: '-0.02em' }}>40.000 ₺</p>
|
||||||
<p style={{ margin: '6px 0 0', fontSize: '14px', letterSpacing: '0.06em', textTransform: 'uppercase', color: 'rgba(32,31,29,0.6)' }}>Bireysel Avukat / Yıl</p>
|
<p style={{ margin: '8px 0 0', fontSize: '11px', letterSpacing: '0.1em', textTransform: 'uppercase', color: T.inkSoft }}>Bireysel Avukat / Yıl</p>
|
||||||
<p style={{ fontSize: '15px', lineHeight: 1.6, margin: '20px auto 0', color: 'rgba(32,31,29,0.78)', fontFamily: T.fontBody }}>
|
<p style={{ fontSize: '13.5px', lineHeight: 1.65, margin: '18px auto 0', color: T.inkSoft }}>
|
||||||
Serbest çalışan avukatlar için tasarlanmış yapay zeka çalışma ortağı.
|
Serbest çalışan avukatlar için tasarlanmış yapay zeka çalışma ortağı.
|
||||||
</p>
|
</p>
|
||||||
<hr className="hr-line" style={{ margin: '24px 0' }} />
|
<hr className="hr-line" style={{ margin: '22px 0' }} />
|
||||||
<ul style={{ listStyle: 'none', margin: '0 0 auto 0', padding: 0, display: 'flex', flexDirection: 'column', gap: '12px', textAlign: 'left' }}>
|
<ul style={{ listStyle: 'none', margin: '0 0 auto 0', padding: 0, display: 'flex', flexDirection: 'column', gap: '11px', textAlign: 'left' }}>
|
||||||
{['Sınırsız dosya analizi', 'AI tartışma ortağı', 'İçtihat arama', 'Dilekçe taslağı üretimi'].map(item => (
|
{['Sınırsız dosya analizi', 'AI tartışma ortağı', 'İçtihat arama', 'Dilekçe taslağı üretimi'].map(item => (
|
||||||
<li key={item} style={{ display: 'flex', gap: '10px', fontSize: '14.5px', fontFamily: T.fontBody }}>
|
<li key={item} style={{ display: 'flex', gap: '10px', fontSize: '13px' }}>
|
||||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke={T.accent} strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round" style={{ flexShrink: 0, marginTop: '2px' }}>
|
<span style={{ color: T.red, fontWeight: 700, flexShrink: 0 }}>></span>
|
||||||
<polyline points="20 6 9 17 4 12" />
|
|
||||||
</svg>
|
|
||||||
{item}
|
{item}
|
||||||
</li>
|
</li>
|
||||||
))}
|
))}
|
||||||
</ul>
|
</ul>
|
||||||
<a href="#iletisim" className="btn-primary-lg" style={{ marginTop: '26px' }}>Demo Talep Et</a>
|
<a href="#iletisim" className="btn-solid-lg" style={{ marginTop: '24px' }}>Demo Talep Et</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</Reveal>
|
</Reveal>
|
||||||
|
|
||||||
{/* ── Büro ── */}
|
{/* ── Büro ── */}
|
||||||
<Reveal delay={0.15}>
|
<Reveal delay={0.1}>
|
||||||
<div style={{ display: 'flex', border: `1px solid ${T.accent}`, borderRadius: T.radiusLg, boxShadow: T.shadowMd, overflow: 'hidden', height: '100%', position: 'relative' }}>
|
<div style={{ display: 'flex', border: `2px solid ${T.ink}`, height: '100%', position: 'relative' }}>
|
||||||
<div style={{ position: 'absolute', top: 0, left: 0, right: 0, background: T.accent, color: '#fff', fontSize: '11px', letterSpacing: '0.1em', textTransform: 'uppercase', textAlign: 'center', padding: '4px', fontFamily: T.fontHead, fontWeight: 600 }}>Ekip Çalışması</div>
|
<div style={{ position: 'absolute', top: 0, left: 0, right: 0, background: T.red, color: '#fff', fontSize: '10.5px', letterSpacing: '0.12em', textTransform: 'uppercase', textAlign: 'center', padding: '5px', fontFamily: T.fontMono, fontWeight: 700 }}>Ekip Çalışması</div>
|
||||||
<div style={{ width: '34px', background: 'rgba(182,130,53,0.05)', display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'space-evenly', borderRight: `1px solid ${T.divider}`, padding: '40px 0 20px' }}>
|
<div style={{ width: '32px', background: T.ink, display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'space-evenly', padding: '38px 0 20px' }}>
|
||||||
{['01','02','03','04','05'].map(t => (
|
{['01','02','03','04','05'].map(t => (
|
||||||
<span key={t} style={{ fontSize: '11px', color: T.accentDark, writingMode: 'vertical-rl', fontFamily: T.fontHead }}>{t}</span>
|
<span key={t} style={{ fontSize: '10px', color: '#fff', writingMode: 'vertical-rl', fontFamily: T.fontMono, fontWeight: 700 }}>{t}</span>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
<div style={{ flex: 1, padding: '56px 36px 40px', textAlign: 'center', display: 'flex', flexDirection: 'column' }}>
|
<div style={{ flex: 1, padding: '52px 32px 36px', textAlign: 'center', display: 'flex', flexDirection: 'column' }}>
|
||||||
<p style={{ margin: 0, fontFamily: T.fontHead, fontWeight: 400, fontSize: 'clamp(32px,4vw,42px)', lineHeight: 1.1, color: T.accentDark, marginTop: '6px' }}>Hukuk Bürosu</p>
|
<p style={{ margin: '4px 0 0', fontFamily: T.fontHead, fontWeight: 900, fontSize: 'clamp(28px,3.6vw,38px)', lineHeight: 1.1, letterSpacing: '-0.02em', textTransform: 'uppercase' }}>Hukuk Bürosu</p>
|
||||||
<p style={{ margin: '10px 0 0', fontSize: '14px', letterSpacing: '0.06em', textTransform: 'uppercase', color: 'rgba(32,31,29,0.6)' }}>Özel Fiyatlandırma</p>
|
<p style={{ margin: '10px 0 0', fontSize: '11px', letterSpacing: '0.1em', textTransform: 'uppercase', color: T.inkSoft }}>Özel Fiyatlandırma</p>
|
||||||
<p style={{ fontSize: '15px', lineHeight: 1.6, margin: '20px auto 0', color: 'rgba(32,31,29,0.78)', fontFamily: T.fontBody }}>
|
<p style={{ fontSize: '13.5px', lineHeight: 1.65, margin: '18px auto 0', color: T.inkSoft }}>
|
||||||
Tüm ekibiniz için paylaşımlı çalışma alanı, dosya yönetimi ve özel entegrasyonlar.
|
Tüm ekibiniz için paylaşımlı çalışma alanı, dosya yönetimi ve özel entegrasyonlar.
|
||||||
</p>
|
</p>
|
||||||
<hr className="hr-line" style={{ margin: '24px 0' }} />
|
<hr className="hr-line" style={{ margin: '22px 0' }} />
|
||||||
<ul style={{ listStyle: 'none', margin: '0 0 auto 0', padding: 0, display: 'flex', flexDirection: 'column', gap: '12px', textAlign: 'left' }}>
|
<ul style={{ listStyle: 'none', margin: '0 0 auto 0', padding: 0, display: 'flex', flexDirection: 'column', gap: '11px', textAlign: 'left' }}>
|
||||||
{['Tüm bireysel özellikler', 'Ekip içi dosya paylaşımı', 'Ortak içtihat havuzu', 'Kurucu ekiple özel destek'].map(item => (
|
{['Tüm bireysel özellikler', 'Ekip içi dosya paylaşımı', 'Ortak içtihat havuzu', 'Kurucu ekiple özel destek'].map(item => (
|
||||||
<li key={item} style={{ display: 'flex', gap: '10px', fontSize: '14.5px', fontFamily: T.fontBody }}>
|
<li key={item} style={{ display: 'flex', gap: '10px', fontSize: '13px' }}>
|
||||||
<svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke={T.accentDark} strokeWidth="2.5" strokeLinecap="round" strokeLinejoin="round" style={{ flexShrink: 0, marginTop: '2px' }}>
|
<span style={{ color: T.red, fontWeight: 700, flexShrink: 0 }}>></span>
|
||||||
<polyline points="20 6 9 17 4 12" />
|
|
||||||
</svg>
|
|
||||||
{item}
|
{item}
|
||||||
</li>
|
</li>
|
||||||
))}
|
))}
|
||||||
</ul>
|
</ul>
|
||||||
<a href="#iletisim" className="btn-primary-lg" style={{ marginTop: '26px', background: T.accent, color: '#fff', border: 'none' }}
|
<a href="#iletisim" className="btn-solid-lg" style={{ marginTop: '24px', background: T.red, borderColor: T.red }}
|
||||||
onMouseEnter={e => (e.currentTarget.style.background = T.accentDark)}
|
onMouseEnter={e => (e.currentTarget.style.background = T.ink)}
|
||||||
onMouseLeave={e => (e.currentTarget.style.background = T.accent)}
|
onMouseLeave={e => (e.currentTarget.style.background = T.red)}
|
||||||
>İletişime Geçin</a>
|
>İletişime Geçin</a>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -418,90 +506,104 @@ export default function HomePage() {
|
|||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<hr className="hr-line" style={{ maxWidth: '1240px', margin: '0 auto' }} />
|
|
||||||
|
|
||||||
{/* ══════════════════════════════ TRUST ═══════════════════════════ */}
|
{/* ══════════════════════════════ TRUST ═══════════════════════════ */}
|
||||||
<section id="guven" style={{ maxWidth: '1240px', margin: '0 auto', padding: 'clamp(56px,9vw,108px) clamp(20px,6vw,72px)' }}>
|
<section id="guven" style={{ maxWidth: '1280px', margin: '0 auto', padding: 'clamp(48px,9vw,96px) clamp(20px,6vw,72px)', borderTop: `2px solid ${T.ink}` }}>
|
||||||
<Reveal>
|
<Reveal>
|
||||||
<span style={{ display: 'block', fontSize: '13px', letterSpacing: '0.08em', textTransform: 'uppercase', color: T.accentDark, marginBottom: '14px' }}>
|
<span className="doc-label" style={{ marginBottom: '20px' }}><span className="bullet" />DOC-06 // GÜVEN VE VERİ GÜVENLİĞİ</span>
|
||||||
Madde 06 — Güven ve veri güvenliği
|
<h2 style={{ fontFamily: T.fontHead, fontWeight: 900, fontSize: 'clamp(26px,3.2vw,40px)', margin: '18px 0 14px', letterSpacing: '-0.02em', textTransform: 'uppercase' }}>
|
||||||
</span>
|
|
||||||
<h2 style={{ fontFamily: T.fontHead, fontWeight: 400, fontSize: 'clamp(30px,3.6vw,44px)', margin: '0 0 16px', letterSpacing: '-0.008em' }}>
|
|
||||||
Dosyalarınız sizin kalır.
|
Dosyalarınız sizin kalır.
|
||||||
</h2>
|
</h2>
|
||||||
<p style={{ fontSize: '15.5px', lineHeight: 1.7, maxWidth: '60ch', margin: '0 0 40px', color: 'rgba(32,31,29,0.78)', fontFamily: T.fontBody }}>
|
<p style={{ fontSize: '13.5px', lineHeight: 1.7, maxWidth: '60ch', margin: '0 0 36px', color: T.inkSoft }}>
|
||||||
Bir dava dosyası, bir avukatın elindeki en hassas belgedir. AyrisLegal'ı bu bilinçle kuruyoruz.
|
Bir dava dosyası, bir avukatın elindeki en hassas belgedir. AyrisLegal'ı bu bilinçle kuruyoruz.
|
||||||
</p>
|
</p>
|
||||||
</Reveal>
|
</Reveal>
|
||||||
<div style={{ display: 'grid', gridTemplateColumns: 'repeat(auto-fit,minmax(240px,1fr))', gap: 0, borderTop: `1px solid ${T.divider}` }}>
|
<div className="grid-1px" style={{ gridTemplateColumns: 'repeat(auto-fit,minmax(240px,1fr))', borderTop: `2px solid ${T.ink}`, borderBottom: `2px solid ${T.ink}` }}>
|
||||||
{[
|
{[
|
||||||
{
|
{ title: 'YEREL ŞİFRELİ SAKLAMA', desc: 'Lisans ve hassas veriler, işletim sisteminizin kendi güvenli depolama katmanıyla (Keychain / DPAPI) şifrelenir.' },
|
||||||
icon: <svg width="26" height="26" viewBox="0 0 24 24" fill="none" stroke={T.accent} strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round"><path d="M12 2 L20 5 V11 C20 16 16.5 19.5 12 21 C7.5 19.5 4 16 4 11 V5 Z"/><path d="M9 12 l2.2 2.2 L15.5 9.5"/></svg>,
|
{ title: 'KENDİ GOOGLE DRIVE’INIZA YEDEKLEME', desc: 'Otomatik yedekleme bizim sunucularımıza değil, sizin kendi Drive hesabınıza yapılır — sadece siz erişebilirsiniz.' },
|
||||||
title: "KVKK'ya uyumlu",
|
{ title: 'SADECE SİZİN ANALİZİNİZ İÇİN', desc: 'Yüklediğiniz belgeler başka kullanıcılarla veya üçüncü taraflarla paylaşılmaz.' },
|
||||||
desc: 'Kişisel verilerin korunması mevzuatına uygun işleme ve saklama.',
|
{ title: 'SON KARAR HER ZAMAN SİZDE', desc: 'AyrisLegal bir karar organı değildir — analiz, taslak ve öneri üretir. Mesleki sorumluluk gereği tüm çıktılar imzadan önce sizin incelemenizden geçer.' },
|
||||||
},
|
].map((item, i) => (
|
||||||
{
|
<Reveal key={item.title} delay={i * 0.05}>
|
||||||
icon: <svg width="26" height="26" viewBox="0 0 24 24" fill="none" stroke={T.accent} strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round"><rect x="3" y="4" width="18" height="6" rx="1.5"/><rect x="3" y="14" width="18" height="6" rx="1.5"/><line x1="7" y1="7" x2="7" y2="7"/><line x1="7" y1="17" x2="7" y2="17"/></svg>,
|
<div className="grid-cell" style={{ padding: '26px 24px' }}>
|
||||||
title: "Sunucular Türkiye'de",
|
<span style={{ fontSize: '20px', color: T.red, fontWeight: 700, fontFamily: T.fontMono }}>0{i + 1}</span>
|
||||||
desc: "Verileriniz yurt dışına çıkmaz — Ayris Tech'in self-hosted altyapı felsefesiyle.",
|
<h3 style={{ fontFamily: T.fontHead, fontWeight: 900, fontSize: '16px', margin: '10px 0 8px', textTransform: 'uppercase', letterSpacing: '-0.01em' }}>{item.title}</h3>
|
||||||
},
|
<p style={{ fontSize: '13px', lineHeight: 1.6, margin: 0, color: T.inkSoft }}>{item.desc}</p>
|
||||||
{
|
|
||||||
icon: <svg width="26" height="26" viewBox="0 0 24 24" fill="none" stroke={T.accent} strokeWidth="1.8" strokeLinecap="round" strokeLinejoin="round"><rect x="5" y="10" width="14" height="10" rx="1.5"/><path d="M8 10 V7 a4 4 0 0 1 8 0 v3"/></svg>,
|
|
||||||
title: 'Dosyanız modelleri eğitmez',
|
|
||||||
desc: 'Yüklediğiniz belgeler yalnızca sizin analizinizde kullanılır.',
|
|
||||||
},
|
|
||||||
].map((item, i, arr) => (
|
|
||||||
<Reveal key={item.title} delay={i * 0.08}>
|
|
||||||
<div style={{ padding: '28px 24px 0', borderRight: i < arr.length - 1 ? `1px solid ${T.divider}` : undefined }}>
|
|
||||||
{item.icon}
|
|
||||||
<h3 style={{ fontFamily: T.fontHead, fontWeight: 400, fontSize: '19px', margin: '12px 0 6px' }}>{item.title}</h3>
|
|
||||||
<p style={{ fontSize: '14.5px', lineHeight: 1.6, margin: 0, color: 'rgba(32,31,29,0.78)', fontFamily: T.fontBody }}>{item.desc}</p>
|
|
||||||
</div>
|
</div>
|
||||||
</Reveal>
|
</Reveal>
|
||||||
))}
|
))}
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
<hr className="hr-line" style={{ maxWidth: '1240px', margin: '0 auto' }} />
|
{/* ══════════════════════════════ FAQ ══════════════════════════════ */}
|
||||||
|
<section id="sss" style={{ maxWidth: '1280px', margin: '0 auto', padding: 'clamp(48px,9vw,96px) clamp(20px,6vw,72px)', borderTop: `2px solid ${T.ink}` }}>
|
||||||
|
<Reveal>
|
||||||
|
<span className="doc-label" style={{ marginBottom: '20px' }}><span className="bullet" />DOC-06.5 // SIK SORULAN SORULAR</span>
|
||||||
|
<h2 style={{ fontFamily: T.fontHead, fontWeight: 900, fontSize: 'clamp(26px,3.2vw,40px)', margin: '18px 0 36px', letterSpacing: '-0.02em', textTransform: 'uppercase' }}>
|
||||||
|
Muhtemelen bunları soracaksınız.
|
||||||
|
</h2>
|
||||||
|
</Reveal>
|
||||||
|
<div className="grid-1px" style={{ gridTemplateColumns: 'repeat(auto-fit,minmax(280px,1fr))', border: `1px solid ${T.divider}` }}>
|
||||||
|
{[
|
||||||
|
{ q: 'Müvekkil dosyalarım nerede saklanıyor, kim görebilir?', a: 'Belgeler yerel şifreli depolamada tutulur, yedekleme bizim değil sizin kendi Google Drive hesabınıza yapılır. Başka kullanıcı veya üçüncü tarafla paylaşılmaz.' },
|
||||||
|
{ q: 'Yapay zeka yanlış bir şey söylerse sorumluluk kimde?', a: 'AyrisLegal karar organı değildir — analiz, taslak ve öneri üretir. Ürettiği emsal kararlar gerçek esas/karar numaralarıyla gelir, kaynağından doğrulanabilir. Nihai değerlendirme ve imza her zaman sizde kalır.' },
|
||||||
|
{ q: 'UYAP şifremi AyrisLegal ile paylaşmam gerekiyor mu?', a: 'Hayır. UYAP eklentisi, tarayıcınızda zaten açık olan oturumu kullanır — kimlik bilgileriniz hiçbir zaman AyrisLegal sunucularına iletilmez ya da saklanmaz.' },
|
||||||
|
{ q: 'Büromdaki diğer avukatlarla paylaşabilir miyim?', a: 'Şu an platform bireysel avukat için tasarlandı. Ekip/büro paylaşımı yol haritamızda — Hukuk Bürosu planı için iletişime geçin, ihtiyacınıza göre konuşalım.' },
|
||||||
|
].map((item) => (
|
||||||
|
<Reveal key={item.q}>
|
||||||
|
<div className="grid-cell" style={{ padding: '26px' }}>
|
||||||
|
<h3 style={{ fontFamily: T.fontHead, fontWeight: 900, fontSize: '15px', margin: '0 0 10px', letterSpacing: '-0.01em', lineHeight: 1.3 }}>{item.q}</h3>
|
||||||
|
<p style={{ fontSize: '13px', lineHeight: 1.65, margin: 0, color: T.inkSoft }}>{item.a}</p>
|
||||||
|
</div>
|
||||||
|
</Reveal>
|
||||||
|
))}
|
||||||
|
</div>
|
||||||
|
</section>
|
||||||
|
|
||||||
{/* ══════════════════════════════ CONTACT ═════════════════════════ */}
|
{/* ══════════════════════════════ CONTACT ═════════════════════════ */}
|
||||||
<section id="iletisim" style={{ maxWidth: '1240px', margin: '0 auto', padding: 'clamp(56px,9vw,108px) clamp(20px,6vw,72px)' }}>
|
<section id="iletisim" style={{ maxWidth: '1280px', margin: '0 auto', padding: 'clamp(48px,9vw,96px) clamp(20px,6vw,72px)' }}>
|
||||||
<Reveal>
|
<Reveal>
|
||||||
<span style={{ display: 'block', fontSize: '13px', letterSpacing: '0.08em', textTransform: 'uppercase', color: T.accentDark, marginBottom: '14px' }}>
|
<span className="doc-label" style={{ marginBottom: '20px' }}><span className="bullet" />DOC-07 // ERKEN ERİŞİM</span>
|
||||||
Madde 07 — Erken erişim
|
|
||||||
</span>
|
|
||||||
</Reveal>
|
</Reveal>
|
||||||
<div className="contact-two-col" style={{ display: 'grid', gridTemplateColumns: 'minmax(0,5fr) minmax(0,7fr)', gap: '48px' }}>
|
<div className="contact-two-col" style={{ display: 'grid', gridTemplateColumns: 'minmax(0,5fr) minmax(0,7fr)', gap: '40px', marginTop: '20px' }}>
|
||||||
<Reveal delay={0.05}>
|
<Reveal delay={0.04}>
|
||||||
<div>
|
<div>
|
||||||
<h2 style={{ fontFamily: T.fontHead, fontWeight: 400, fontSize: 'clamp(28px,3.2vw,38px)', margin: '0 0 16px', letterSpacing: '-0.008em' }}>
|
<h2 style={{ fontFamily: T.fontHead, fontWeight: 900, fontSize: 'clamp(22px,2.8vw,32px)', margin: '0 0 14px', letterSpacing: '-0.02em', textTransform: 'uppercase' }}>
|
||||||
Şu an müşteri referansı göstermiyoruz — kasıtlı olarak.
|
Şu an müşteri referansı göstermiyoruz — kasıtlı olarak.
|
||||||
</h2>
|
</h2>
|
||||||
<p style={{ fontSize: '15.5px', lineHeight: 1.7, margin: 0, textAlign: 'justify', hyphens: 'auto', color: 'rgba(32,31,29,0.78)', fontFamily: T.fontBody } as React.CSSProperties}>
|
<p style={{ fontSize: '13.5px', lineHeight: 1.7, margin: 0, color: T.inkSoft }}>
|
||||||
AyrisLegal yeni. Sahte ya da ödünç yorumlar yerine dürüst olmayı seçtik: platformu kurucu ekiple birlikte, doğrudan geri bildiriminizle şekillendiriyoruz. Demo talep edin, ilk kullanan avukatlardan biri olun.
|
AyrisLegal yeni. Sahte ya da ödünç yorumlar yerine dürüst olmayı seçtik: platformu kurucu ekiple birlikte, doğrudan geri bildiriminizle şekillendiriyoruz. Demo talep edin, ilk kullanan avukatlardan biri olun.
|
||||||
</p>
|
</p>
|
||||||
<div style={{ marginTop: '32px', display: 'flex', alignItems: 'center', gap: '14px' }}>
|
<ul style={{ listStyle: 'none', margin: '26px 0 0', padding: 0, display: 'flex', flexDirection: 'column', gap: '10px' }}>
|
||||||
<div style={{ width: '48px', height: '48px', border: `1px solid ${T.accent}`, borderRadius: '50%', display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', fontFamily: T.fontHead, fontSize: '8px', color: T.accentDark, textAlign: 'center', lineHeight: 1.2, flexShrink: 0, textTransform: 'uppercase' }}>
|
{['Formu doldurun', 'Kurucu ekipten biri sizi arar', '15 dakikalık canlı demoda dosyanızla test edersiniz'].map((step, i) => (
|
||||||
<span style={{ fontWeight: 400, letterSpacing: '0.22em' }}>AYRIS</span>
|
<li key={step} style={{ display: 'flex', gap: '10px', fontSize: '13px', color: T.inkSoft }}>
|
||||||
<span style={{ fontWeight: 500, letterSpacing: '0.35em' }}>LEGAL</span>
|
<span style={{ color: T.red, fontWeight: 700, fontFamily: T.fontMono, flexShrink: 0 }}>0{i + 1}</span>
|
||||||
|
{step}
|
||||||
|
</li>
|
||||||
|
))}
|
||||||
|
</ul>
|
||||||
|
<div style={{ marginTop: '28px', display: 'flex', alignItems: 'center', gap: '14px' }}>
|
||||||
|
<div style={{ width: '54px', height: '54px', border: `2px solid ${T.red}`, borderRadius: '50% !important', display: 'flex', flexDirection: 'column', alignItems: 'center', justifyContent: 'center', fontFamily: T.fontMono, fontSize: '8px', color: T.red, textAlign: 'center', lineHeight: 1.3, flexShrink: 0, textTransform: 'uppercase', transform: 'rotate(-8deg)', fontWeight: 700 }}>
|
||||||
|
<span style={{ letterSpacing: '0.14em' }}>VERIFIED</span>
|
||||||
|
<span style={{ letterSpacing: '0.14em' }}>FOUNDER</span>
|
||||||
</div>
|
</div>
|
||||||
<span style={{ fontSize: '12.5px', color: 'rgba(32,31,29,0.6)', fontFamily: T.fontBody }}>Kurucu ekip mührü</span>
|
<span style={{ fontSize: '11px', letterSpacing: '0.04em', color: T.inkFaint }}>KURUCU EKİP MÜHRÜ</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</Reveal>
|
</Reveal>
|
||||||
<Reveal delay={0.1}>
|
<Reveal delay={0.08}>
|
||||||
<ContactForm />
|
<ContactForm />
|
||||||
</Reveal>
|
</Reveal>
|
||||||
</div>
|
</div>
|
||||||
</section>
|
</section>
|
||||||
|
|
||||||
{/* ══════════════════════════════ FOOTER ══════════════════════════ */}
|
{/* ══════════════════════════════ FOOTER ══════════════════════════ */}
|
||||||
<footer style={{ maxWidth: '1240px', margin: '0 auto', padding: '28px clamp(20px,6vw,72px) 40px', display: 'flex', justifyContent: 'space-between', flexWrap: 'wrap', gap: '12px', fontSize: '13px', color: 'rgba(32,31,29,0.6)', borderTop: `1px solid ${T.divider}`, fontFamily: T.fontBody }}>
|
<footer style={{ maxWidth: '1280px', margin: '0 auto', padding: '24px clamp(20px,6vw,72px) 36px', display: 'flex', justifyContent: 'space-between', flexWrap: 'wrap', gap: '12px', fontSize: '11px', letterSpacing: '0.04em', color: T.inkFaint, borderTop: `2px solid ${T.ink}` }}>
|
||||||
<span>AyrisLegal, Ayris Tech'in bir ürünüdür.</span>
|
<span>AYRISLEGAL™ — AYRIS TECH'İN BİR ÜRÜNÜDÜR.</span>
|
||||||
<span>
|
<span>
|
||||||
© {new Date().getFullYear()} AyrisLegal ·{' '}
|
© {new Date().getFullYear()} AYRISLEGAL ·{' '}
|
||||||
<a href="https://ayris.tech" target="_blank" rel="noopener noreferrer" style={{ color: 'rgba(32,31,29,0.6)' }}>
|
<a href="https://ayris.tech" target="_blank" rel="noopener noreferrer" style={{ color: T.inkFaint }}>
|
||||||
Created by ayris.tech
|
CREATED BY AYRIS.TECH
|
||||||
</a>
|
</a>
|
||||||
</span>
|
</span>
|
||||||
</footer>
|
</footer>
|
||||||
|
|||||||
@@ -0,0 +1,92 @@
|
|||||||
|
import React from 'react';
|
||||||
|
|
||||||
|
export default function PrivacyPolicy() {
|
||||||
|
return (
|
||||||
|
<div className="container mx-auto px-4 py-16 max-w-4xl">
|
||||||
|
<h1 className="text-4xl font-bold mb-8">Gizlilik Politikası</h1>
|
||||||
|
<p className="mb-6 text-gray-500">Son Güncellenme Tarihi: 11 Ağustos 2026</p>
|
||||||
|
|
||||||
|
<div className="prose max-w-none">
|
||||||
|
<section className="mb-8">
|
||||||
|
<h2 className="text-2xl font-semibold mb-4">1. Giriş</h2>
|
||||||
|
<p className="mb-4">
|
||||||
|
AyrisLegal ("biz", "bizim" veya "bize"), gizliliğinize saygı duymakta ve kişisel verilerinizi korumayı taahhüt etmektedir. Bu Gizlilik Politikası, ayrislegal.com tanıtım web sitesini ve AyrisLegal masaüstü uygulamasını ("Uygulama") kullandığınızda kişisel bilgilerinizi nasıl işlediğimizi açıklar.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section className="mb-8">
|
||||||
|
<h2 className="text-2xl font-semibold mb-4">2. Web Sitesi — Demo Talebi Formu</h2>
|
||||||
|
<p className="mb-4">
|
||||||
|
İletişim/demo talebi formunu doldurduğunuzda ad soyad, e-posta, (varsa) büro/kurum adı ve telefon bilgilerinizi topluyoruz. Bu bilgiler yalnızca talebinizi değerlendirmek ve sizinle iletişime geçmek amacıyla kullanılır; üçüncü taraflara satılmaz veya pazarlama amacıyla aktarılmaz.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section className="mb-8">
|
||||||
|
<h2 className="text-2xl font-semibold mb-4">3. Uygulama — Hesap Bilgileri</h2>
|
||||||
|
<p className="mb-4">
|
||||||
|
AyrisLegal'a kayıt olurken ad soyad, e-posta ve (varsa) baro sicil bilginizi işleriz. Bu bilgiler kimlik doğrulama ve hesabınızı yönetmek amacıyla kullanılır.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section className="mb-8">
|
||||||
|
<h2 className="text-2xl font-semibold mb-4">4. Uygulama — Dava Dosyası ve Belge İçeriği</h2>
|
||||||
|
<p className="mb-4">
|
||||||
|
AyrisLegal'ın temel işlevi, yüklediğiniz dava dosyalarını ve belgeleri yapay zeka ile analiz etmek, içtihat aramak ve dilekçe taslağı üretmektir. Bu analiz, yapay zeka servis sağlayıcıları aracılığıyla gerçekleştirilir; yani yüklediğiniz belge içeriği, analiz işlemi sırasında bu servislere iletilir.
|
||||||
|
</p>
|
||||||
|
<p className="mb-4">
|
||||||
|
Belgeleriniz yalnızca sizin analizinizi üretmek için kullanılır, başka kullanıcılarla veya üçüncü taraflarla paylaşılmaz. Kullandığımız yapay zeka altyapısı zaman içinde değişebilir; hassas veya gizlilik dereceli belgeleri yüklerken bu konuda dikkatli olmanızı öneririz.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section className="mb-8">
|
||||||
|
<h2 className="text-2xl font-semibold mb-4">5. Lisans ve Cihaz Bilgileri</h2>
|
||||||
|
<p className="mb-4">
|
||||||
|
Uygulamanın aktivasyonu için bir lisans anahtarı ve cihazınıza özgü, rastgele üretilmiş bir cihaz kimliği kullanılır. Bu bilgiler bilgisayarınızda, işletim sisteminizin kendi güvenli depolama katmanı (macOS Keychain / Windows DPAPI) ile şifrelenerek saklanır.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section className="mb-8">
|
||||||
|
<h2 className="text-2xl font-semibold mb-4">6. Yedekleme</h2>
|
||||||
|
<p className="mb-4">
|
||||||
|
Uygulama içinde isteğe bağlı olarak açabileceğiniz otomatik yedekleme özelliği, dosyalarınızı bizim sunucularımıza değil, doğrudan sizin kendi Google Drive hesabınıza yükler. Bu özellik varsayılan olarak kapalıdır ve yalnızca siz açtığınızda, sizin izninizle çalışır.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section className="mb-8">
|
||||||
|
<h2 className="text-2xl font-semibold mb-4">7. Hata Bildirimleri</h2>
|
||||||
|
<p className="mb-4">
|
||||||
|
Uygulama bir teknik hatayla karşılaştığında, sorunu çözebilmemiz için anonim bir hata raporu gönderebilir. Bu raporlar; dava dosyası, müvekkil bilgisi, belge içeriği veya başka bir kişisel veri İÇERMEZ — yalnızca hatanın teknik ayrıntılarını (hangi modülde, hangi tür hata) kapsar. Bu bildirimi Ayarlar > Gizlilik menüsünden tamamen kapatabilirsiniz.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section className="mb-8">
|
||||||
|
<h2 className="text-2xl font-semibold mb-4">8. Veri Güvenliği</h2>
|
||||||
|
<p className="mb-4">
|
||||||
|
Hassas veriler (lisans bilgisi, kimlik doğrulama bilgileri) cihazınızda şifreli olarak saklanır. Uygulama, geçerli bir lisansı olmayan kişiler tarafından aktive edilemez. Sunucu tarafı altyapımız erişim kontrolleriyle korunmaktadır.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section className="mb-8">
|
||||||
|
<h2 className="text-2xl font-semibold mb-4">9. Haklarınız</h2>
|
||||||
|
<p className="mb-4">
|
||||||
|
6698 sayılı Kişisel Verilerin Korunması Kanunu ("KVKK") kapsamında; verilerinizin işlenip işlenmediğini öğrenme, işlenmişse buna ilişkin bilgi talep etme, düzeltme veya silinmesini isteme haklarına sahipsiniz. Bu haklarınızı kullanmak için aşağıdaki iletişim adresinden bize ulaşabilirsiniz.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section className="mb-8">
|
||||||
|
<h2 className="text-2xl font-semibold mb-4">10. Değişiklikler</h2>
|
||||||
|
<p className="mb-4">
|
||||||
|
Bu Gizlilik Politikasını zaman zaman güncelleyebiliriz. Herhangi bir değişiklik durumunda bu sayfada yeni tarihi belirterek sizi bilgilendireceğiz.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
|
||||||
|
<section className="mb-8">
|
||||||
|
<h2 className="text-2xl font-semibold mb-4">11. İletişim</h2>
|
||||||
|
<p className="mb-4">
|
||||||
|
Bu Gizlilik Politikası hakkında veya veri güvenliği ile ilgili sorularınız varsa, lütfen <strong>info@ayris.tech</strong> adresi üzerinden bizimle iletişime geçin.
|
||||||
|
</p>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
);
|
||||||
|
}
|
||||||
Binary file not shown.
|
Before Width: | Height: | Size: 25 KiB After Width: | Height: | Size: 15 KiB |
+37
-41
@@ -5,16 +5,13 @@ import { useState } from 'react'
|
|||||||
type FormState = 'idle' | 'loading' | 'success' | 'error'
|
type FormState = 'idle' | 'loading' | 'success' | 'error'
|
||||||
|
|
||||||
const T = {
|
const T = {
|
||||||
bg: '#f3f2f2',
|
bg: '#F4F4F0',
|
||||||
surface: '#eae9e9',
|
ink: '#0A0A0A',
|
||||||
text: '#201f1d',
|
inkSoft: 'rgba(10,10,10,0.6)',
|
||||||
divider: 'rgba(32,31,29,0.16)',
|
divider: 'rgba(10,10,10,0.16)',
|
||||||
accent: '#b68235',
|
red: '#E61919',
|
||||||
accentDark: '#7d5411',
|
fontHead: '"Archivo", sans-serif',
|
||||||
fontHead: '"Sora", sans-serif',
|
fontMono: '"JetBrains Mono", monospace',
|
||||||
fontBody: '"Inter", sans-serif',
|
|
||||||
radiusMd: '4px',
|
|
||||||
radiusLg: '7px',
|
|
||||||
}
|
}
|
||||||
|
|
||||||
export default function ContactForm() {
|
export default function ContactForm() {
|
||||||
@@ -43,9 +40,10 @@ export default function ContactForm() {
|
|||||||
/* Success */
|
/* Success */
|
||||||
if (state === 'success') {
|
if (state === 'success') {
|
||||||
return (
|
return (
|
||||||
<div style={{ border: `1px solid ${T.divider}`, borderRadius: T.radiusLg, padding: '40px', textAlign: 'center', background: T.surface }}>
|
<div style={{ border: `2px solid ${T.ink}`, padding: '36px', textAlign: 'center', background: '#fff' }}>
|
||||||
<h3 style={{ fontFamily: T.fontHead, fontWeight: 400, fontSize: '22px', margin: '0 0 8px' }}>Talebiniz alındı.</h3>
|
<span style={{ display: 'inline-block', fontSize: '10.5px', letterSpacing: '0.12em', color: T.red, fontFamily: T.fontMono, fontWeight: 700, marginBottom: '10px' }}>STATUS: RECEIVED</span>
|
||||||
<p style={{ fontSize: '14.5px', margin: 0, color: 'rgba(32,31,29,0.78)', fontFamily: T.fontBody }}>
|
<h3 style={{ fontFamily: T.fontHead, fontWeight: 900, fontSize: '20px', margin: '0 0 8px', textTransform: 'uppercase', letterSpacing: '-0.01em' }}>Talebiniz alındı.</h3>
|
||||||
|
<p style={{ fontSize: '13px', margin: 0, color: T.inkSoft, fontFamily: T.fontMono }}>
|
||||||
Kurucu ekipten kısa süre içinde size dönüş yapılacak.
|
Kurucu ekipten kısa süre içinde size dönüş yapılacak.
|
||||||
</p>
|
</p>
|
||||||
</div>
|
</div>
|
||||||
@@ -53,17 +51,17 @@ export default function ContactForm() {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const inputStyle: React.CSSProperties = {
|
const inputStyle: React.CSSProperties = {
|
||||||
width: '100%', minHeight: '36px', padding: '6px 10px',
|
width: '100%', minHeight: '40px', padding: '8px 12px',
|
||||||
fontFamily: T.fontBody, fontSize: '14px', color: T.text,
|
fontFamily: T.fontMono, fontSize: '13.5px', color: T.ink,
|
||||||
background: 'transparent',
|
background: '#fff',
|
||||||
border: `1px solid ${T.divider}`, borderRadius: T.radiusMd,
|
border: `2px solid ${T.divider}`,
|
||||||
transition: 'border-color .15s',
|
transition: 'border-color .12s',
|
||||||
boxSizing: 'border-box',
|
boxSizing: 'border-box',
|
||||||
}
|
}
|
||||||
|
|
||||||
const labelStyle: React.CSSProperties = {
|
const labelStyle: React.CSSProperties = {
|
||||||
display: 'block', fontSize: '12px', marginBottom: '5px',
|
display: 'block', fontSize: '10.5px', letterSpacing: '0.1em', textTransform: 'uppercase',
|
||||||
color: 'rgba(32,31,29,0.7)', fontFamily: T.fontBody,
|
marginBottom: '6px', color: T.inkSoft, fontFamily: T.fontMono, fontWeight: 600,
|
||||||
}
|
}
|
||||||
|
|
||||||
return (
|
return (
|
||||||
@@ -73,10 +71,9 @@ export default function ContactForm() {
|
|||||||
display: 'grid',
|
display: 'grid',
|
||||||
gridTemplateColumns: 'repeat(auto-fit,minmax(200px,1fr))',
|
gridTemplateColumns: 'repeat(auto-fit,minmax(200px,1fr))',
|
||||||
gap: '16px',
|
gap: '16px',
|
||||||
border: `1px solid ${T.divider}`,
|
border: `2px solid ${T.ink}`,
|
||||||
borderRadius: T.radiusLg,
|
|
||||||
padding: '28px',
|
padding: '28px',
|
||||||
background: T.bg,
|
background: '#fff',
|
||||||
}}
|
}}
|
||||||
noValidate
|
noValidate
|
||||||
>
|
>
|
||||||
@@ -86,13 +83,13 @@ export default function ContactForm() {
|
|||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div style={{ gridColumn: 'span 1' }}>
|
<div style={{ gridColumn: 'span 1' }}>
|
||||||
<label style={labelStyle} htmlFor="af_name">Ad Soyad <span style={{ color: T.accent }}>*</span></label>
|
<label style={labelStyle} htmlFor="af_name">Ad Soyad <span style={{ color: T.red }}>*</span></label>
|
||||||
<input
|
<input
|
||||||
id="af_name" type="text" required
|
id="af_name" type="text" required
|
||||||
placeholder="Av. Ayşe Yılmaz"
|
placeholder="Av. Ayşe Yılmaz"
|
||||||
value={form.name} onChange={set('name')}
|
value={form.name} onChange={set('name')}
|
||||||
style={inputStyle}
|
style={inputStyle}
|
||||||
onFocus={e => (e.target.style.borderColor = T.accent)}
|
onFocus={e => (e.target.style.borderColor = T.red)}
|
||||||
onBlur={e => (e.target.style.borderColor = T.divider)}
|
onBlur={e => (e.target.style.borderColor = T.divider)}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@@ -104,19 +101,19 @@ export default function ContactForm() {
|
|||||||
placeholder="Yılmaz Hukuk Bürosu"
|
placeholder="Yılmaz Hukuk Bürosu"
|
||||||
value={form.org} onChange={set('org')}
|
value={form.org} onChange={set('org')}
|
||||||
style={inputStyle}
|
style={inputStyle}
|
||||||
onFocus={e => (e.target.style.borderColor = T.accent)}
|
onFocus={e => (e.target.style.borderColor = T.red)}
|
||||||
onBlur={e => (e.target.style.borderColor = T.divider)}
|
onBlur={e => (e.target.style.borderColor = T.divider)}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div>
|
<div>
|
||||||
<label style={labelStyle} htmlFor="af_email">E-posta <span style={{ color: T.accent }}>*</span></label>
|
<label style={labelStyle} htmlFor="af_email">E-posta <span style={{ color: T.red }}>*</span></label>
|
||||||
<input
|
<input
|
||||||
id="af_email" type="email" required
|
id="af_email" type="email" required
|
||||||
placeholder="ayse@buro.com"
|
placeholder="ayse@buro.com"
|
||||||
value={form.email} onChange={set('email')}
|
value={form.email} onChange={set('email')}
|
||||||
style={inputStyle}
|
style={inputStyle}
|
||||||
onFocus={e => (e.target.style.borderColor = T.accent)}
|
onFocus={e => (e.target.style.borderColor = T.red)}
|
||||||
onBlur={e => (e.target.style.borderColor = T.divider)}
|
onBlur={e => (e.target.style.borderColor = T.divider)}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
@@ -128,15 +125,15 @@ export default function ContactForm() {
|
|||||||
placeholder="0532 000 00 00"
|
placeholder="0532 000 00 00"
|
||||||
value={form.phone} onChange={set('phone')}
|
value={form.phone} onChange={set('phone')}
|
||||||
style={inputStyle}
|
style={inputStyle}
|
||||||
onFocus={e => (e.target.style.borderColor = T.accent)}
|
onFocus={e => (e.target.style.borderColor = T.red)}
|
||||||
onBlur={e => (e.target.style.borderColor = T.divider)}
|
onBlur={e => (e.target.style.borderColor = T.divider)}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{state === 'error' && (
|
{state === 'error' && (
|
||||||
<div style={{ gridColumn: '1 / -1', fontSize: '13px', color: '#c0392b', fontFamily: T.fontBody }}>
|
<div style={{ gridColumn: '1 / -1', fontSize: '12.5px', color: T.red, fontFamily: T.fontMono }}>
|
||||||
Bir hata oluştu. Lütfen tekrar deneyin veya{' '}
|
Bir hata oluştu. Lütfen tekrar deneyin veya{' '}
|
||||||
<a href="mailto:info@ayris.tech" style={{ color: T.accent }}>info@ayris.tech</a> adresine yazın.
|
<a href="mailto:info@ayris.tech" style={{ color: T.red }}>info@ayris.tech</a> adresine yazın.
|
||||||
</div>
|
</div>
|
||||||
)}
|
)}
|
||||||
|
|
||||||
@@ -149,20 +146,19 @@ export default function ContactForm() {
|
|||||||
display: 'flex', alignItems: 'center', justifyContent: 'center', gap: '6px',
|
display: 'flex', alignItems: 'center', justifyContent: 'center', gap: '6px',
|
||||||
cursor: state === 'loading' ? 'not-allowed' : 'pointer',
|
cursor: state === 'loading' ? 'not-allowed' : 'pointer',
|
||||||
textDecoration: 'none',
|
textDecoration: 'none',
|
||||||
fontFamily: T.fontHead, fontWeight: 600, fontSize: '15px', lineHeight: 1.2,
|
fontFamily: T.fontMono, fontWeight: 700, fontSize: '13px', letterSpacing: '0.06em', textTransform: 'uppercase',
|
||||||
color: T.accent,
|
color: '#fff',
|
||||||
background: 'transparent',
|
background: T.ink,
|
||||||
border: `1px solid ${T.accent}`,
|
border: `2px solid ${T.ink}`,
|
||||||
padding: '12px',
|
padding: '14px',
|
||||||
borderRadius: T.radiusMd,
|
transition: 'background .12s',
|
||||||
transition: 'background .15s',
|
|
||||||
opacity: state === 'loading' ? 0.6 : 1,
|
opacity: state === 'loading' ? 0.6 : 1,
|
||||||
marginTop: '4px',
|
marginTop: '4px',
|
||||||
}}
|
}}
|
||||||
onMouseEnter={e => { if (state !== 'loading') (e.currentTarget as HTMLElement).style.background = 'rgba(182,130,53,0.10)' }}
|
onMouseEnter={e => { if (state !== 'loading') { (e.currentTarget as HTMLElement).style.background = T.red; (e.currentTarget as HTMLElement).style.borderColor = T.red } }}
|
||||||
onMouseLeave={e => { if (state !== 'loading') (e.currentTarget as HTMLElement).style.background = 'transparent' }}
|
onMouseLeave={e => { if (state !== 'loading') { (e.currentTarget as HTMLElement).style.background = T.ink; (e.currentTarget as HTMLElement).style.borderColor = T.ink } }}
|
||||||
>
|
>
|
||||||
{state === 'loading' ? 'Gönderiliyor…' : 'Demo Talep Et'}
|
{state === 'loading' ? 'GÖNDERİLİYOR…' : 'DEMO TALEP ET'}
|
||||||
</button>
|
</button>
|
||||||
</form>
|
</form>
|
||||||
)
|
)
|
||||||
|
|||||||
Reference in New Issue
Block a user