/* Thyra Creative · thyracreative.com */

@font-face{font-family:"Archivo";src:url(/yazi/archivo-800.woff2) format("woff2");font-weight:800;font-display:swap}
@font-face{font-family:"Hanken";src:url(/yazi/hanken.woff2) format("woff2");font-weight:400 700;font-display:swap}

:root{
  --zemin:#0D0F14;
  --yuzey:#14171F;
  --yuzey-2:#1B1F29;
  --cizgi:#262B37;
  --yazi:#F2F3F5;
  --yazi-2:#A8AEBA;
  --yazi-3:#868D9B;
  --turuncu:#FF5000;
  --turuncu-2:#FF6A26;
  --acik:#F3F4F6;
  --acik-yazi:#12141A;
  --acik-yazi-2:#4A505E;
  --acik-cizgi:#DDE0E6;
  --baslik:"Archivo","Arial Black",system-ui,sans-serif;
  --govde:"Hanken",system-ui,-apple-system,"Segoe UI",sans-serif;
  --kenar:clamp(20px,5vw,48px);
  --bolum:clamp(80px,11vw,144px);
  --egri:cubic-bezier(.2,.7,.2,1);
  --ok:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 11 11 5M6 5h5v5'/%3E%3C/svg%3E");
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--zemin);color:var(--yazi);font:400 17px/1.6 var(--govde);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
h1,h2,h3,p,ul,ol,dl,dd,figure,table{margin:0}
ul,ol{padding:0;list-style:none}
h1,h2{font-family:var(--baslik);font-weight:800;letter-spacing:-.02em;line-height:1.04;text-wrap:balance}
h2{font-size:clamp(32px,4.4vw,56px)}
h3{font-size:20px;font-weight:700;line-height:1.3;letter-spacing:-.005em}
p{text-wrap:pretty}
::selection{background:var(--turuncu);color:#0D0F14}

.kap{width:100%;max-width:1240px;margin-inline:auto;padding-left:max(var(--kenar),env(safe-area-inset-left));padding-right:max(var(--kenar),env(safe-area-inset-right))}
.kap>*{min-width:0}
.gizli-metin{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.atla{position:absolute;left:12px;top:-60px;z-index:100;background:var(--yazi);color:var(--zemin);padding:10px 14px;border-radius:8px;font-weight:600;text-decoration:none}
.atla:focus{top:12px}
:focus-visible{outline:2px solid var(--turuncu);outline-offset:3px;border-radius:6px}

/* düğmeler */
.dugmeler{display:flex;flex-wrap:wrap;gap:12px}
.dugme{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:13px 22px;border-radius:12px;font:600 16px/1.2 var(--govde);text-align:center;text-decoration:none;white-space:nowrap;transition:background-color .2s var(--egri),border-color .2s var(--egri),color .2s var(--egri),transform .2s var(--egri)}
.dugme:active{transform:translateY(1px)}
.dugme-turuncu{background:var(--turuncu);color:#0D0F14}
.dugme-turuncu:hover{background:var(--turuncu-2)}
.dugme-cizgi{border:1px solid #3A4050;color:var(--yazi)}
.dugme-cizgi:hover{border-color:var(--yazi-2);background:rgba(255,255,255,.04)}
.dugme-koyu{background:#0D0F14;color:#fff}
.dugme-koyu:hover{background:#262B37}
.dugme-koyu-cizgi{border:1.5px solid rgba(13,15,20,.55);color:#0D0F14}
.dugme-koyu-cizgi:hover{border-color:#0D0F14;background:rgba(13,15,20,.06)}

/* üst */
.ust{position:sticky;top:0;z-index:50;background:rgba(13,15,20,.86);-webkit-backdrop-filter:saturate(140%) blur(12px);backdrop-filter:saturate(140%) blur(12px);border-bottom:1px solid rgba(38,43,55,.6)}
.ust-ic{display:flex;align-items:center;gap:32px;min-height:72px}
.logo{display:block;flex:none}
.logo img{width:150px;height:auto}
.menu{display:flex;gap:28px;margin-left:auto}
.menu a{font-size:15px;font-weight:500;color:var(--yazi-2);text-decoration:none;padding:6px 0;transition:color .2s}
.menu a:hover{color:var(--yazi)}
.ust-wa{min-height:42px;padding:9px 16px;font-size:15px}

/* giriş */
.giris{padding-top:clamp(32px,5vw,64px);overflow:hidden}
.giris-ic{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(24px,4vw,56px);align-items:start}
.giris h1{font-size:clamp(40px,5vw,72px)}
.nokta{display:inline-block;width:.2em;height:.2em;margin-left:.06em;border-radius:50%;background:var(--turuncu);vertical-align:.08em}
.giris-alt{margin-top:24px;max-width:34em;font-size:clamp(17px,1.5vw,19px);color:var(--yazi-2)}
.giris .dugmeler{margin-top:32px}

.yelpaze{position:relative;height:min(clamp(400px,42vw,540px),calc(100svh - 150px));min-height:380px}
.reel{position:absolute;top:50%;left:50%;display:block;width:clamp(150px,min(16vw,calc((100svh - 240px)*.5)),232px);aspect-ratio:9/16;border-radius:20px;overflow:hidden;background:var(--yuzey-2);box-shadow:0 40px 80px -30px rgba(0,0,0,.7),0 0 0 1px rgba(255,255,255,.06);text-decoration:none;transition:transform .5s var(--egri)}
.reel img{width:100%;height:100%;object-fit:cover}
.reel::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 62%,rgba(8,9,12,.8));pointer-events:none}
.reel-ad{position:absolute;left:14px;right:14px;bottom:13px;z-index:1;font-size:13px;font-weight:600;color:#fff}
.y1{transform:translate(-122%,-46%) rotate(-6deg)}
.y2{z-index:2;width:clamp(170px,min(18vw,calc((100svh - 220px)*.56)),262px);transform:translate(-50%,-52%)}
.y3{transform:translate(22%,-44%) rotate(6deg)}
.y3 .reel-ad{text-align:right}
.y1:hover{transform:translate(-124%,-49%) rotate(-7deg)}
.y2:hover{transform:translate(-50%,-55%)}
.y3:hover{transform:translate(24%,-47%) rotate(7deg)}

@media (prefers-reduced-motion:no-preference){
  .y1{animation:ac-sol .9s var(--egri) .15s backwards}
  .y2{animation:ac-orta .9s var(--egri) backwards}
  .y3{animation:ac-sag .9s var(--egri) .15s backwards}
  @keyframes ac-sol{from{transform:translate(-50%,-48%) rotate(0);opacity:0}}
  @keyframes ac-orta{from{transform:translate(-50%,-44%);opacity:0}}
  @keyframes ac-sag{from{transform:translate(-50%,-48%) rotate(0);opacity:0}}
  .nokta{animation:nokta 1s var(--egri) .4s backwards}
  @keyframes nokta{0%{transform:scale(0)}60%{transform:scale(1.35)}100%{transform:scale(1)}}
}


/* bölümler */
.bolum{padding-block:var(--bolum)}
.bolum-bas{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px 48px;align-items:end;margin-bottom:clamp(36px,5vw,56px)}
.bolum-bas>p{color:var(--yazi-2);max-width:34em;justify-self:end}
.etiket{font-size:14px;font-weight:600;color:var(--turuncu);margin-bottom:16px}

/* işler */
.isler{padding-top:clamp(64px,8vw,104px)}
.izgara{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.kart{position:relative;display:block;aspect-ratio:9/16;border-radius:18px;overflow:hidden;background:var(--yuzey-2);text-decoration:none;box-shadow:0 0 0 1px rgba(255,255,255,.05)}
.kart img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--egri)}
.kart::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,9,12,0) 52%,rgba(8,9,12,.88));pointer-events:none}
.kart-alt{position:absolute;left:16px;right:58px;bottom:15px;z-index:1;display:grid;gap:2px}
.kart-alt strong{font-size:15px;line-height:1.3;color:#fff}
.kart-alt span{font-size:13px;color:#C3C7CF}
.kart-git{position:absolute;right:14px;bottom:16px;z-index:1;width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.14) var(--ok) center/16px no-repeat;transition:background-color .25s var(--egri)}
.kart:hover img{transform:scale(1.04)}
.kart:hover .kart-git,.kart:focus-visible .kart-git{background-color:var(--turuncu)}

.musteri-bolum{padding-top:clamp(24px,4vw,56px);padding-bottom:clamp(24px,4vw,56px)}
.musteri-liste{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0 32px}
.musteri-liste li{padding-block:14px;border-top:1px solid var(--cizgi);font-size:17px;font-weight:600;color:#DADDE3}

/* hizmetler */
.hizmetler{padding-top:clamp(24px,4vw,56px)}
.hizmet-liste{margin-top:clamp(32px,4vw,48px);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.hizmet-liste li{background:var(--yuzey);border:1px solid var(--cizgi);border-radius:18px;padding:28px 26px 30px}
.hizmet-liste h3{font-family:var(--baslik);font-weight:800;font-size:21px;line-height:1.15;letter-spacing:-.01em}
.hizmet-liste p{margin-top:12px;color:var(--yazi-2);font-size:16px}

/* vaka */
.vaka{background:var(--yuzey);border-block:1px solid var(--cizgi)}
.vaka-bas{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:24px 64px;align-items:end}
.vaka-bas h2{max-width:13em}
.vaka-bas>p{color:var(--yazi-2);max-width:30em}
.rakamlar{margin-top:clamp(48px,6vw,80px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.rakamlar>div{display:flex;flex-direction:column-reverse;gap:8px;padding-top:24px;border-top:2px solid var(--turuncu)}
.rakamlar dd{font-family:var(--baslik);font-weight:800;font-size:clamp(40px,4.6vw,66px);line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums;white-space:nowrap}
.rakamlar dt{font-size:16px;color:var(--yazi-2)}
.vaka-not{margin-top:clamp(36px,4vw,48px);max-width:46em;font-size:15px;color:var(--yazi-3)}

/* açık bölümler */
.acik{background:var(--acik);color:var(--acik-yazi)}
.acik .bolum-bas>p,.acik p{color:var(--acik-yazi-2)}
.paketler{padding-bottom:clamp(56px,7vw,88px)}
.paket-giris{justify-self:end;max-width:34em;display:grid;gap:20px;justify-items:start}
.tablo-kap{overflow-x:auto;background:#fff;border:1px solid var(--acik-cizgi);border-radius:20px}
.paket-tablo{width:100%;border-collapse:collapse;table-layout:fixed;font-size:17px}
.paket-tablo th,.paket-tablo td{padding:18px 28px;text-align:left;border-top:1px solid var(--acik-cizgi);vertical-align:top}
.paket-tablo thead th,.paket-tablo thead td{border-top:0;padding-top:26px;padding-bottom:20px}
.paket-tablo thead th{font-family:var(--baslik);font-weight:800;font-size:26px;letter-spacing:-.02em;width:36%}
.paket-tablo tbody th{font-weight:500;color:var(--acik-yazi-2);width:28%}
.paket-tablo tbody td{font-weight:600}
.kosullar{margin-top:24px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px 32px}
.kosullar li{font-size:16px;color:var(--acik-yazi-2)}
.kosullar strong{display:block;margin-bottom:4px;color:var(--acik-yazi);font-weight:700}

.surec{padding-top:clamp(56px,7vw,88px);border-top:1px solid var(--acik-cizgi)}
.adimlar{margin-top:clamp(32px,4vw,48px);display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:20px}
.adimlar li{padding-top:20px;border-top:2px solid var(--acik-yazi)}
.adim-no{display:block;font-family:var(--baslik);font-weight:800;font-size:15px;color:#C23D00;margin-bottom:14px}
.adimlar p{margin-top:8px;font-size:16px}

/* ekip */
.ekip-bas{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:16px 48px}
.ekip-bas p{color:var(--yazi-2);font-size:clamp(17px,1.5vw,19px)}
.kisiler{margin-top:clamp(32px,4vw,48px);display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.kisiler li{display:grid;gap:10px;align-content:start;padding:28px 26px 30px;border-radius:18px;background:var(--yuzey);border:1px solid var(--cizgi)}
.kisiler strong{font-family:var(--baslik);font-weight:800;font-size:clamp(26px,2.6vw,34px);line-height:1;letter-spacing:-.02em}
.kisiler span{color:var(--yazi-2);font-size:16px}

/* sorular */
.sorular{padding-top:0}
.sorular-ic{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(32px,6vw,96px);align-items:start}
.sss details{border-top:1px solid var(--cizgi)}
.sss details:last-child{border-bottom:1px solid var(--cizgi)}
.sss summary{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:22px 0;font-size:18px;font-weight:600;cursor:pointer;list-style:none}
.sss summary::-webkit-details-marker{display:none}
.sss summary::after{content:"";flex:none;width:12px;height:12px;margin-right:4px;border-right:2px solid var(--yazi-2);border-bottom:2px solid var(--yazi-2);transform:translateY(-3px) rotate(45deg);transition:transform .25s var(--egri)}
.sss details[open] summary::after{transform:translateY(3px) rotate(-135deg)}
.sss summary:hover{color:#fff}
.sss details p{padding-bottom:22px;color:var(--yazi-2);max-width:36em}

/* son çağrı */
.son{position:relative;overflow:hidden;background:var(--turuncu);color:#0D0F14;padding-block:clamp(72px,9vw,120px)}
.son::after{content:"";position:absolute;top:50%;right:clamp(-40px,2vw,40px);width:min(34vw,480px);height:340px;transform:translateY(-50%);background-image:radial-gradient(circle,rgba(13,15,20,.2) 3.5px,transparent 4.5px);background-size:30px 30px;pointer-events:none}
.son-ic{position:relative;z-index:1}
.son h2{font-size:clamp(36px,5.4vw,72px);max-width:12em}
.son p{margin-top:20px;font-size:clamp(17px,1.5vw,19px);max-width:30em;color:#2A1408}
.son .dugmeler{margin-top:32px}
.son-iletisim{margin-top:32px;display:flex;flex-wrap:wrap;gap:8px 28px;font-size:16px;font-weight:600}
.son-iletisim a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.son-iletisim a:hover{text-decoration-thickness:2px}
.son :focus-visible{outline-color:#0D0F14}

/* alt bilgi */
.alt-bilgi{padding-block:36px;border-top:1px solid var(--cizgi)}
.alt-ic{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px}
.alt-ic img{width:132px}
.alt-ic p{font-size:14px;color:var(--yazi-3)}

/* 404 */
.yok-ic{min-height:100vh;min-height:100svh;display:grid;align-content:center;gap:24px}
.yok-ic h1{font-size:clamp(36px,6vw,64px)}
.yok-ic p{color:var(--yazi-2)}

/* telefon çubuğu */
.cubuk{display:none}

/* görünme */
.js [data-gor]{opacity:0;transform:translateY(18px);transition:opacity .7s var(--egri),transform .7s var(--egri)}
.js [data-gor].gorundu{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js [data-gor]{opacity:1;transform:none;transition:none}
  .reel,.kart img,.kart-git,.cubuk{transition:none}
}

/* tablet */
@media (max-width:1000px){
  .menu{gap:20px}
  .giris-ic{grid-template-columns:minmax(0,1fr)}
  .giris h1{max-width:13em}
  .yelpaze{height:clamp(380px,60vw,500px)}
  .reel{width:clamp(150px,25vw,220px)}
  .y2{width:clamp(170px,28vw,250px)}
  .izgara{grid-template-columns:repeat(3,minmax(0,1fr))}
  .izgara li:nth-child(n+7){display:none}
  .hizmet-liste{grid-template-columns:repeat(2,minmax(0,1fr))}
  .musteri-liste{grid-template-columns:repeat(3,minmax(0,1fr))}
  .vaka-bas,.sorular-ic{grid-template-columns:minmax(0,1fr)}
  .bolum-bas{grid-template-columns:minmax(0,1fr)}
  .bolum-bas>p,.paket-giris{justify-self:start}
  .adimlar{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:32px}
  .rakamlar{grid-template-columns:minmax(0,1fr);gap:28px}
  .rakamlar dd{font-size:clamp(44px,9vw,72px)}
  .son::after{display:none}
}

/* telefon */
@media (max-width:700px){
  html{scroll-padding-bottom:calc(84px + env(safe-area-inset-bottom))}
  body{font-size:16px;padding-bottom:calc(76px + env(safe-area-inset-bottom))}
  .ust-ic{min-height:60px;gap:16px}
  .logo img{width:112px}
  .menu{gap:16px}
  .menu a{font-size:14px}
  .menu a[href="#hizmetler"]{display:none}
  .ust-wa{display:none}
  .giris{padding-top:28px}
  .giris h1{font-size:clamp(34px,10.4vw,44px)}
  .giris-alt{margin-top:18px}
  .giris .dugmeler{margin-top:26px}
  .dugmeler .dugme{flex:1 1 auto;white-space:normal}
  .yelpaze{height:calc(44vw * 1.78 + 36px);min-height:0}
  .reel{width:40vw;border-radius:16px}
  .y2{width:44vw}
  .reel-ad{font-size:12px;left:10px;right:10px;bottom:10px}
  .izgara{display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin-inline:calc(var(--kenar)*-1);padding-inline:var(--kenar);scroll-padding-inline:var(--kenar);scrollbar-width:none;padding-bottom:4px}
  .izgara::-webkit-scrollbar{display:none}
  .izgara li,.izgara li:nth-child(n+7){display:block;flex:0 0 68vw;max-width:280px;scroll-snap-align:start}
  .hizmet-liste,.kisiler,.kosullar,.adimlar{grid-template-columns:minmax(0,1fr)}
  .musteri-liste{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 16px}
  .musteri-liste li{font-size:15px;padding-block:12px}
  .hizmet-liste li,.kisiler li{padding:24px 22px}
  .paket-tablo{font-size:15px}
  .paket-tablo th,.paket-tablo td{padding:14px 12px}
  .paket-tablo tbody th,.paket-tablo tbody td{overflow-wrap:anywhere}
  .paket-tablo thead th{font:700 17px/1.2 var(--govde);letter-spacing:0;width:35%}
  .paket-tablo tbody th{width:30%}
  .sss summary{font-size:17px}
  .son .dugmeler .dugme{flex:1 1 100%}
  .cubuk{position:fixed;left:0;right:0;bottom:0;z-index:60;display:flex;gap:10px;padding:10px max(var(--kenar),env(safe-area-inset-left)) calc(10px + env(safe-area-inset-bottom));background:rgba(13,15,20,.94);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-top:1px solid var(--cizgi);transition:transform .3s var(--egri),visibility 0s}
  .cubuk .dugme{flex:1;min-height:48px;white-space:nowrap}
  .cubuk .dugme-cizgi{flex:0 0 30%}
  .cubuk.gizli{transform:translateY(110%);visibility:hidden;transition:transform .3s var(--egri),visibility 0s .3s}
}
@media (max-width:360px){
  .menu{gap:12px}
  .menu a{font-size:13px}
  .logo img{width:100px}
}

@media print{
  .js [data-gor]{opacity:1!important;transform:none!important}
  .ust,.cubuk,.atla{display:none!important}
  body{background:#fff;color:#000}
}
