/* Her Türden — ortak stil */
:root{
  --bg:#0a0c10;
  --bg-elevated:#12151b;
  --bg-card:#151922;
  --border:#232733;
  --border-soft:#1b1f29;
  --text:#f3f4f6;
  --text-muted:#9aa1ad;
  --text-faint:#6b7280;
  --gold:#d9a63c;
  --gold-soft:rgba(217,166,60,.14);
  --c-berber:#d9a63c;
  --c-kuafor:#e85d9c;
  --c-guzellik:#9b5de5;
  --c-studio:#2fcb9e;
  --c-pet:#ef9b3d;
  --radius-lg:20px;
  --radius-md:14px;
  --radius-sm:9px;
  --shadow-card:0 20px 50px rgba(0,0,0,.4);
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--bg);
  color:var(--text);
  font-family:"Inter",-apple-system,Segoe UI,Roboto,sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{
  font-family:"Sora","Inter",sans-serif;
  font-weight:700;
  line-height:1.18;
  margin:0 0 .5em;
  letter-spacing:-.01em;
}
p{margin:0 0 1em; color:var(--text-muted);}
a{color:inherit; text-decoration:none;}
img{max-width:100%;}
.container{max-width:1180px; margin:0 auto; padding:0 24px;}
.eyebrow{
  display:inline-flex; align-items:center; gap:8px;
  font-size:.78rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--gold); background:var(--gold-soft); border:1px solid rgba(217,166,60,.3);
  padding:6px 14px; border-radius:999px; margin-bottom:18px;
}
.btn{
  display:inline-flex; align-items:center; gap:8px;
  padding:13px 26px; border-radius:999px; font-weight:600; font-size:.95rem;
  border:1px solid transparent; cursor:pointer; transition:transform .15s ease, background .15s ease, border-color .15s ease;
}
.btn-primary{background:var(--gold); color:#1a1305;}
.btn-primary:hover{transform:translateY(-2px);}
.btn-ghost{border-color:var(--border); color:var(--text);}
.btn-ghost:hover{border-color:var(--gold); color:var(--gold);}
.btn-sm{padding:9px 18px; font-size:.85rem;}

/* ---------- Header / Nav ---------- */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(10,12,16,.97);
  border-bottom:1px solid var(--border-soft);
}
.header-inner{
  max-width:1180px; margin:0 auto; padding:0 24px;
  display:flex; align-items:center; justify-content:space-between; height:74px;
}
.logo{
  display:flex; align-items:center; gap:10px;
  font-family:"Sora",sans-serif; font-weight:800; font-size:1.05rem; letter-spacing:.03em;
  color:var(--gold);
}
.logo svg{flex:none; display:block;}
.logo span{color:var(--gold);}
.main-nav{display:flex; align-items:center; gap:6px;}
.main-nav > a{
  padding:10px 16px; border-radius:999px; font-weight:600; font-size:.93rem; color:var(--text-muted);
  transition:color .15s ease, background .15s ease;
}
.main-nav > a:hover, .main-nav > a.active{color:var(--text); background:var(--bg-elevated);}
.nav-item{position:relative;}
.nav-item > a{
  display:inline-flex; align-items:center; gap:5px;
  padding:10px 16px; border-radius:999px; font-weight:600; font-size:.93rem; color:var(--text-muted);
  transition:color .15s ease, background .15s ease;
}
.nav-item > a:hover, .nav-item > a.active{color:var(--text); background:var(--bg-elevated);}
.nav-item .caret{font-size:.7rem; transition:transform .15s ease; color:var(--text-faint);}
.nav-item:hover .caret{transform:rotate(180deg);}

.dropdown{
  position:absolute; top:100%; left:50%; transform:translateX(-50%);
  padding-top:14px; width:380px;
  opacity:0; visibility:hidden; pointer-events:none;
  transition:opacity .16s ease, transform .16s ease;
}
.nav-item:hover .dropdown, .nav-item:focus-within .dropdown{
  opacity:1; visibility:visible; pointer-events:auto;
}
.dropdown-inner{
  background:var(--bg-elevated); border:1px solid var(--border); border-radius:16px;
  padding:10px; box-shadow:var(--shadow-card);
}
.dropdown-label{
  font-size:.72rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase;
  color:var(--text-faint); padding:8px 12px 6px;
}
.phase-row{
  display:flex; align-items:center; gap:12px;
  padding:12px; border-radius:12px; transition:background .15s ease;
}
a.phase-row:hover{background:var(--bg-card);}
.phase-num{
  flex:none; width:40px; height:40px; border-radius:11px;
  display:flex; align-items:center; justify-content:center;
  font-family:"Sora",sans-serif; font-weight:800; font-size:.95rem;
  background:var(--gold-soft); color:var(--gold); border:1px solid rgba(217,166,60,.3);
}
.phase-row.soon .phase-num{background:var(--bg-card); color:var(--text-faint); border-color:var(--border);}
.phase-copy{flex:1; min-width:0;}
.phase-name{font-weight:700; font-size:.94rem; color:var(--text); display:flex; align-items:center; gap:8px;}
.phase-row.soon .phase-name{color:var(--text-faint);}
.tag-soon{
  font-size:.65rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  color:var(--text-faint); background:var(--bg-card); border:1px solid var(--border);
  padding:2px 8px; border-radius:999px;
}
.phase-desc{font-size:.8rem; color:var(--text-muted); margin-top:2px;}
.phase-arrow{color:var(--text-faint); font-size:1.1rem;}

.nav-toggle{display:none;}

.header-actions{display:flex; align-items:center; gap:10px; flex:none;}
.panel-link{
  display:inline-flex; align-items:center; gap:7px; flex:none; white-space:nowrap;
  padding:9px 18px; border-radius:999px; font-weight:700; font-size:.85rem;
  background:var(--gold); color:#1a1305;
  transition:transform .15s ease, box-shadow .15s ease;
}
.panel-link:hover{transform:translateY(-2px); box-shadow:0 10px 24px rgba(217,166,60,.28);}
.panel-link .ico{font-size:.9em;}

/* ---------- Hero / Sections ---------- */
.hero{padding:96px 0 72px; text-align:center; position:relative; overflow:hidden; isolation:isolate;}
.hero-video{
  position:absolute; inset:0; width:100%; height:100%;
  object-fit:cover; object-position:72% center; z-index:-2; opacity:.8;
}
@media (max-width:780px){
  .hero-video{opacity:1;}
}
.hero-scrim{
  position:absolute; inset:0; z-index:-1;
  background:
    radial-gradient(60% 55% at 50% 40%, rgba(10,12,16,.55), rgba(10,12,16,.88) 70%),
    linear-gradient(180deg, rgba(10,12,16,.55) 0%, rgba(10,12,16,.75) 60%, var(--bg) 100%);
}
.hero h1{font-size:clamp(2.2rem,5vw,3.6rem); max-width:820px; margin:0 auto .5em;}
.hero .lead{max-width:620px; margin:0 auto 2em; font-size:1.08rem;}
.hero-actions{display:flex; gap:14px; justify-content:center; flex-wrap:wrap;}

section{padding:64px 0;}
.section-head{max-width:640px; margin:0 auto 44px; text-align:center;}
.section-head p{margin:0;}

.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:22px;}
.grid-2{display:grid; grid-template-columns:repeat(2,1fr); gap:22px;}

.card{
  background:var(--bg-card); border:1px solid var(--border); border-radius:var(--radius-lg);
  padding:28px; transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.card:hover{transform:translateY(-5px); border-color:rgba(217,166,60,.4); box-shadow:0 18px 40px rgba(0,0,0,.4);}
.step-num{
  width:38px; height:38px; border-radius:11px; background:var(--gold-soft); color:var(--gold);
  display:flex; align-items:center; justify-content:center; font-family:"Sora",sans-serif; font-weight:800;
  margin-bottom:16px; border:1px solid rgba(217,166,60,.3);
}
.card h3{font-size:1.08rem; margin-bottom:.4em;}
.card p{margin:0; font-size:.92rem;}

.feature-teaser{
  border-radius:var(--radius-lg); border:1px solid var(--border);
  background:linear-gradient(135deg,var(--bg-card),var(--bg-elevated));
  padding:40px; display:flex; align-items:center; gap:36px; flex-wrap:wrap;
}
.feature-teaser .ft-copy{flex:1; min-width:280px;}
.ft-sidebar{
  flex:none; display:flex; flex-direction:column; gap:4px;
  border-right:1px solid var(--border); padding-right:32px; min-width:220px;
}
.ft-nav-item{display:flex; align-items:center; gap:12px; padding:12px 10px; border-radius:12px;}
.ft-nav-item.active{background:var(--gold-soft);}
.ft-nav-dot{flex:none; width:8px; height:8px; border-radius:50%; background:var(--border);}
.ft-nav-item.active .ft-nav-dot{background:var(--gold);}
.ft-nav-title{font-weight:700; font-size:.94rem; color:var(--text);}
.ft-nav-item.soon .ft-nav-title{color:var(--text-faint);}
.ft-nav-sub{font-size:.76rem; color:var(--text-faint); margin-top:1px;}
.ft-nav-item.active .ft-nav-sub{color:var(--gold);}
@media (max-width:780px){
  .ft-sidebar{border-right:none; border-bottom:1px solid var(--border); padding-right:0; padding-bottom:16px; width:100%;}
}
.chip-row{display:flex; flex-wrap:wrap; gap:8px; margin:16px 0 22px;}
.chip{
  font-size:.8rem; font-weight:600; padding:6px 13px; border-radius:999px;
  background:var(--bg); border:1px solid var(--border); color:var(--text-muted);
  display:inline-flex; align-items:center; gap:6px;
}
.chip .dot{width:7px;height:7px;border-radius:50%;}

footer{border-top:1px solid var(--border-soft); padding:40px 0; margin-top:40px;}
.footer-inner{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:16px;}
.footer-inner p{margin:0; font-size:.85rem; color:var(--text-faint);}
.footer-links{display:flex; gap:22px; font-size:.85rem; color:var(--text-muted);}
.footer-links a:hover{color:var(--gold);}

/* ---------- Breadcrumb ---------- */
.breadcrumb{
  padding:22px 0 0; font-size:.85rem; color:var(--text-faint);
}
.breadcrumb a{color:var(--text-muted);}
.breadcrumb a:hover{color:var(--gold);}

/* ---------- Phase roadmap (hizmet.html) ---------- */
.roadmap{display:flex; flex-direction:column; gap:18px; max-width:880px; margin:0 auto;}
.roadmap-item{
  display:flex; gap:24px; padding:30px; border-radius:var(--radius-lg);
  border:1px solid var(--border); background:var(--bg-card); align-items:flex-start; flex-wrap:wrap;
  transition:transform .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.roadmap-item.is-active{border-color:rgba(217,166,60,.4); background:linear-gradient(135deg,var(--bg-card),rgba(217,166,60,.06));}
.roadmap-item.is-soon{opacity:.62;}
.roadmap-item.is-active:hover{transform:translateY(-4px); border-color:var(--gold); box-shadow:0 20px 46px rgba(0,0,0,.42);}
.roadmap-badge{
  flex:none; width:64px; height:64px; border-radius:16px;
  display:flex; align-items:center; justify-content:center; text-align:center;
  font-family:"Sora",sans-serif; font-weight:800; font-size:.85rem; line-height:1.15;
  background:var(--gold-soft); color:var(--gold); border:1px solid rgba(217,166,60,.35);
}
.roadmap-item.is-soon .roadmap-badge{background:var(--bg-elevated); color:var(--text-faint); border-color:var(--border);}
.roadmap-body{flex:1; min-width:240px;}
.roadmap-body h3{font-size:1.25rem; margin-bottom:.3em; display:flex; align-items:center; gap:10px;}
.status-pill{
  font-size:.68rem; font-weight:700; letter-spacing:.04em; text-transform:uppercase;
  padding:3px 10px; border-radius:999px;
}
.status-pill.live{background:rgba(90,200,120,.14); color:#5ac878; border:1px solid rgba(90,200,120,.35);}
.status-pill.soon{background:var(--bg-elevated); color:var(--text-faint); border:1px solid var(--border);}
.roadmap-body p{margin:0 0 14px; font-size:.92rem;}

/* ---------- Sector cards (faz1-guzellik.html) ---------- */
.sector-card{
  border:1px solid var(--border); background:var(--bg-card); border-radius:var(--radius-lg);
  padding:32px; margin-bottom:28px;
  transition:transform .3s ease, border-color .3s ease, box-shadow .3s ease;
}
.sector-card:hover{
  transform:translateY(-6px);
  border-color:var(--accent,var(--gold));
  box-shadow:0 26px 60px rgba(0,0,0,.5);
}
.sector-icon{transition:transform .3s ease;}
.sector-card:hover .sector-icon{transform:scale(1.08) rotate(-4deg);}
.sector-head{display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-bottom:18px;}
.sector-icon{
  width:52px; height:52px; border-radius:14px; display:flex; align-items:center; justify-content:center;
  font-family:"Sora",sans-serif; font-weight:800; font-size:1.3rem; color:#0a0c10; flex:none;
}
.sector-title{flex:1; min-width:200px;}
.sector-title h3{font-size:1.35rem; margin-bottom:2px; display:flex; align-items:center; gap:10px;}
.sector-domain{font-size:.85rem; color:var(--text-faint); font-family:monospace;}
.sector-body{display:grid; grid-template-columns:1fr 1.15fr; gap:30px; align-items:start;}
.sector-desc p{font-size:.94rem;}
.sector-feats{list-style:none; margin:0 0 20px; padding:0; display:flex; flex-direction:column; gap:9px;}
.sector-feats li{font-size:.87rem; color:var(--text-muted); display:flex; gap:9px;}
.sector-feats li::before{content:"✓"; color:var(--accent,var(--gold)); font-weight:700; flex:none;}
.sector-price{font-size:.86rem; color:var(--text); background:var(--bg-elevated); border:1px solid var(--border); padding:12px 14px; border-radius:12px; margin-bottom:18px;}
.sector-price b{color:var(--accent,var(--gold)); font-size:1.05rem;}
.sector-actions{display:flex; gap:10px; flex-wrap:wrap;}

/* device posters */
.poster-row{display:grid; grid-template-columns:1.5fr 1fr 0.72fr; gap:16px; align-items:end;}
.frame{background:#0d0f14; border:1px solid var(--border); border-radius:14px; overflow:hidden; box-shadow:0 16px 34px rgba(0,0,0,.4); transition:transform .35s ease, box-shadow .35s ease;}
.frame img{transition:transform .5s ease;}
.sector-card:hover .frame{box-shadow:0 20px 44px rgba(0,0,0,.55);}
.sector-card:hover .frame-browser{transform:translateY(-3px);}
.sector-card:hover .frame-tablet{transform:translateY(-8px);}
.sector-card:hover .frame-phone{transform:translateY(-14px);}
.sector-card:hover .frame img{transform:scale(1.06);}
.frame-browser .frame-bar{display:flex; gap:6px; padding:9px 12px; background:#1a1e27;}
.frame-browser .frame-bar span{width:8px;height:8px;border-radius:50%; background:#3a3f4b;}
.frame-browser img{display:block; width:100%; height:178px; object-fit:cover; object-position:top;}
.frame-tablet{border:7px solid #1a1e27; border-radius:20px;}
.frame-tablet img{display:block; width:100%; height:214px; object-fit:cover; object-position:top;}
.frame-phone{border:7px solid #1a1e27; border-radius:26px; max-width:128px; margin-left:auto;}
.frame-phone .notch{height:16px; display:flex; justify-content:center; align-items:center; background:#1a1e27;}
.frame-phone .notch::before{content:""; width:42px; height:5px; border-radius:4px; background:#0d0f14;}
.frame-phone img{display:block; width:100%; height:238px; object-fit:cover; object-position:top;}
.poster-caption{display:flex; justify-content:space-between; margin-top:8px; font-size:.7rem; color:var(--text-faint); text-transform:uppercase; letter-spacing:.05em;}

.mode-toggle{
  display:flex; justify-content:center; gap:8px; margin:0 0 32px;
}
.mode-btn{
  padding:11px 26px; border-radius:999px; font-weight:700; font-size:.9rem;
  border:1px solid var(--border); background:var(--bg-card); color:var(--text-muted);
  cursor:pointer; transition:all .2s ease;
}
.mode-btn.active{background:var(--gold); color:#1a1305; border-color:var(--gold);}
.mode-btn:not(.active):hover{border-color:var(--gold); color:var(--gold);}
.soon-panel{
  max-width:560px; margin:0 auto; text-align:center; padding:60px 30px;
  border:1px dashed var(--border); border-radius:var(--radius-lg); background:var(--bg-card);
}
.soon-panel .eyebrow{margin-bottom:16px;}
.soon-panel h3{font-size:1.3rem; margin-bottom:10px;}

.shared-note{
  max-width:760px; margin:0 auto 40px; text-align:center; font-size:.92rem; color:var(--text-muted);
  padding:16px 22px; border:1px solid var(--border); border-radius:14px; background:var(--bg-card);
}

/* ---------- Scroll-reveal (dokunmatik/mobilde hover yerine) ---------- */
.card,.sector-card,.roadmap-item,.role-card,.founder-card{
  opacity:0; transform:translateY(20px);
  transition:opacity .55s ease, transform .55s ease, border-color .3s ease, box-shadow .3s ease, transform .3s ease;
}
.card.in-view,.sector-card.in-view,.roadmap-item.in-view,.role-card.in-view,.founder-card.in-view{
  opacity:1; transform:translateY(0);
}
@media (prefers-reduced-motion: reduce){
  .card,.sector-card,.roadmap-item,.role-card,.founder-card{opacity:1; transform:none; transition:none;}
}

/* ---------- Responsive ---------- */
@media (max-width:900px){
  .grid-3{grid-template-columns:1fr 1fr;}
  .sector-body{grid-template-columns:1fr;}
  .poster-row{grid-template-columns:1fr 1fr; }
  .frame-phone{grid-column:span 2; max-width:180px; margin:0 auto;}
}
@media (max-width:780px){
  .main-nav{position:fixed; top:74px; left:0; right:0; bottom:0; background:var(--bg);
    flex-direction:column; align-items:stretch; padding:18px; gap:4px; overflow-y:auto;
    transform:translateY(-8px); opacity:0; visibility:hidden; pointer-events:none; transition:opacity .18s ease, transform .18s ease;}
  .main-nav.open{opacity:1; visibility:visible; pointer-events:auto; transform:translateY(0);}
  .main-nav > a, .nav-item > a{width:100%; padding:14px 12px;}
  .nav-item > a{justify-content:space-between;}
  .dropdown{
    position:static; transform:none; opacity:1; visibility:visible; pointer-events:none;
    width:100%; padding-top:0; max-height:0; overflow:hidden;
    transition:max-height .22s ease;
  }
  .nav-item.open .dropdown{max-height:260px; pointer-events:auto; padding:4px 0 8px;}
  .nav-item.open .caret{transform:rotate(180deg);}
  .nav-toggle{
    display:flex; align-items:center; justify-content:center; width:42px; height:42px;
    border-radius:10px; border:1px solid var(--border); background:var(--bg-card); color:var(--text);
    font-size:1.1rem; cursor:pointer;
  }
  .grid-3, .grid-2{grid-template-columns:1fr;}
  .feature-teaser{padding:26px;}
  .hero{padding:56px 0 48px;}
  section{padding:44px 0;}
  .header-inner{gap:8px;}
  .logo{font-size:.8rem; gap:6px;}
  .logo svg{width:26px; height:26px;}
  .logo span{display:none;}
  .panel-link{padding:8px 12px; font-size:.76rem;}
  .header-actions{gap:6px;}
}
@media (max-width:520px){
  .poster-row{grid-template-columns:1fr;}
  .frame-phone{grid-column:auto; margin:0 auto;}
  .frame-browser img{height:150px;}
}