:root{
  --ink:#141414; --ink-soft:#1F1F1D; --paper:#FAFAF8; --paper-alt:#F0EFEA;
  --gold:#C9962F; --gold-soft:#E3C583; --line:#E4E2DA; --muted:#75736C;
  --ease-out: cubic-bezier(0.23, 1, 0.32, 1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{background:var(--paper);color:var(--ink);font-family:'Inter',sans-serif;-webkit-font-smoothing:antialiased;line-height:1.5}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button{font:inherit;background:none;border:none;cursor:pointer;color:inherit}
a:focus-visible, button:focus-visible{outline:2px solid var(--gold); outline-offset:3px; border-radius:4px}

.font-display{font-family:'Space Grotesk',sans-serif}
.font-mono{font-family:'JetBrains Mono',monospace;font-variant-numeric:tabular-nums}
.font-bold{font-weight:700} .font-semibold{font-weight:600} .font-medium{font-weight:500}
.text-gold{color:var(--gold)}
.bg-ink{background:var(--ink)}
.muted{color:var(--muted)} .dim{color:var(--line)}
.muted-sm{color:#9C9A92; font-size:12px}
.max-w-4xl{max-width:56rem} .max-w-7xl{max-width:80rem} .max-w-xl{max-width:34rem}
.mx-auto{margin-left:auto;margin-right:auto}
.px-inner{padding-left:1.25rem;padding-right:1.25rem}
.flex{display:flex} .items-center{align-items:center} .justify-between{justify-content:space-between} .justify-center{justify-content:center}
.gap-6{gap:1.5rem}
.w-full{width:100%} .block{display:block} .text-center{text-align:center}
.text-sm{font-size:.875rem} .text-xs{font-size:.75rem} .text-lg{font-size:1.125rem} .text-xl{font-size:1.25rem} .text-13{font-size:13px} .text-12{font-size:12px}
.mb-1{margin-bottom:.25rem} .mb-5{margin-bottom:1.25rem} .mb-6{margin-bottom:1.5rem} .mb-7{margin-bottom:1.75rem}
.px-3{padding-left:.75rem;padding-right:.75rem} .py-2{padding-top:.5rem;padding-bottom:.5rem}
@media (min-width:768px){ .px-inner{padding-left:2rem;padding-right:2rem} }

/* header */
.site-header{position:sticky; top:0; z-index:50; background:rgba(250,250,248,.92); backdrop-filter:blur(8px); border-bottom:1px solid var(--line)}
.h-16{height:4rem}
.brand{display:flex; align-items:center; gap:.6rem}
.nav-desktop{display:none; align-items:center; gap:2rem}
.nav-link{position:relative; font-size:.875rem; font-weight:500}
.nav-link::after{content:"";position:absolute;left:0;bottom:-4px;width:0;height:1.5px;background:var(--gold);transition:width .2s var(--ease-out)}
.nav-link:hover::after{width:100%}
.menu-btn{display:block; padding:.5rem; margin-right:-.5rem}
.mobile-menu{display:none; flex-direction:column; gap:1rem; position:absolute; left:0; right:0; background:var(--paper); border-bottom:1px solid var(--line); padding:1rem 1.25rem 1.25rem; font-size:.875rem; font-weight:500}
.mobile-menu.open{display:flex}
@media (min-width:768px){
  .nav-desktop{display:flex}
  .menu-btn{display:none}
  .mobile-menu{display:none !important}
}

/* buttons */
.btn-primary{background:var(--ink); color:var(--paper); font-weight:600; border-radius:10px; padding:.85rem 1.6rem; transition:transform .15s var(--ease-out), background .15s ease; display:inline-flex; align-items:center; gap:.5rem}
.btn-primary:active{transform:scale(.97)}
.btn-ghost{border:1.5px solid var(--ink); color:var(--ink); font-weight:600; border-radius:10px; padding:.8rem 1.5rem; transition:background .15s ease, transform .15s var(--ease-out)}
.btn-ghost:active{transform:scale(.97)}
.btn-gold{background:var(--gold); color:#141414; font-weight:700; border-radius:10px; padding:.8rem 1.5rem; transition:transform .15s var(--ease-out), filter .15s ease}
.btn-gold:active{transform:scale(.97)}
@media (hover:hover) and (pointer:fine){
  .btn-primary:hover{background:var(--ink-soft); transform:translateY(-1px)}
  .btn-ghost:hover{background:rgba(20,20,20,.05); transform:translateY(-1px)}
  .btn-gold:hover{filter:brightness(1.08); transform:translateY(-1px)}
}

/* reveal */
.reveal-init{opacity:0; transform:translateY(18px); transition:opacity .6s var(--ease-out), transform .6s var(--ease-out)}
.reveal.in{opacity:1; transform:translateY(0)}

/* hero */
.hero-section{display:grid; grid-template-columns:1fr; gap:3rem; align-items:center; padding-top:3.5rem; padding-bottom:4rem}
.hero-copy{min-width:0}
.eyebrow{font-size:.75rem; letter-spacing:.05em; text-transform:uppercase; color:var(--gold); margin-bottom:1rem}
.hero-h1{font-size:2.3rem; line-height:1.1; letter-spacing:-0.02em}
.hero-sub{margin-top:1.5rem; font-size:1.05rem; color:#4B4A45; max-width:30rem}
.hero-actions{margin-top:2rem; display:flex; flex-wrap:wrap; gap:.75rem}
.stat-row{margin-top:2.5rem; display:flex; gap:2.25rem}
.stat-num{font-size:1.6rem; font-weight:700}
.stat-label{font-size:.75rem; color:var(--muted); margin-top:.15rem}

.hero-visual{position:relative; display:flex; justify-content:center}
.browser-frame{width:100%; max-width:440px; background:#fff; border-radius:14px; border:1px solid var(--line); box-shadow:0 30px 60px -25px rgba(20,20,20,.25); overflow:hidden}
.browser-bar{display:flex; align-items:center; gap:6px; padding:.6rem .8rem; border-bottom:1px solid var(--line); background:#F5F4F0}
.dot{width:8px; height:8px; border-radius:50%}
.browser-url{margin-left:.5rem; font-size:11px; color:#9C9A92}
.browser-body{padding:1rem}
.mini-topline{display:flex; gap:.5rem; margin-bottom:.85rem}
.mini-chip{font-size:10.5px; font-weight:600; background:var(--paper-alt); border:1px solid var(--line); border-radius:999px; padding:4px 9px; color:#4B4A45}
.mini-chip b{color:var(--ink)}
.mini-pipeline{display:grid; grid-template-columns:repeat(4,1fr); gap:6px; margin-bottom:.85rem}
.mini-col{min-width:0}
.mini-col-h{font-size:8.5px; text-transform:uppercase; letter-spacing:.03em; color:#9C9A92; font-weight:700; display:block; margin-bottom:5px}
.mini-card{height:20px; border-radius:5px; background:var(--paper-alt); border:1px solid var(--line); margin-bottom:5px}
.mini-card-gold{background:var(--gold-soft); border-color:var(--gold)}
.mini-chatrow{display:flex; align-items:center; gap:8px; border-top:1px solid var(--line); padding-top:.75rem}
.mini-ch-badge{width:20px; height:20px; border-radius:6px; background:#3F9C5C; color:#fff; font-size:10px; font-weight:700; display:flex; align-items:center; justify-content:center; flex-shrink:0}
.mini-chat-lines{flex:1; display:flex; flex-direction:column; gap:4px}
.line{display:block; height:6px; border-radius:3px; background:var(--paper-alt)}
.line-1{width:70%} .line-2{width:45%}
.mini-ai-tag{font-size:9px; font-weight:700; color:var(--gold); background:rgba(201,150,47,.12); padding:2px 6px; border-radius:4px; white-space:nowrap}

.float-idle{animation:float 5s ease-in-out infinite}
@keyframes float{0%,100%{transform:translateY(0)} 50%{transform:translateY(-10px)}}
.deco-ring{position:absolute; border:1.5px solid var(--gold-soft); border-radius:50%; opacity:.5; pointer-events:none}
.deco-ring-1{width:90px; height:90px; top:-20px; right:10px}
.deco-ring-2{width:50px; height:50px; bottom:0; left:0}
@media (prefers-reduced-motion: reduce){ .float-idle{animation:none} }

@media (min-width:768px){
  .hero-section{grid-template-columns:1fr 1fr; gap:2.5rem; padding-top:5rem; padding-bottom:6rem}
  .hero-h1{font-size:3.3rem; line-height:1.05}
}

/* trust strip */
.trust-strip-wrap{border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:var(--paper-alt)}
.trust-strip{display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:.75rem 2.25rem; padding:1.4rem 0}

/* sections */
.section-pad{padding-top:5rem; padding-bottom:5rem}
.center-head{margin:0 auto 3rem; text-align:center; max-width:38rem}
.eyebrow-inline{font-size:.75rem; letter-spacing:.05em; text-transform:uppercase; color:var(--gold); margin-bottom:.75rem}
.section-h2{font-size:1.8rem; line-height:1.2; letter-spacing:-0.01em}
@media (min-width:768px){ .section-h2{font-size:2.4rem} .section-pad{padding-top:7rem; padding-bottom:7rem} }

/* feature rows */
.feature-row{display:grid; grid-template-columns:1fr; gap:2rem; align-items:center; margin-bottom:4.5rem}
.feature-row:last-child{margin-bottom:0}
@media (min-width:900px){
  .feature-row{grid-template-columns:1fr 1fr; gap:3.5rem}
  .feature-row-rev .feature-text{order:2}
  .feature-row-rev .feature-visual{order:1}
}
.feature-kicker{font-family:'JetBrains Mono',monospace; font-size:11px; font-weight:600; color:var(--gold); text-transform:uppercase; letter-spacing:.04em}
.feature-h3{font-size:1.6rem; line-height:1.2; margin-top:.6rem; margin-bottom:.9rem; letter-spacing:-0.01em}
.feature-p{color:#4B4A45; font-size:.95rem; line-height:1.65; max-width:26rem}

.mockup-card{background:#fff; border:1px solid var(--line); border-radius:14px; padding:1.1rem; box-shadow:0 20px 45px -25px rgba(20,20,20,.2)}
.mockup-msg{display:flex; gap:10px; padding:.65rem 0; border-bottom:1px solid var(--paper-alt)}
.mockup-msg:last-child{border-bottom:none; padding-bottom:0}
.mockup-msg:first-child{padding-top:0}
.mockup-msg-body{flex:1; min-width:0}
.mockup-msg-top{display:flex; justify-content:space-between; font-size:12.5px; margin-bottom:2px}
.mockup-msg-text{font-size:12px; color:#5B594F; margin-bottom:4px}
.ch-wa{background:#3F9C5C} .ch-ig{background:linear-gradient(135deg,#C1367C,#E5A13B)} .ch-ph{background:#141414}

.mockup-pipeline{display:grid; grid-template-columns:repeat(3,1fr); gap:.6rem}
.mp-col{display:flex; flex-direction:column; gap:.4rem}
.mp-h{font-size:9px; text-transform:uppercase; letter-spacing:.03em; color:#9C9A92; font-weight:700}
.mp-card{background:var(--paper-alt); border:1px solid var(--line); border-radius:8px; padding:.5rem .55rem; font-size:11px}
.mp-card b{display:block; font-size:11.5px; margin-bottom:1px}
.mp-card span{color:#7C7A72; font-size:10.5px}
.mp-card-gold{background:var(--gold-soft); border-color:var(--gold)}
.mp-card-gold em{display:block; font-style:normal; font-size:9.5px; font-weight:700; color:#8A6317; margin-top:3px}

.mockup-chart{display:flex; flex-direction:column; gap:.9rem}
.chart-head{display:flex; align-items:center; justify-content:space-between}
.chart-bars{display:flex; align-items:flex-end; gap:8px; height:110px}
.cbar{flex:1; height:var(--h); background:var(--paper-alt); border:1px solid var(--line); border-radius:5px 5px 0 0}
.cbar-gold{background:var(--gold)}

/* nasil calisir */
.steps-grid{display:grid; grid-template-columns:1fr; gap:2.5rem}
.step-card{min-width:0}
@media (min-width:768px){ .steps-grid{grid-template-columns:repeat(3,1fr); gap:2rem} }
.step-num{color:var(--gold-soft); font-size:.875rem; margin-bottom:1rem}
.step-h{color:#FAFAF8; font-size:1.15rem; margin-bottom:.5rem}
.step-p{color:#A8A69E; font-size:.875rem; line-height:1.6}

/* pricing */
.pricing-grid{display:grid; grid-template-columns:1fr; gap:1.5rem}
@media (min-width:768px){ .pricing-grid{grid-template-columns:repeat(3,1fr)} }
.pricing-card{border:1px solid var(--line); border-radius:1.1rem; padding:1.75rem; background:var(--paper-alt); transition:transform .2s var(--ease-out), border-color .2s ease, box-shadow .2s ease}
@media (hover:hover) and (pointer:fine){
  .pricing-card:hover{transform:translateY(-4px); border-color:var(--gold); box-shadow:0 16px 34px -18px rgba(20,20,20,.22)}
}
.pricing-card-featured{background:var(--ink); border:2px solid var(--gold); position:relative}
.featured-badge{position:absolute; top:-.75rem; left:1.75rem; background:var(--gold); color:#141414; font-size:.75rem; font-weight:700; padding:.25rem .75rem; border-radius:999px}
.price{font-size:1.9rem; font-weight:700}
.price-unit{font-size:1rem; font-weight:400; color:var(--muted)}
.plan-list{display:flex; flex-direction:column; gap:.6rem; color:#3D3C37; font-size:.875rem}
.plan-list-dark{color:#CFCDC5}
.check{color:var(--gold); margin-right:.4rem}
.check-light{color:var(--gold-soft)}

/* faq accordion */
.faq-list{max-width:44rem; margin:0 auto; display:flex; flex-direction:column; gap:.75rem}
.faq-item{background:var(--paper-alt); border:1px solid var(--line); border-radius:12px; overflow:hidden}
.faq-item summary{list-style:none; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.1rem 1.3rem; cursor:pointer; font-weight:600; font-size:.95rem}
.faq-item summary::-webkit-details-marker{display:none}
.faq-chevron{flex-shrink:0; color:var(--gold); transition:transform .25s var(--ease-out)}
.faq-item[open] .faq-chevron{transform:rotate(180deg)}
.faq-body p{padding:0 1.3rem 1.1rem; color:#4B4A45; font-size:.9rem; line-height:1.6}
@media (prefers-reduced-motion: reduce){ .faq-chevron{transition:none} }

/* cta band */
.cta-band{background:var(--paper-alt); border-top:1px solid var(--line); border-bottom:1px solid var(--line)}
.cta-inner{padding-top:4rem; padding-bottom:4rem; text-align:center}
.cta-h2{font-size:1.8rem; line-height:1.25}
@media (min-width:768px){ .cta-h2{font-size:2.3rem} }
.show-mobile-inline{display:none}
@media (max-width:600px){ .show-mobile-inline{display:inline} }

/* footer */
.footer-grid{display:flex; flex-direction:column; align-items:flex-start; gap:1.5rem; padding-top:3rem; padding-bottom:3rem}
@media (min-width:768px){ .footer-grid{flex-direction:row; align-items:center; justify-content:space-between} }
