/* alpersamur.com.tr: kişisel site (ASoftware v3 ile aynı tasarım dili) */
:root{
  --bg:#0b0c10; --bg2:#12131a; --bg3:#181a22; --line:rgba(226,232,255,.09); --line2:rgba(226,232,255,.18);
  --tx:#eef0f6; --mu:#a3a7b6; --di:#6c7080; --ac:#6b8cff; --ac2:#38c6f4;
  --acg:linear-gradient(100deg,#7a7cff 0%,#4f9dff 55%,#38c6f4 100%);
  --serif:'Instrument Serif',Georgia,serif; --sans:'Geist',system-ui,-apple-system,'Segoe UI',sans-serif; --mono:'Geist Mono',ui-monospace,Consolas,monospace;
  --head:80px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--bg);scroll-behavior:smooth;scroll-padding-top:var(--head);scroll-snap-type:y proximity}
body{background:var(--bg);color:var(--tx);font:16.5px/1.6 var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:100;opacity:.05;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.w{max-width:1200px;margin:0 auto;padding:0 32px}
.mono{font-family:var(--mono);font-size:13px;letter-spacing:.02em;color:var(--di)}
.gt{background:var(--acg);-webkit-background-clip:text;background-clip:text;color:transparent;padding-right:.06em;margin-right:-.06em}
.logo-badge{display:inline-flex;align-items:center;justify-content:center;border-radius:50%;background:#000;border:1px solid rgba(255,255,255,.14);overflow:hidden;flex:none}
.logo-badge img{width:74%;height:74%;object-fit:contain}
.pill{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 18px;border:1px solid var(--line2);border-radius:999px;font-size:15px;font-weight:500;white-space:nowrap;transition:border-color .2s,transform .2s}
.pill:hover{border-color:rgba(143,176,255,.6)}
.pill.solid{background:var(--acg);border-color:transparent;color:#fff;font-weight:600}
.pill.solid:hover{transform:translateY(-1px)}
.wordmark{font:700 16px/1 var(--sans);letter-spacing:-.03em;color:#fff}
.sv{font-family:'Manrope',var(--sans);font-weight:800;font-style:normal;letter-spacing:-.03em;color:#fff;white-space:nowrap;-webkit-text-fill-color:#fff}
.sv .eo{color:#6c5ce7;-webkit-text-fill-color:#6c5ce7}
.lane .sv{font-size:.92em}

/* üst menü */
.top{position:sticky;top:0;z-index:50;background:rgba(11,12,16,.82);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.top .w{display:flex;align-items:center;height:var(--head);gap:36px}
.top .name{font-family:var(--serif);font-size:28px}
.top nav{display:flex;gap:28px;font-size:15px;color:var(--mu);margin-left:auto}
.top nav a:hover{color:var(--tx)}
.top .pill{height:40px;font-size:14.5px}

/* hero: ekran yüksekliğine tam sığar */
.hero{--hh:calc(100svh - var(--head));height:var(--hh);min-height:560px;max-height:1000px;display:flex;align-items:center;scroll-snap-align:start;position:relative}
.hero .w{width:100%;display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:56px;align-items:center}
.kick{font-family:var(--mono);font-size:13px;color:var(--mu)}
.hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(72px,min(19vh,12vw),176px);line-height:.84;letter-spacing:-.03em;margin-top:clamp(12px,2.2vh,22px)}
.hero h1 em{font-style:italic;display:block;padding-left:.5em}
.hero p{margin-top:clamp(16px,3.4vh,34px);font-size:clamp(16.5px,2.5vh,20px);color:var(--mu);max-width:540px}
.hero p b{color:var(--tx);font-weight:500}
.hero .links{display:flex;flex-wrap:wrap;gap:10px;margin-top:clamp(18px,3.2vh,32px)}
.portrait{position:relative;justify-self:center;height:min(calc(var(--hh) - 80px),640px);max-width:100%;aspect-ratio:4/5}
.portrait .img{position:absolute;inset:0;border-radius:28px;overflow:hidden;border:1px solid var(--line2);background:linear-gradient(180deg,#151824,#0f111a)}
.portrait .img img{position:absolute;left:50%;bottom:0;transform:translateX(-50%);height:94%;width:auto;max-width:none;display:block}
.now{position:absolute;left:-44px;bottom:36px;background:var(--bg2);border:1px solid var(--line2);border-radius:20px;padding:16px 20px;max-width:320px;box-shadow:0 24px 60px rgba(0,0,0,.5)}
.now .mono{display:flex;align-items:center;gap:8px;color:var(--mu)}
.now .mono > i{width:7px;height:7px;border-radius:50%;background:#3ddc84;box-shadow:0 0 0 3px rgba(61,220,132,.18)}
.now b{display:block;font-weight:500;font-size:15.5px;margin-top:6px;line-height:1.4}
.now > span{display:block;font-size:14px;color:var(--mu);margin-top:4px}
.sig{position:absolute;right:-22px;top:-22px;width:clamp(84px,14vh,118px);height:clamp(84px,14vh,118px);box-shadow:0 18px 40px rgba(0,0,0,.5)}
.scroll-hint{position:absolute;left:50%;bottom:12px;transform:translateX(-50%);font-family:var(--mono);font-size:12px;color:var(--di);display:flex;flex-direction:column;align-items:center;gap:6px}
.scroll-hint i{width:1px;height:24px;background:linear-gradient(var(--line2),transparent);animation:hint 2.2s ease-in-out infinite}
@keyframes hint{0%,100%{transform:scaleY(.4);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}}

/* şerit */
.ticker{border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;padding:22px 0}
.lane{display:flex;width:max-content;animation:slide 40s linear infinite}
.lane > span{font-family:var(--serif);font-size:50px;line-height:1;padding:0 26px;white-space:nowrap}
.lane > span:nth-child(4n+3){font-style:italic;color:#8fb0ff}
.lane b{font-family:var(--sans);color:var(--di);font-weight:400;font-size:28px;align-self:center}
@keyframes slide{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.lane,.scroll-hint i{animation:none!important}}

section{scroll-snap-align:start}
.sh{display:flex;justify-content:space-between;align-items:end;padding:110px 0 40px;gap:30px}
.sh h2{font-family:var(--serif);font-weight:400;font-size:72px;line-height:.95;letter-spacing:-.015em}
.sh h2 em{font-style:italic}
.sh p{color:var(--mu);max-width:380px}

/* işler */
.works{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
.work{background:var(--bg2);border:1px solid var(--line);border-radius:22px;overflow:hidden;display:flex;flex-direction:column;transition:border-color .2s,transform .2s}
.work:hover{border-color:rgba(143,176,255,.45);transform:translateY(-2px)}
.work .v{height:210px;position:relative;overflow:hidden;border-bottom:1px solid var(--line);background:#10121a}
.work .v img.ss{position:absolute;left:24px;top:24px;width:calc(100% - 24px);border-radius:8px 0 0 0;border:1px solid var(--line2)}
.work .b{padding:20px 22px 22px}
.work .meta{display:flex;justify-content:space-between;gap:10px}
.work h3{font-size:19px;font-weight:600;letter-spacing:-.01em;margin-top:8px}
.work p{font-size:14.5px;color:var(--mu);margin-top:4px}
.work.big{grid-column:span 2}
.work.big .v{height:300px}
.v-ask{background:linear-gradient(#17233b,#101a2c)!important;display:flex;align-items:center;justify-content:center}
.v-ask img{width:120px}
.v-code pre{position:absolute;left:24px;top:24px;right:0;bottom:0;font:13.5px/1.75 var(--mono);color:#d8dcef;background:#141621;border:1px solid var(--line2);border-right:0;border-bottom:0;border-radius:8px 0 0 0;padding:18px 20px;white-space:pre}
.v-code .k{color:#8fb0ff}.v-code .s{color:#7fe0c8}.v-code .f{color:#c3ccff}
.allp{display:flex;justify-content:flex-end;margin-top:24px}

/* hikâye */
.story{display:grid;grid-template-columns:200px minmax(0,1fr);gap:40px}
.story .step{display:contents}
.story .lbl{font-family:var(--mono);font-size:13px;color:var(--ac2);padding-top:14px;border-top:1px solid var(--line2)}
.story p{font-family:var(--serif);font-size:38px;line-height:1.18;padding:8px 0 34px;border-top:1px solid var(--line2)}
.story p i{color:var(--mu)}

/* eğitim */
.edu{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.edu > div{background:var(--bg2);border:1px solid var(--line);border-radius:22px;padding:28px 30px}
.edu h3{font-family:var(--mono);font-weight:400;font-size:13px;color:var(--di);margin-bottom:12px}
.edu .it{display:flex;justify-content:space-between;gap:20px;padding:14px 0;border-top:1px solid var(--line)}
.edu .it b{font-weight:500}
.edu .it span{color:var(--mu);font-size:14.5px;white-space:nowrap}
.edu a.it:hover span{color:#8fb0ff}

/* iletişim */
.contact{padding:130px 0 110px;text-align:center}
.contact h2{font-family:var(--serif);font-weight:400;font-size:190px;line-height:.85;letter-spacing:-.03em}
.contact h2 em{font-style:italic}
.contact .mail{display:inline-block;margin-top:36px;font-size:30px;border-bottom:2px solid #6b8cff;padding-bottom:6px}
.contact .row{display:flex;justify-content:center;gap:10px;margin-top:30px;flex-wrap:wrap}
footer .w{display:flex;justify-content:space-between;padding-top:26px;padding-bottom:40px;border-top:1px solid var(--line)}

@media (max-width:980px){
  .hero .w{gap:32px}
  .now{left:-20px}
}
@media (max-width:920px){
  .top nav{display:none}
  .top .pill{margin-left:auto}
  .hero .w{grid-template-columns:minmax(0,1fr) minmax(0,.85fr);gap:28px}
  .portrait{height:auto;width:100%}
  .sig{right:-10px;top:-14px;width:80px;height:80px}
  .now{left:-16px;right:12px;max-width:none}
  .works{grid-template-columns:repeat(2,minmax(0,1fr))}
  .story{grid-template-columns:140px minmax(0,1fr);gap:24px}
  .story p{font-size:32px}
  .edu .it{flex-direction:column;gap:2px}
  .edu .it span{white-space:normal}
  .contact h2{font-size:140px}
}
@media (max-width:760px){
  :root{--head:68px}
  html{scroll-snap-type:none}
  .w{padding:0 20px}
  .top nav{display:none}
  .top .pill{margin-left:auto}
  .hero{height:auto;min-height:0;max-height:none;padding:28px 0 56px}
  .hero .w{grid-template-columns:minmax(0,1fr);gap:40px}
  .hero h1{font-size:96px}
  .hero p{font-size:17.5px}
  .portrait{height:auto;width:100%;max-width:420px}
  .now{left:12px;right:12px;bottom:12px;max-width:none}
  .sig{right:-6px;top:-18px;width:84px;height:84px}
  .scroll-hint{display:none}
  .lane > span{font-size:34px}
  .sh{flex-direction:column;align-items:start;padding:72px 0 28px}
  .sh h2{font-size:50px}
  .works{grid-template-columns:minmax(0,1fr)}
  .work.big{grid-column:auto}
  .work.big .v,.work .v{height:200px}
  .story{grid-template-columns:minmax(0,1fr);gap:0}
  .story .lbl{border-top:1px solid var(--line2);padding-top:12px}
  .story p{font-size:27px;border-top:0;padding-top:6px}
  .edu{grid-template-columns:minmax(0,1fr)}
  .edu .it{flex-direction:column;gap:2px}
  .contact h2{font-size:96px}
  .contact .mail{font-size:20px}
  footer .w{flex-direction:column;gap:6px}
}

@media (max-width:760px){
  .top .name{font-size:24px}
  .top .pill{height:40px;padding:0 14px}
  .hero h1{font-size:clamp(64px,22vw,96px)}
  .works{grid-template-columns:minmax(0,1fr)}
  .work .meta{flex-wrap:wrap}
  .lane > span{font-size:30px;padding:0 18px}
  .lane b{font-size:20px}
  .edu a.it{padding:14px 0}
  .contact{padding:90px 0 80px}
  .contact h2{font-size:clamp(64px,22vw,96px)}
  .contact .row .pill{height:46px}
  footer .w{padding-bottom:30px}
  footer a{display:inline-block;padding:6px 0}
}
@media (max-width:380px){
  .story p{font-size:24px}
  .sh h2{font-size:42px}
  .hero .links .pill{padding:0 14px}
}

/* LIMINAL kartı ve "tüm projeler" hücresi */
.v-lim{background:#f9f7f2!important}
.v-lim img{width:100%;height:100%;object-fit:contain;display:block}
@media (max-width:760px){.v-lim img{object-fit:cover;object-position:left center}}
.work.more{justify-content:flex-end;padding:28px 26px;min-height:260px;background:linear-gradient(160deg,#151a2e,#10121a);position:relative}
.work.more h3{font-family:var(--serif);font-weight:400;font-size:48px;line-height:1;margin-top:auto}
.work.more h3 em{font-style:italic}
.work.more p{margin-top:10px}
.work.more .go{position:absolute;right:24px;top:22px;font-size:26px;color:#8fb0ff}

/* ASoftware iOS kartı */
.v-ios{background:#0a0c14!important}
.v-ios img{width:100%;height:100%;object-fit:cover;display:block}