333 lines
27 KiB
HTML
333 lines
27 KiB
HTML
<!DOCTYPE html>
|
||
<html>
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<script src="./support.js"></script>
|
||
</head>
|
||
<body>
|
||
<x-dc>
|
||
<helmet>
|
||
<link rel="stylesheet" href="_ds/classical-911697ea-3fa0-408c-bdf6-3bbc9cae7b96/styles.css">
|
||
<script src="_ds/classical-911697ea-3fa0-408c-bdf6-3bbc9cae7b96/_ds_bundle.js"></script>
|
||
<script src="./image-slot.js"></script>
|
||
<style>
|
||
body{margin:0;text-wrap:pretty}
|
||
a{color:var(--color-accent);text-underline-offset:3px}
|
||
a:hover{color:var(--color-accent-700)}
|
||
@media (max-width: 980px){ .rail{display:none} .hero-badges{display:none} }
|
||
</style>
|
||
</helmet>
|
||
|
||
<div style="background:var(--color-bg);color:var(--color-text);font-family:var(--font-body);min-height:100vh;position:relative">
|
||
|
||
<div class="rail" style="position:fixed;left:22px;top:0;bottom:0;width:26px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:26px;z-index:20;font-feature-settings:'tnum' 1">
|
||
<sc-for list="{{ railItems }}" as="it" hint-placeholder-count="6">
|
||
<a href="{{ it.href }}" style="text-decoration:none;writing-mode:vertical-rl;font-size:11px;letter-spacing:0.08em;color:{{ it.color }};font-weight:{{ it.weight }};transition:color .2s">{{ it.label }}</a>
|
||
</sc-for>
|
||
</div>
|
||
|
||
<nav style="position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;padding:{{ navPad }};border-bottom:1px solid var(--color-divider);background:{{ navBg }};backdrop-filter:blur(10px);transition:padding .25s,background .25s">
|
||
<div style="display:flex;align-items:center;gap:10px">
|
||
<image-slot id="logo-mark" shape="rect" style="width:34px;height:34px" placeholder="Logo" radius="4"></image-slot>
|
||
<span style="font-family:var(--font-heading);font-weight:600;font-size:19px;letter-spacing:-0.01em">AyrisLegal</span>
|
||
</div>
|
||
<div style="display:flex;align-items:center;gap:24px;flex-wrap:wrap">
|
||
<a href="#farklilasim" style="color:inherit;text-decoration:none;font-size:14px">Farklılaşım</a>
|
||
<a href="#ozellikler" style="color:inherit;text-decoration:none;font-size:14px">Özellikler</a>
|
||
<a href="#fiyatlandirma" style="color:inherit;text-decoration:none;font-size:14px">Fiyatlandırma</a>
|
||
<a href="#iletisim" class="btn btn-primary">Demo Talep Et</a>
|
||
</div>
|
||
</nav>
|
||
|
||
<section style="max-width:1240px;margin:0 auto;padding:clamp(64px,11vw,132px) clamp(20px,6vw,72px) clamp(48px,7vw,80px);position:relative;overflow:hidden">
|
||
<span style="display:inline-block;font-size:13px;letter-spacing:0.1em;text-transform:uppercase;color:var(--color-accent-700);border-bottom:1px solid var(--color-accent);padding-bottom:4px;font-feature-settings:'tnum' 1;margin-bottom:26px">Madde 01 — Değer Önermesi</span>
|
||
<div style="display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:56px;align-items:center">
|
||
<div>
|
||
<h1 style="font-family:var(--font-heading);font-weight:400;font-size:clamp(46px,7.4vw,96px);line-height:0.98;letter-spacing:-0.015em;margin:0;margin-left:-0.03em">
|
||
<span style="display:block">Dosyanızı okur,</span>
|
||
<span style="display:block">sizinle <em style="font-style:italic;color:var(--color-accent-700)">tartışır.</em></span>
|
||
</h1>
|
||
<p style="font-size:clamp(17px,1.7vw,20px);line-height:1.65;max-width:52ch;margin:30px 0 0;color:color-mix(in srgb, var(--color-text) 82%, transparent)">
|
||
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>
|
||
<div style="display:flex;gap:14px;flex-wrap:wrap;margin-top:36px;align-items:center">
|
||
<a href="#iletisim" class="btn btn-primary" style="font-size:15px;padding:13px 24px">Demo Talep Et</a>
|
||
<a href="#farklilasim" class="btn btn-ghost" style="font-size:15px">Nasıl çalışır ↓</a>
|
||
</div>
|
||
<p style="font-size:13px;margin-top:24px;color:color-mix(in srgb, var(--color-text) 60%, transparent)">Şu an erken erişim aşamasındayız — kurucu ekiple doğrudan görüşün.</p>
|
||
</div>
|
||
<div style="position:relative">
|
||
<div class="hero-badges" style="position:absolute;top:-18px;right:6px;z-index:2;background:var(--color-bg);border:1px solid var(--color-divider);border-radius:var(--radius-md);padding:8px 14px;font-size:12.5px;box-shadow:var(--shadow-sm);transform:rotate(-2deg)">İçtihat bulundu · 3 emsal</div>
|
||
<div class="hero-badges" style="position:absolute;bottom:-16px;left:-14px;z-index:2;background:var(--color-bg);border:1px solid var(--color-divider);border-radius:var(--radius-md);padding:8px 14px;font-size:12.5px;box-shadow:var(--shadow-sm);transform:rotate(2deg)">Dilekçe taslağı hazır</div>
|
||
<figure class="plate" style="margin:0">
|
||
<image-slot id="hero-plate" shape="rect" radius="2" style="width:100%;aspect-ratio:4/5" placeholder="Temsili çalışma ekranı görseli"></image-slot>
|
||
</figure>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section style="max-width:1240px;margin:0 auto;padding:0 clamp(20px,6vw,72px) clamp(56px,8vw,88px);display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));border-top:1px solid var(--color-divider);border-bottom:1px solid var(--color-divider)">
|
||
<sc-for list="{{ stats }}" as="s" hint-placeholder-count="4">
|
||
<div style="padding:28px 20px;border-right:1px solid var(--color-divider);text-align:center">
|
||
<div style="font-family:var(--font-heading);font-weight:400;font-size:clamp(30px,4vw,44px);font-feature-settings:'tnum' 1;color:var(--color-accent-700)">{{ s.value }}</div>
|
||
<div style="font-size:13px;margin-top:6px;color:color-mix(in srgb, var(--color-text) 65%, transparent);letter-spacing:0.02em">{{ s.label }}</div>
|
||
</div>
|
||
</sc-for>
|
||
</section>
|
||
|
||
<section data-reveal="problem" style="max-width:1240px;margin:0 auto;padding:clamp(48px,8vw,96px) clamp(20px,6vw,72px);opacity:{{ reveal.problem.opacity }};transform:{{ reveal.problem.transform }};transition:opacity .7s ease,transform .7s ease">
|
||
<span style="display:block;font-size:13px;letter-spacing:0.08em;text-transform:uppercase;color:var(--color-accent-700);font-feature-settings:'tnum' 1;margin-bottom:14px">Madde 02 — Bugünün iş akışı</span>
|
||
<h2 style="font-family:var(--font-heading);font-weight:400;font-size:clamp(30px,3.6vw,44px);margin:0 0 44px;letter-spacing:-0.008em;max-width:24ch">Dosya, arama, şablon, tekrar.</h2>
|
||
<div style="display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:0;border-top:1px solid var(--color-divider)">
|
||
<div style="padding:32px 28px 32px 0;border-right:1px solid var(--color-divider)">
|
||
<span style="font-family:var(--font-heading);font-size:15px;color:color-mix(in srgb, var(--color-text) 45%, transparent);font-feature-settings:'tnum' 1">01 / Bugün</span>
|
||
<p style="font-size:15.5px;line-height:1.7;margin:14px 0 0;text-align:justify;hyphens:auto;color:color-mix(in srgb, var(--color-text) 78%, transparent)">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>
|
||
</div>
|
||
<div style="padding:32px 0 32px 28px">
|
||
<span style="font-family:var(--font-heading);font-size:15px;color:var(--color-accent-700);font-feature-settings:'tnum' 1">02 / AyrisLegal ile</span>
|
||
<p style="font-size:15.5px;line-height:1.7;margin:14px 0 0;text-align:justify;hyphens:auto;color:color-mix(in srgb, var(--color-text) 78%, transparent)">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>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<hr class="hr" style="margin:0;max-width:1240px;margin-inline:auto">
|
||
|
||
<section id="farklilasim" data-reveal="farklilasim" style="max-width:1240px;margin:0 auto;padding:clamp(56px,9vw,108px) clamp(20px,6vw,72px);opacity:{{ reveal.farklilasim.opacity }};transform:{{ reveal.farklilasim.transform }};transition:opacity .7s ease,transform .7s ease">
|
||
<span style="display:block;font-size:13px;letter-spacing:0.08em;text-transform:uppercase;color:var(--color-accent-700);font-feature-settings:'tnum' 1;margin-bottom:14px">Madde 03 — Tartışma odaklı yapay zeka</span>
|
||
<div style="display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:center">
|
||
<div>
|
||
<h2 style="font-family:var(--font-heading);font-weight:400;font-size:clamp(28px,3.2vw,40px);margin:0 0 20px;letter-spacing:-0.008em;max-width:16ch">Bulmakla yetinmez, sizinle tartışır.</h2>
|
||
<p style="font-size:15.5px;line-height:1.7;margin:0 0 16px;max-width:46ch;text-align:justify;hyphens:auto;color:color-mix(in srgb, var(--color-text) 78%, transparent)">Ç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 style="font-size:13px;margin:0;color:color-mix(in srgb, var(--color-text) 58%, transparent)">Aşağıdaki görsel, bu tartışmanın nasıl göründüğünü gösteren temsili bir tasarımdır.</p>
|
||
</div>
|
||
<div class="plate" style="margin:0;padding:28px;display:flex;flex-direction:column;gap:14px">
|
||
<div style="align-self:flex-end;max-width:78%;background:var(--color-bg);border:1px solid var(--color-divider);border-radius:var(--radius-md) var(--radius-md) 4px var(--radius-md);padding:14px 16px">
|
||
<div style="font-size:11px;letter-spacing:0.06em;text-transform:uppercase;color:color-mix(in srgb, var(--color-text) 55%, transparent);margin-bottom:6px">Avukat</div>
|
||
<p style="margin:0;font-size:14.5px;line-height:1.6">Müvekkilin haklı olduğunu düşünüyorum, mülkiyet devri geçerli.</p>
|
||
</div>
|
||
<div style="align-self:flex-start;max-width:82%;background:var(--color-surface);border:1px solid var(--color-accent);border-radius:var(--radius-md) var(--radius-md) var(--radius-md) 4px;padding:14px 16px">
|
||
<div style="display:flex;align-items:center;gap:8px;margin-bottom:6px">
|
||
<span style="font-size:11px;letter-spacing:0.06em;text-transform:uppercase;color:var(--color-accent-700)">AyrisLegal</span>
|
||
<span class="tag tag-outline" style="font-size:10.5px">İtiraz</span>
|
||
</div>
|
||
<p style="margin:0;font-size:14.5px;line-height:1.6">Devir tarihinde tapuda şerh var — bu, iyi niyet iddianızı zayıflatabilir. Şerhin kaldırılış tarihini kontrol ettiniz mi?</p>
|
||
</div>
|
||
<div style="align-self:flex-end;max-width:78%;background:var(--color-bg);border:1px solid var(--color-divider);border-radius:var(--radius-md) var(--radius-md) 4px var(--radius-md);padding:14px 16px">
|
||
<p style="margin:0;font-size:14.5px;line-height:1.6">Haklısınız — 3 emsal kararla bu noktayı destekleyelim.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<hr class="hr" style="margin:0;max-width:1240px;margin-inline:auto">
|
||
|
||
<section id="ozellikler" data-reveal="ozellikler" style="max-width:1240px;margin:0 auto;padding:clamp(56px,9vw,108px) clamp(20px,6vw,72px);opacity:{{ reveal.ozellikler.opacity }};transform:{{ reveal.ozellikler.transform }};transition:opacity .7s ease,transform .7s ease">
|
||
<span style="display:block;font-size:13px;letter-spacing:0.08em;text-transform:uppercase;color:var(--color-accent-700);font-feature-settings:'tnum' 1;margin-bottom:14px">Madde 04 — Platform</span>
|
||
<h2 style="font-family:var(--font-heading);font-weight:400;font-size:clamp(30px,3.6vw,44px);margin:0 0 40px;letter-spacing:-0.008em">Bir avukatın ihtiyaç duyduğu şeyler.</h2>
|
||
<div style="display:grid;grid-template-columns:repeat(3,1fr);gap:20px">
|
||
<div class="card elev-sm" style="grid-column:span 2;display:flex;flex-direction:column;gap:10px;justify-content:center">
|
||
<span class="card-kicker">AI tartışma ortağı</span>
|
||
<h3 class="card-title" style="font-size:26px">Argümanınızı sınar, meslektaş gibi</h3>
|
||
<p class="card-body">Zayıf noktaları sorar, karşı görüş üretir, sizi zorlar — pasif özet değil, aktif muhakeme. AyrisLegal'ın temel farkı budur.</p>
|
||
</div>
|
||
<div class="card elev-sm">
|
||
<span class="card-kicker">Dosya analizi</span>
|
||
<h3 class="card-title">Dava dosyasını okur</h3>
|
||
<p class="card-body">Olay örgüsünü, tarafları ve hukuki dayanakları çıkarır.</p>
|
||
</div>
|
||
<div class="card elev-sm">
|
||
<span class="card-kicker">İçtihat arama</span>
|
||
<h3 class="card-title">Bağlama uygun emsal bulur</h3>
|
||
<p class="card-body">Anahtar kelime eşleşmesiyle değil, hukuki benzerlikle emsal kararları bulur.</p>
|
||
</div>
|
||
<div class="card elev-sm">
|
||
<span class="card-kicker">Dilekçe taslağı</span>
|
||
<h3 class="card-title">Tartışmayı taslağa döker</h3>
|
||
<p class="card-body">Vardığınız sonucu, düzenlenebilir bir dilekçe taslağına dönüştürür.</p>
|
||
</div>
|
||
<div class="card elev-sm">
|
||
<span class="card-kicker" style="display:flex;align-items:center;gap:8px">Büro paylaşımı <span class="tag tag-outline">Yakında</span></span>
|
||
<h3 class="card-title">Ekip çalışması</h3>
|
||
<p class="card-body">Dosya ve tartışma geçmişini büro içindeki meslektaşlarınızla paylaşın.</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<hr class="hr" style="margin:0;max-width:1240px;margin-inline:auto">
|
||
|
||
<section id="fiyatlandirma" data-reveal="fiyatlandirma" style="max-width:1240px;margin:0 auto;padding:clamp(56px,9vw,108px) clamp(20px,6vw,72px);opacity:{{ reveal.fiyatlandirma.opacity }};transform:{{ reveal.fiyatlandirma.transform }};transition:opacity .7s ease,transform .7s ease">
|
||
<span style="display:block;font-size:13px;letter-spacing:0.08em;text-transform:uppercase;color:var(--color-accent-700);font-feature-settings:'tnum' 1;margin-bottom:14px;text-align:center">Madde 05 — Fiyatlandırma</span>
|
||
<h2 style="font-family:var(--font-heading);font-weight:400;font-size:clamp(30px,3.6vw,44px);margin:0 0 44px;text-align:center;letter-spacing:-0.008em">Tek fiyat, herkese aynı.</h2>
|
||
<div style="max-width:520px;margin:0 auto;display:flex;border:1px solid var(--color-divider);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);overflow:hidden">
|
||
<div style="width:34px;background:var(--color-neutral-100);display:flex;flex-direction:column;align-items:center;justify-content:space-evenly;border-right:1px solid var(--color-divider);padding:20px 0">
|
||
<sc-for list="{{ pricingTicks }}" as="t" hint-placeholder-count="5">
|
||
<span style="font-size:11px;font-feature-settings:'tnum' 1;color:var(--color-accent-700);writing-mode:vertical-rl">{{ t }}</span>
|
||
</sc-for>
|
||
</div>
|
||
<div style="flex:1;padding:40px 36px;text-align:center">
|
||
<p style="margin:0;font-family:var(--font-heading);font-weight:400;font-size:clamp(46px,6vw,64px);line-height:1;font-feature-settings:'tnum' 1">40.000 TL</p>
|
||
<p style="margin:6px 0 0;font-size:14px;letter-spacing:0.06em;text-transform:uppercase;color:color-mix(in srgb, var(--color-text) 60%, transparent)">/ yıl</p>
|
||
<p style="font-size:15px;line-height:1.6;max-width:32ch;margin:20px auto 0;color:color-mix(in srgb, var(--color-text) 78%, transparent)">Bireysel çalışan avukat ya da büro ortağı — fark etmez. Tüm bireysel avukatlara tek, sabit fiyat.</p>
|
||
<hr class="hr" style="margin:24px 0">
|
||
<ul style="list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px;text-align:left">
|
||
<li style="display:flex;gap:10px;font-size:14.5px"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="var(--color-accent)" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" style="flex:none;margin-top:2px"><polyline points="20 6 9 17 4 12"></polyline></svg>Sınırsız dosya analizi</li>
|
||
<li style="display:flex;gap:10px;font-size:14.5px"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="var(--color-accent)" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" style="flex:none;margin-top:2px"><polyline points="20 6 9 17 4 12"></polyline></svg>AI tartışma ortağı</li>
|
||
<li style="display:flex;gap:10px;font-size:14.5px"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="var(--color-accent)" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" style="flex:none;margin-top:2px"><polyline points="20 6 9 17 4 12"></polyline></svg>İçtihat arama</li>
|
||
<li style="display:flex;gap:10px;font-size:14.5px"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="var(--color-accent)" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" style="flex:none;margin-top:2px"><polyline points="20 6 9 17 4 12"></polyline></svg>Dilekçe taslağı üretimi</li>
|
||
<li style="display:flex;gap:10px;font-size:14.5px"><svg width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="var(--color-accent)" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round" style="flex:none;margin-top:2px"><polyline points="20 6 9 17 4 12"></polyline></svg>Kurucu ekiple doğrudan destek</li>
|
||
</ul>
|
||
<a href="#iletisim" class="btn btn-primary btn-block" style="margin-top:26px;font-size:15px;padding:12px">Demo Talep Et</a>
|
||
<p style="font-size:12px;margin:14px 0 0;color:color-mix(in srgb, var(--color-text) 55%, transparent)">Yıllık faturalandırma. Gizli ücret yok.</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<hr class="hr" style="margin:0;max-width:1240px;margin-inline:auto">
|
||
|
||
<section id="guven" data-reveal="guven" style="max-width:1240px;margin:0 auto;padding:clamp(56px,9vw,108px) clamp(20px,6vw,72px);opacity:{{ reveal.guven.opacity }};transform:{{ reveal.guven.transform }};transition:opacity .7s ease,transform .7s ease">
|
||
<span style="display:block;font-size:13px;letter-spacing:0.08em;text-transform:uppercase;color:var(--color-accent-700);font-feature-settings:'tnum' 1;margin-bottom:14px">Madde 06 — Güven ve veri güvenliği</span>
|
||
<h2 style="font-family:var(--font-heading);font-weight:400;font-size:clamp(30px,3.6vw,44px);margin:0 0 16px;letter-spacing:-0.008em">Dosyalarınız sizin kalır.</h2>
|
||
<p style="font-size:15.5px;line-height:1.7;max-width:60ch;margin:0 0 40px;color:color-mix(in srgb, var(--color-text) 78%, transparent)">Bir dava dosyası, bir avukatın elindeki en hassas belgedir. AyrisLegal'ı bu bilinçle kuruyoruz.</p>
|
||
<div style="display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:0;border-top:1px solid var(--color-divider)">
|
||
<div style="padding:28px 24px 0 0;border-right:1px solid var(--color-divider)">
|
||
<svg width="26" height="26" viewBox="0 0 24 24" fill="none" stroke="var(--color-accent)" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="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><path d="M9 12 l2.2 2.2 L15.5 9.5"></path></svg>
|
||
<h3 style="font-family:var(--font-heading);font-weight:400;font-size:19px;margin:12px 0 6px">KVKK'ya uyumlu</h3>
|
||
<p style="font-size:14.5px;line-height:1.6;margin:0;color:color-mix(in srgb, var(--color-text) 78%, transparent)">Kişisel verilerin korunması mevzuatına uygun işleme ve saklama.</p>
|
||
</div>
|
||
<div style="padding:28px 24px 0;border-right:1px solid var(--color-divider)">
|
||
<svg width="26" height="26" viewBox="0 0 24 24" fill="none" stroke="var(--color-accent)" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="4" width="18" height="6" rx="1.5"></rect><rect x="3" y="14" width="18" height="6" rx="1.5"></rect><line x1="7" y1="7" x2="7" y2="7"></line><line x1="7" y1="17" x2="7" y2="17"></line></svg>
|
||
<h3 style="font-family:var(--font-heading);font-weight:400;font-size:19px;margin:12px 0 6px">Sunucular Türkiye'de</h3>
|
||
<p style="font-size:14.5px;line-height:1.6;margin:0;color:color-mix(in srgb, var(--color-text) 78%, transparent)">Verileriniz yurt dışına çıkmaz — Ayris Tech'in self-hosted altyapı felsefesiyle.</p>
|
||
</div>
|
||
<div style="padding:28px 0 0 24px">
|
||
<svg width="26" height="26" viewBox="0 0 24 24" fill="none" stroke="var(--color-accent)" stroke-width="1.8" stroke-linecap="round" stroke-linejoin="round"><rect x="5" y="10" width="14" height="10" rx="1.5"></rect><path d="M8 10 V7 a4 4 0 0 1 8 0 v3"></path></svg>
|
||
<h3 style="font-family:var(--font-heading);font-weight:400;font-size:19px;margin:12px 0 6px">Dosyanız modelleri eğitmez</h3>
|
||
<p style="font-size:14.5px;line-height:1.6;margin:0;color:color-mix(in srgb, var(--color-text) 78%, transparent)">Yüklediğiniz belgeler yalnızca sizin analizinizde kullanılır.</p>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<hr class="hr" style="margin:0;max-width:1240px;margin-inline:auto">
|
||
|
||
<section id="iletisim" data-reveal="iletisim" style="max-width:1240px;margin:0 auto;padding:clamp(56px,9vw,108px) clamp(20px,6vw,72px);opacity:{{ reveal.iletisim.opacity }};transform:{{ reveal.iletisim.transform }};transition:opacity .7s ease,transform .7s ease">
|
||
<span style="display:block;font-size:13px;letter-spacing:0.08em;text-transform:uppercase;color:var(--color-accent-700);font-feature-settings:'tnum' 1;margin-bottom:14px">Madde 07 — Erken erişim</span>
|
||
<div style="display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:48px">
|
||
<div>
|
||
<h2 style="font-family:var(--font-heading);font-weight:400;font-size:clamp(28px,3.2vw,38px);margin:0 0 16px;letter-spacing:-0.008em">Şu an müşteri referansı göstermiyoruz — kasıtlı olarak.</h2>
|
||
<p style="font-size:15.5px;line-height:1.7;margin:0;text-align:justify;hyphens:auto;color:color-mix(in srgb, var(--color-text) 78%, transparent)">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>
|
||
<div style="margin-top:32px;display:flex;align-items:center;gap:14px">
|
||
<div style="width:44px;height:44px;border:1px solid var(--color-accent);border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--font-heading);font-size:11px;letter-spacing:0.03em;color:var(--color-accent-700);text-align:center;line-height:1.1">AYRIS<br/>LEGAL</div>
|
||
<span style="font-size:12.5px;color:color-mix(in srgb, var(--color-text) 60%, transparent)">Kurucu ekip mührü</span>
|
||
</div>
|
||
</div>
|
||
<sc-if value="{{ submitted }}" hint-placeholder-val="{{ false }}">
|
||
<div style="border:1px solid var(--color-divider);border-radius:var(--radius-lg);padding:40px;text-align:center;background:var(--color-surface)">
|
||
<h3 style="font-family:var(--font-heading);font-weight:400;font-size:22px;margin:0 0 8px">Talebiniz alındı.</h3>
|
||
<p style="font-size:14.5px;margin:0;color:color-mix(in srgb, var(--color-text) 78%, transparent)">Kurucu ekipten kısa süre içinde size dönüş yapılacak.</p>
|
||
</div>
|
||
</sc-if>
|
||
<sc-if value="{{ notSubmitted }}" hint-placeholder-val="{{ true }}">
|
||
<form onSubmit="{{ handleSubmit }}" style="display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;border:1px solid var(--color-divider);border-radius:var(--radius-lg);padding:28px">
|
||
<div class="field" style="grid-column:span 1">
|
||
<label for="af-name">Ad Soyad</label>
|
||
<input id="af-name" class="input" type="text" placeholder="Av. Ayşe Yılmaz" required="{{ true }}"></input>
|
||
</div>
|
||
<div class="field">
|
||
<label for="af-org">Büro / Kurum</label>
|
||
<input id="af-org" class="input" type="text" placeholder="Yılmaz Hukuk Bürosu"></input>
|
||
</div>
|
||
<div class="field">
|
||
<label for="af-email">E-posta</label>
|
||
<input id="af-email" class="input" type="email" placeholder="ayse@buro.com" required="{{ true }}"></input>
|
||
</div>
|
||
<div class="field">
|
||
<label for="af-phone">Telefon</label>
|
||
<input id="af-phone" class="input" type="tel" placeholder="0532 000 00 00"></input>
|
||
</div>
|
||
<button type="submit" class="btn btn-primary btn-block" style="grid-column:1 / -1;padding:12px">Demo Talep Et</button>
|
||
</form>
|
||
</sc-if>
|
||
</div>
|
||
</section>
|
||
|
||
<footer style="max-width:1240px;margin:0 auto;padding:28px clamp(20px,6vw,72px) 40px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font-size:13px;color:color-mix(in srgb, var(--color-text) 60%, transparent)">
|
||
<span>AyrisLegal, Ayris Tech'in bir ürünüdür.</span>
|
||
<span>© {{ year }} AyrisLegal · <a href="#" style="color:inherit">Aydınlatma Metni</a></span>
|
||
</footer>
|
||
|
||
</div>
|
||
|
||
</x-dc>
|
||
<script type="text/x-dc" data-dc-script>
|
||
const SECTIONS = ['problem','farklilasim','ozellikler','fiyatlandirma','guven','iletisim'];
|
||
const RAIL = [
|
||
{ id: 'problem', label: '02', href: '#is-akisi' },
|
||
{ id: 'farklilasim', label: '03', href: '#farklilasim' },
|
||
{ id: 'ozellikler', label: '04', href: '#ozellikler' },
|
||
{ id: 'fiyatlandirma', label: '05', href: '#fiyatlandirma' },
|
||
{ id: 'guven', label: '06', href: '#guven' },
|
||
{ id: 'iletisim', label: '07', href: '#iletisim' },
|
||
];
|
||
|
||
class Component extends DCLogic {
|
||
state = { submitted: false, visible: {}, scrolled: false, active: null };
|
||
|
||
componentDidMount() {
|
||
this._onScroll = () => this.setState({ scrolled: window.scrollY > 12 });
|
||
window.addEventListener('scroll', this._onScroll, { passive: true });
|
||
this._observer = new IntersectionObserver((entries) => {
|
||
entries.forEach((e) => {
|
||
const id = e.target.getAttribute('data-reveal');
|
||
if (e.isIntersecting) {
|
||
this.setState((s) => ({ visible: { ...s.visible, [id]: true }, active: id }));
|
||
}
|
||
});
|
||
}, { threshold: 0.2 });
|
||
document.querySelectorAll('[data-reveal]').forEach((el) => this._observer.observe(el));
|
||
}
|
||
|
||
componentWillUnmount() {
|
||
window.removeEventListener('scroll', this._onScroll);
|
||
if (this._observer) this._observer.disconnect();
|
||
}
|
||
|
||
handleSubmit = (e) => {
|
||
e.preventDefault();
|
||
this.setState({ submitted: true });
|
||
};
|
||
|
||
renderVals() {
|
||
const reveal = {};
|
||
SECTIONS.forEach((id) => {
|
||
const on = !!this.state.visible[id];
|
||
reveal[id] = { opacity: on ? 1 : 0, transform: on ? 'translateY(0)' : 'translateY(28px)' };
|
||
});
|
||
const railItems = RAIL.map((r) => ({
|
||
...r,
|
||
color: this.state.active === r.id ? 'var(--color-accent-700)' : 'color-mix(in srgb, var(--color-text) 40%, transparent)',
|
||
weight: this.state.active === r.id ? 600 : 400,
|
||
}));
|
||
return {
|
||
submitted: this.state.submitted,
|
||
notSubmitted: !this.state.submitted,
|
||
handleSubmit: this.handleSubmit,
|
||
year: new Date().getFullYear(),
|
||
reveal,
|
||
railItems,
|
||
navPad: this.state.scrolled ? '10px clamp(20px,6vw,64px)' : '14px clamp(20px,6vw,64px)',
|
||
navBg: this.state.scrolled ? 'color-mix(in srgb, var(--color-bg) 88%, transparent)' : 'transparent',
|
||
stats: [
|
||
{ value: '01', label: 'Sabit fiyat, tüm avukatlara' },
|
||
{ value: '40.000 TL', label: 'Yıllık, gizli ücret yok' },
|
||
{ value: '%100', label: 'Veri Türkiye\u2019de kalır' },
|
||
{ value: '7/24', label: 'Dosyanızla çalışan ortak' },
|
||
],
|
||
pricingTicks: ['01', '02', '03', '04', '05'],
|
||
};
|
||
}
|
||
}
|
||
</script>
|
||
</body>
|
||
</html>
|