/* ==========================================================================
   Fizyoterapist Reşit Taş — "Kinetik" design system  (2026)
   Dark-forward editorial · grotesque display · warm clinical
   ========================================================================== */

:root{
  /* Palette — Lacivert / çelik mavi / beyaz */
  --ink:      #0E1C33;   /* near-black navy (en koyu) */
  --forest:   #16294D;   /* primary navy (dark bölümler/başlıklar) */
  --forest-2: #21396B;   /* lighter navy (degrade) */
  --moss:     #3866B4;   /* steel — eyebrow / ikincil link */
  --sage:     #7C9CCB;   /* mid blue */
  --sage-2:   #B9CCEA;   /* light blue (koyu üstü ikincil metin) */
  --clay:     #2F6BD4;   /* accent royal blue — CTA / vurgu */
  --clay-2:   #245BBD;   /* accent hover */
  --gold:     #D9A441;   /* yıldız değerlendirmeleri */
  --paper:    #FFFFFF;
  --bone:     #F4F7FB;   /* cool off-white ground */
  --bone-2:   #E9EFF8;   /* cool light surface */
  --line:     #E0E7F2;   /* cool border */
  --line-dk:  rgba(255,255,255,.12);
  --ink-70:   #32405A;
  --ink-55:   #5A6883;

  /* Type */
  --f-display: "Bricolage Grotesque", ui-sans-serif, system-ui, sans-serif;
  --f-body:    "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;

  /* Rhythm */
  --container: 1240px;
  --gutter: clamp(1.15rem, 4vw, 3rem);
  --sy: clamp(4.5rem, 9vw, 9rem);
  --r: 16px;
  --r-lg: 26px;
  --r-xl: 34px;
  --shadow: 0 2px 6px rgba(14,28,51,.05), 0 12px 34px rgba(14,28,51,.09);
  --shadow-lg: 0 30px 70px rgba(14,28,51,.20);
  --ease: cubic-bezier(.22,.61,.36,1);
}

/* ------- Base ------------------------------------------------------------- */
*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; overflow-x:clip; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }
body{
  margin:0; overflow-x:clip;
  font-family:var(--f-body);
  font-size:1.0625rem; line-height:1.7; font-weight:400;
  color:var(--ink-70); background:var(--bone);
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}

/* Grain overlay (single inline asset, no request) */
body::before{
  content:""; position:fixed; inset:0; z-index:1; pointer-events:none; opacity:.038;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  mix-blend-mode:multiply;
}

h1,h2,h3,h4{
  font-family:var(--f-display); color:var(--ink); font-weight:600;
  line-height:1.03; letter-spacing:-.02em; text-wrap:balance; margin:0 0 .5em;
}
p{ margin:0 0 1.1rem; }
a{ color:var(--moss); text-decoration:none; transition:color .2s var(--ease); }
a:hover{ color:var(--clay); }
img{ max-width:100%; display:block; }
strong{ color:inherit; font-weight:600; }
::selection{ background:var(--clay); color:#fff; }
:focus-visible{ outline:3px solid var(--clay); outline-offset:3px; border-radius:6px; }

.container{ width:100%; max-width:var(--container); margin-inline:auto; padding-inline:var(--gutter); position:relative; z-index:2; }

.skip-link{ position:absolute; left:1rem; top:-4rem; z-index:2000; background:var(--forest); color:#fff; padding:.7rem 1.2rem; border-radius:10px; transition:top .2s var(--ease); }
.skip-link:focus{ top:1rem; color:#fff; }

/* ------- Type utilities --------------------------------------------------- */
.display{ font-size:clamp(2.9rem, 6.6vw, 5.6rem); line-height:.98; letter-spacing:-.035em; font-weight:600; }
.h-sec{ font-size:clamp(2.05rem, 4.3vw, 3.4rem); letter-spacing:-.028em; }
.lead{ font-size:clamp(1.08rem, 1.5vw, 1.3rem); line-height:1.6; }
.eyebrow{
  display:inline-flex; align-items:center; gap:.6rem; font-family:var(--f-body);
  font-weight:600; font-size:.76rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--moss); margin:0 0 1.2rem;
}
.eyebrow::before{ content:""; width:22px; height:2px; background:var(--clay); }
.eyebrow.on-dark{ color:var(--sage-2); }
.tclay{ color:var(--clay); }
.tmoss{ color:var(--moss); }

/* Section scaffolding */
.section{ padding-block:var(--sy); position:relative; }
.sec-dark{ background:var(--ink); color:var(--sage-2); }
.sec-forest{ background:var(--forest); color:var(--sage-2); }
.sec-bone2{ background:var(--bone-2); }
.sec-head{ max-width:46rem; margin-bottom:clamp(2.4rem,4vw,3.6rem); }
.sec-head.center{ margin-inline:auto; text-align:center; }
.sec-head.center .eyebrow{ justify-content:center; }
.sec-head .lead{ margin-bottom:0; color:var(--ink-55); }
.sec-dark .sec-head .lead, .sec-forest .sec-head .lead{ color:var(--sage-2); }
.sec-dark h2, .sec-forest h2{ color:#fff; }

/* ------- Buttons ---------------------------------------------------------- */
.btn{
  --bg:var(--forest); --fg:#fff; --bd:transparent;
  display:inline-flex; align-items:center; justify-content:center; gap:.55rem;
  font-family:var(--f-body); font-weight:600; font-size:1rem; line-height:1;
  padding:1.05rem 1.7rem; border-radius:999px; border:1.5px solid var(--bd);
  background:var(--bg); color:var(--fg); cursor:pointer; white-space:nowrap;
  transition:transform .18s var(--ease), box-shadow .25s var(--ease), background .2s, color .2s, border-color .2s;
}
.btn svg{ width:1.15em; height:1.15em; flex:none; }
.btn:hover{ transform:translateY(-2px); color:var(--fg); }
.btn-clay{ --bg:var(--clay); box-shadow:0 10px 26px rgba(47,107,212,.34); }
.btn-clay:hover{ --bg:var(--clay-2); box-shadow:0 14px 32px rgba(47,107,212,.42); }
.btn-forest:hover{ --bg:var(--forest-2); box-shadow:var(--shadow); }
.btn-ghost{ --bg:transparent; --fg:var(--forest); --bd:var(--line); }
.btn-ghost:hover{ --bg:var(--paper); --bd:var(--moss); box-shadow:var(--shadow); }
.btn-ghost-lt{ --bg:transparent; --fg:#fff; --bd:rgba(255,255,255,.28); }
.btn-ghost-lt:hover{ --bg:rgba(255,255,255,.08); --bd:rgba(255,255,255,.5); }
.btn-light{ --bg:#fff; --fg:var(--forest); }
.btn-lg{ padding:1.2rem 2.1rem; font-size:1.05rem; }
.btn-block{ width:100%; }

/* ==========================================================================
   Header
   ========================================================================== */
.site-header{
  position:fixed; inset:0 0 auto 0; z-index:1000; height:78px;
  display:flex; align-items:center;
  transition:background .3s var(--ease), box-shadow .3s var(--ease), border-color .3s;
  border-bottom:1px solid transparent;
}
/* Kalıcı koyu cam (dark glass) — açık/koyu bölüm farketmeksizin tutarlı */
.site-header.is-solid{
  background:rgba(14,28,51,.72); backdrop-filter:saturate(140%) blur(18px);
  -webkit-backdrop-filter:saturate(140%) blur(18px);
  border-bottom-color:rgba(255,255,255,.08); box-shadow:0 10px 30px rgba(14,28,51,.25);
}

.nav{ display:flex; align-items:center; justify-content:space-between; gap:1.5rem; width:100%; flex-wrap:nowrap; }
.brand{ display:inline-flex; align-items:center; gap:.7rem; color:#fff; flex:none; }
.brand:hover{ color:#fff; }
.brand-logo{ height:40px; width:auto; display:block; flex:none; }
.brand-name{ font-family:var(--f-display); font-weight:600; font-size:1.2rem; letter-spacing:-.02em; line-height:1; color:#fff; white-space:nowrap; }

.nav-menu{ display:flex; align-items:center; gap:.15rem; list-style:none; margin:0; padding:0; }
.nav-menu a{ color:#c9d8ef; font-weight:500; font-size:.95rem; padding:.5rem .8rem; border-radius:999px; white-space:nowrap; transition:color .2s, background .2s; }
.nav-menu a:hover, .nav-menu a.active{ color:#fff; background:rgba(255,255,255,.13); }
.nav-right{ display:flex; align-items:center; gap:.7rem; flex:none; }
.nav-phone{ display:inline-flex; align-items:center; gap:.45rem; font-weight:600; color:#fff; white-space:nowrap; }
.nav-phone:hover{ color:var(--clay); }
.nav-toggle{ display:none; width:46px; height:46px; border-radius:12px; border:1.5px solid rgba(255,255,255,.3); background:transparent; color:#fff; place-items:center; cursor:pointer; }

.mobile-panel{ background:var(--ink); width:min(86vw,360px); }
.mobile-panel .offcanvas-header{ padding:1.2rem var(--gutter); border-bottom:1px solid rgba(255,255,255,.1); }
.mobile-panel .btn-close{ filter:invert(1) grayscale(100%) brightness(180%); }
.mobile-nav{ list-style:none; margin:0; padding:1rem var(--gutter); display:flex; flex-direction:column; }
.mobile-nav a{ display:block; padding:.9rem .3rem; font-family:var(--f-display); font-size:1.5rem; font-weight:500; color:#fff; border-bottom:1px solid rgba(255,255,255,.09); }
.mobile-nav a:hover{ color:var(--clay); }
.mobile-cta{ padding:1.3rem var(--gutter); display:grid; gap:.7rem; }
.mobile-cta .btn-ghost{ --fg:#fff; --bd:rgba(255,255,255,.3); }
.mobile-cta .btn-ghost:hover{ --bg:rgba(255,255,255,.08); }

/* ==========================================================================
   Hero (dark)
   ========================================================================== */
.hero{
  background:
    radial-gradient(90% 75% at 85% -12%, rgba(56,102,180,.5), transparent 60%),
    linear-gradient(180deg, #21396B 0%, var(--forest) 32%, var(--ink) 86%);
  color:#fff; padding-top:clamp(7.5rem,12vw,11rem); padding-bottom:clamp(3rem,6vw,5rem); position:relative; overflow:hidden; min-height:92vh; display:flex; align-items:center;
}
.hero-video{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:0;
  opacity:.5; filter:saturate(.9);
}
.hero-shade{
  position:absolute; inset:0; z-index:1; pointer-events:none;
  background:
    linear-gradient(90deg, rgba(14,28,51,.94) 0%, rgba(14,28,51,.78) 42%, rgba(22,41,77,.35) 100%),
    linear-gradient(180deg, rgba(14,28,51,.55) 0%, transparent 30%, transparent 62%, var(--ink) 97%);
}
.hero .container{ position:relative; z-index:2; width:100%; }
.hero-copy{ max-width:46rem; }

.pill{ display:inline-flex; align-items:center; gap:.7rem; background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.16); backdrop-filter:blur(8px); border-radius:999px; padding:.5rem .95rem .5rem .6rem; margin-bottom:1.7rem; font-size:.9rem; color:#fff; }
.pill .stars{ color:var(--gold); letter-spacing:.04em; }
.pill b{ color:#fff; }
.pill .mut{ color:var(--sage-2); }

.hero h1{ color:#fff; margin-bottom:1.2rem; }
.hero h1 .ln{ display:block; }
.hero h1 em{ font-style:normal; font-weight:600; color:var(--clay); position:relative; }
.hero h1 em::after{ content:""; position:absolute; left:0; right:0; bottom:.06em; height:.09em; background:var(--clay); opacity:.4; border-radius:2px; }
.hero-lead{ max-width:33rem; color:#c9d8ef; margin-bottom:2rem; font-size:clamp(1.05rem,1.35vw,1.2rem); }
.hero-actions{ display:flex; flex-wrap:wrap; gap:.8rem; }

/* Hero rozetleri (video üstünde cam çipler) */
.hero-badges{ display:flex; flex-wrap:wrap; gap:.6rem; margin-top:1.6rem; }
.hero-badges .hb{
  display:inline-flex; align-items:center; gap:.5rem; padding:.55rem 1rem; border-radius:999px;
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.15); backdrop-filter:blur(8px);
  font-size:.88rem; color:#e6edf9; font-weight:500;
}
.hero-badges .hb svg{ width:16px; height:16px; color:var(--clay); flex:none; }

/* Hero stat kartları (cam) */
.hero-stats{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-top:clamp(2.4rem,4vw,3.6rem); }
.hero-stats .cell{
  background:rgba(255,255,255,.055); border:1px solid rgba(255,255,255,.12);
  border-radius:20px; padding:1.4rem clamp(1rem,2vw,1.5rem);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
}
.hero-stats .num{ font-family:var(--f-display); font-weight:600; font-size:clamp(1.9rem,2.7vw,2.6rem); color:#fff; line-height:1; letter-spacing:-.03em; font-variant-numeric:tabular-nums; }
.hero-stats .num small{ color:var(--clay); font-size:.6em; }
.hero-stats .lbl{ display:block; margin-top:.5rem; font-size:.85rem; color:var(--sage-2); line-height:1.45; }

/* ==========================================================================
   Marquee (conditions ticker)
   ========================================================================== */
.marquee-wrap{ position:relative; display:grid; gap:.85rem; overflow:hidden; }
.marquee-wrap::before, .marquee-wrap::after{
  content:""; position:absolute; top:0; bottom:0; width:clamp(3rem,9vw,10rem); z-index:2; pointer-events:none;
}
.marquee-wrap::before{ left:0; background:linear-gradient(90deg, var(--ink) 12%, transparent); }
.marquee-wrap::after{ right:0; background:linear-gradient(270deg, var(--ink) 12%, transparent); }
.marquee{ display:flex; width:max-content; gap:.7rem; animation:scrollx var(--dur,60s) linear infinite; }
.marquee.mq-rev{ animation-direction:reverse; }
.marquee:hover{ animation-play-state:paused; }
.marquee .m-item{ flex:none; display:inline-flex; align-items:center; gap:.55rem; padding:.7rem 1.15rem; border-radius:999px; font-size:.98rem; color:#e8eefb; background:rgba(255,255,255,.05); border:1px solid rgba(255,255,255,.12); white-space:nowrap; }
.marquee .m-item::before{ content:""; width:6px; height:6px; border-radius:50%; background:var(--clay); flex:none; }
@keyframes scrollx{ from{ transform:translateX(0); } to{ transform:translateX(-50%); } }
@media (prefers-reduced-motion: reduce){
  .marquee{ animation:none; flex-wrap:wrap; width:auto; }
}

/* ==========================================================================
   About
   ========================================================================== */
.about-grid{ display:grid; grid-template-columns:.92fr 1.08fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.about-media{ position:relative; }
.about-figure{ border-radius:var(--r-xl); overflow:hidden; aspect-ratio:3/4; box-shadow:var(--shadow); }
.about-figure img{ width:100%; height:100%; object-fit:cover; }
.about-badge{ position:absolute; right:clamp(-.5rem,-1vw,-1.2rem); bottom:1.6rem; background:var(--forest); color:#fff; border-radius:16px; padding:1rem 1.2rem; box-shadow:var(--shadow-lg); max-width:14rem; }
.about-badge b{ font-family:var(--f-display); font-weight:600; font-size:1.1rem; display:block; }
.about-badge span{ font-size:.8rem; color:var(--sage-2); }
.about-points{ list-style:none; margin:1.8rem 0 0; padding:0; display:grid; gap:1rem; }
.about-points li{ display:flex; gap:.85rem; align-items:flex-start; }
.about-points .chk{ flex:none; width:28px; height:28px; border-radius:9px; background:rgba(56,102,180,.13); color:var(--moss); display:grid; place-items:center; margin-top:.1rem; }
.about-points .chk svg{ width:16px; height:16px; }
.signature{ font-family:var(--f-display); font-weight:500; font-style:italic; font-size:1.6rem; color:var(--forest); margin:.4rem 0 0; }

/* ==========================================================================
   Bento — "Neden"
   ========================================================================== */
.bento{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:minmax(150px,auto); gap:1.1rem; }
.tile{ background:var(--paper); border:1px solid var(--line); border-radius:var(--r-lg); padding:1.7rem; display:flex; flex-direction:column; justify-content:flex-start; gap:1.05rem; box-shadow:var(--shadow); transition:transform .25s var(--ease), box-shadow .3s; overflow:hidden; position:relative; }
.tile:hover{ transform:translateY(-4px); }
.tile .ic{ width:50px; height:50px; border-radius:13px; background:var(--bone-2); color:var(--forest); display:grid; place-items:center; }
.tile .ic svg{ width:25px; height:25px; }
.tile h3{ font-size:1.2rem; margin:0 0 .35rem; }
.tile p{ margin:0; font-size:.95rem; color:var(--ink-55); }
.tile .big{ font-family:var(--f-display); font-weight:600; font-size:clamp(2.4rem,4vw,3.4rem); line-height:1; letter-spacing:-.03em; color:var(--forest); }
.tile .big small{ color:var(--clay); font-size:.5em; }
.tile.span2{ grid-column:span 2; }
.tile.dark{ background:var(--forest); color:#fff; border-color:transparent; }
.tile.dark h3{ color:#fff; } .tile.dark p{ color:var(--sage-2); } .tile.dark .ic{ background:rgba(255,255,255,.1); color:#fff; }
.tile.clay{ background:var(--clay); color:#fff; border-color:transparent; }
.tile.clay .big{ color:#fff; } .tile.clay p{ color:rgba(255,255,255,.85); }
.tile.photo{ padding:0; min-height:150px; }
.tile.photo img{ width:100%; height:100%; object-fit:cover; }

/* ==========================================================================
   Process (görsel + dikey numaralı adımlar)
   ========================================================================== */
.proc-grid{ display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
.steps{ display:grid; gap:clamp(1.4rem,2.5vw,2rem); counter-reset:step; }
.step{ position:relative; padding-left:4.2rem; }
.step::before{
  counter-increment:step; content:"0" counter(step);
  position:absolute; left:0; top:.1rem; width:3rem; height:3rem; display:grid; place-items:center;
  font-family:var(--f-display); font-weight:600; font-size:1.02rem; color:#fff; letter-spacing:.04em;
  background:rgba(47,107,212,.16); border:1px solid rgba(47,107,212,.4); border-radius:14px;
}
.step:not(:last-child)::after{ content:""; position:absolute; left:1.5rem; top:3.4rem; bottom:-1.4rem; width:1px; background:rgba(255,255,255,.15); }
.step h3{ font-size:1.3rem; margin:0 0 .4rem; }
.sec-forest .step h3{ color:#fff; }
.step p{ margin:0; font-size:.97rem; }
.proc-media{ position:relative; }
.proc-media .frame{ border-radius:var(--r-xl); overflow:hidden; aspect-ratio:4/4.6; box-shadow:var(--shadow-lg); border:1px solid rgba(255,255,255,.1); }
.proc-media .frame img{ width:100%; height:100%; object-fit:cover; }
.proc-media .glass{
  position:absolute; left:-1.2rem; bottom:1.6rem; display:flex; align-items:center; gap:.8rem; max-width:16rem;
  background:rgba(14,28,51,.72); backdrop-filter:blur(12px); border:1px solid rgba(255,255,255,.16);
  border-radius:16px; padding:.9rem 1.1rem; box-shadow:var(--shadow-lg);
}
.proc-media .glass .ic{ width:42px; height:42px; border-radius:11px; background:var(--clay); color:#fff; display:grid; place-items:center; flex:none; }
.proc-media .glass .ic svg{ width:22px; height:22px; }
.proc-media .glass b{ display:block; color:#fff; font-size:.92rem; line-height:1.2; }
.proc-media .glass span{ font-size:.78rem; color:var(--sage-2); }

/* ==========================================================================
   Video (YouTube lite-embed)
   ========================================================================== */
.video-grid{ display:grid; grid-template-columns:1.55fr 1fr; gap:1.1rem; align-items:stretch; }
.yt{ position:relative; border-radius:var(--r-lg); overflow:hidden; aspect-ratio:16/9; background:#0a1122; cursor:pointer; border:1px solid rgba(255,255,255,.12); display:block; width:100%; padding:0; text-align:inherit; }
.yt img.thumb{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.8; transition:opacity .3s var(--ease), transform .5s var(--ease); }
.yt:hover img.thumb{ opacity:1; transform:scale(1.03); }
.yt .play{
  position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); z-index:2;
  width:64px; height:64px; border-radius:50%; background:var(--clay); color:#fff;
  display:grid; place-items:center; box-shadow:0 12px 32px rgba(47,107,212,.45);
  transition:transform .25s var(--ease), background .2s;
}
.yt:hover .play{ transform:translate(-50%,-50%) scale(1.08); background:var(--clay-2); }
.yt .play svg{ width:24px; height:24px; margin-left:3px; }
.yt .yt-label{
  position:absolute; left:0; right:0; bottom:0; z-index:2; padding:2.4rem 1.2rem .95rem;
  background:linear-gradient(transparent, rgba(9,16,33,.88));
  color:#fff; font-weight:600; font-size:.95rem; line-height:1.3; pointer-events:none;
}
.yt iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; z-index:3; }
.yt-side{ display:grid; gap:1.1rem; grid-auto-rows:1fr; }
.yt-side .yt .play{ width:48px; height:48px; }
.yt-side .yt .play svg{ width:18px; height:18px; }
.yt-side .yt .yt-label{ font-size:.85rem; padding:1.8rem .95rem .75rem; }
.video-cta{ display:flex; align-items:center; justify-content:center; margin-top:1.8rem; }

/* ==========================================================================
   Instagram
   ========================================================================== */
.insta-head{ display:flex; flex-wrap:wrap; align-items:end; justify-content:space-between; gap:1.4rem; margin-bottom:2.2rem; }
.insta-head .lead{ margin:0; color:var(--ink-55); }
.insta-grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:.8rem; }
.insta-grid a{ position:relative; aspect-ratio:1; border-radius:16px; overflow:hidden; display:block; }
.insta-grid img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.insta-grid a:hover img{ transform:scale(1.06); }
.insta-grid a::after{
  content:""; position:absolute; inset:0; background:linear-gradient(rgba(14,28,51,0), rgba(14,28,51,.35));
  opacity:0; transition:opacity .3s var(--ease);
}
.insta-grid a:hover::after{ opacity:1; }
.insta-grid .ig-ic{
  position:absolute; right:.7rem; top:.7rem; z-index:2; width:30px; height:30px; border-radius:9px;
  background:rgba(14,28,51,.55); backdrop-filter:blur(6px); color:#fff; display:grid; place-items:center;
  opacity:0; transition:opacity .3s var(--ease);
}
.insta-grid a:hover .ig-ic{ opacity:1; }
.insta-grid .ig-ic svg{ width:16px; height:16px; }

/* ==========================================================================
   Services
   ========================================================================== */
.svc-feature{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.1rem; margin-bottom:1.4rem; }
.svc-card{ background:var(--paper); border:1px solid var(--line); border-radius:var(--r-lg); padding:1.8rem; box-shadow:var(--shadow); transition:transform .25s var(--ease), border-color .3s; }
.svc-card:hover{ transform:translateY(-4px); border-color:var(--sage); }
.svc-card .ic{ width:52px; height:52px; border-radius:14px; background:var(--forest); color:#fff; display:grid; place-items:center; margin-bottom:1.1rem; }
.svc-card .ic svg{ width:26px; height:26px; }
.svc-card h3{ font-size:1.22rem; margin:0 0 .45rem; }
.svc-card p{ font-size:.96rem; margin:0; color:var(--ink-55); }

/* All services — masonry columns (açılan akordeon satırı şişirmesin) */
.acc-grid{ columns:2; column-gap:1.3rem; }
.acc{ border:1px solid var(--line); border-radius:var(--r); background:var(--paper); overflow:hidden; break-inside:avoid; margin-bottom:.9rem; }
.acc summary{ list-style:none; cursor:pointer; padding:1.15rem 1.3rem; display:flex; align-items:center; gap:.8rem; font-family:var(--f-display); font-size:1.1rem; font-weight:500; color:var(--ink); }
.acc summary::-webkit-details-marker{ display:none; }
.acc summary .cnt{ font-family:var(--f-body); font-size:.74rem; font-weight:700; color:var(--moss); background:var(--bone-2); padding:.18rem .55rem; border-radius:999px; margin-left:auto; }
.acc summary .chev{ width:20px; height:20px; color:var(--moss); transition:transform .25s var(--ease); flex:none; }
.acc[open] summary .chev{ transform:rotate(180deg); }
.acc .body{ padding:0 1.3rem 1.1rem; }
.acc .body ul{ list-style:none; margin:0; padding:0; }
.acc .body li{ padding:.44rem 0 .44rem 1.4rem; position:relative; font-size:.95rem; border-top:1px solid var(--bone-2); color:var(--ink-70); }
.acc .body li::before{ content:""; position:absolute; left:.15rem; top:1.05rem; width:6px; height:6px; border-radius:50%; background:var(--sage); }

/* ==========================================================================
   Testimonials
   ========================================================================== */
.rev-top{ display:grid; grid-template-columns:1fr auto; gap:2rem; align-items:end; margin-bottom:2.6rem; }
.rev-score{ display:flex; align-items:center; gap:1rem; background:var(--paper); border:1px solid var(--line); border-radius:var(--r-lg); padding:1.2rem 1.6rem; box-shadow:var(--shadow); }
.rev-score .big{ font-family:var(--f-display); font-weight:600; font-size:2.8rem; color:var(--forest); line-height:1; }
.rev-score .stars{ color:var(--gold); font-size:1.05rem; letter-spacing:.06em; }
.rev-score small{ color:var(--ink-55); font-size:.85rem; }

/* Featured quote */
.rev-feature{ background:var(--forest); color:#fff; border-radius:var(--r-xl); padding:clamp(2rem,4vw,3.4rem); margin-bottom:1.3rem; position:relative; overflow:hidden; }
.rev-feature::before{ content:"\201C"; position:absolute; top:-1.5rem; right:1.5rem; font-family:var(--f-display); font-size:12rem; color:rgba(255,255,255,.06); line-height:1; }
.rev-feature .q{ font-family:var(--f-display); font-weight:500; font-size:clamp(1.3rem,2.2vw,1.85rem); line-height:1.35; color:#fff; letter-spacing:-.01em; margin:0 0 1.4rem; max-width:44rem; position:relative; }
.rev-feature .who{ display:flex; align-items:center; gap:.8rem; }
.rev-feature .who .av{ width:46px; height:46px; border-radius:50%; background:var(--clay); color:#fff; display:grid; place-items:center; font-family:var(--f-display); font-weight:600; }
.rev-feature .who b{ color:#fff; display:block; } .rev-feature .who span{ color:var(--sage-2); font-size:.86rem; }

/* Kayan, hafif eğik yorum kartları */
.rev-belt{ position:relative; overflow:hidden; padding:1.6rem 0 2rem; margin-inline:calc(var(--gutter) * -1); }
.rev-belt::before, .rev-belt::after{
  content:""; position:absolute; top:0; bottom:0; width:clamp(2rem,7vw,8rem); z-index:2; pointer-events:none;
}
.rev-belt::before{ left:0; background:linear-gradient(90deg, var(--bone) 10%, transparent); }
.rev-belt::after{ right:0; background:linear-gradient(270deg, var(--bone) 10%, transparent); }
.rev-track{ display:flex; align-items:stretch; gap:1.4rem; width:max-content; animation:scrollx 90s linear infinite; }
.rev-track:hover{ animation-play-state:paused; }
.rev{
  width:min(350px, 76vw); flex:none; display:flex; flex-direction:column;
  background:var(--paper); border:1px solid var(--line); border-radius:var(--r-lg);
  padding:1.5rem 1.6rem; box-shadow:var(--shadow);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.rev-track .rev:nth-child(odd){ transform:rotate(-1.3deg) translateY(4px); }
.rev-track .rev:nth-child(even){ transform:rotate(1.1deg); }
.rev-track .rev:hover{ transform:rotate(0) translateY(-4px); box-shadow:var(--shadow-lg); z-index:3; }
.rev .stars{ color:var(--gold); font-size:.88rem; letter-spacing:.05em; margin-bottom:.7rem; }
.rev p{ font-size:.95rem; color:var(--ink-70); margin:0 0 1.1rem; flex:1; }
.rev .who{ display:flex; align-items:center; gap:.7rem; }
.rev .av{ width:40px; height:40px; border-radius:50%; background:var(--bone-2); color:var(--forest); display:grid; place-items:center; font-family:var(--f-display); font-weight:600; flex:none; }
.rev .who b{ display:block; font-size:.9rem; color:var(--ink); line-height:1.2; } .rev .who span{ font-size:.78rem; color:var(--ink-55); }
@media (prefers-reduced-motion: reduce){
  .rev-track{ animation:none; width:auto; overflow-x:auto; }
  .rev-track .rev{ transform:none; }
}

/* ==========================================================================
   FAQ
   ========================================================================== */
.faq{ max-width:52rem; margin-inline:auto; }
.faq details{ border-bottom:1px solid var(--line); }
.faq summary{ list-style:none; cursor:pointer; padding:1.4rem 3rem 1.4rem 0; position:relative; font-family:var(--f-display); font-size:1.18rem; font-weight:500; color:var(--ink); }
.faq summary::-webkit-details-marker{ display:none; }
.faq summary::after{ content:"+"; position:absolute; right:.2rem; top:50%; transform:translateY(-50%); font-family:var(--f-body); font-weight:400; font-size:1.7rem; color:var(--moss); transition:transform .2s; }
.faq details[open] summary::after{ content:"\2212"; }
.faq .a{ padding:0 3rem 1.5rem 0; color:var(--ink-55); }
.faq .a p{ margin:0; }

/* ==========================================================================
   Contact
   ========================================================================== */
.contact-grid{ display:grid; grid-template-columns:1fr 1.05fr; gap:clamp(2rem,4vw,3.5rem); align-items:start; }
.info-list{ display:grid; gap:1rem; }
.info-card{ display:flex; gap:1rem; align-items:flex-start; background:var(--paper); border:1px solid var(--line); border-radius:var(--r-lg); padding:1.4rem 1.5rem; box-shadow:var(--shadow); }
.info-card .ic{ width:46px; height:46px; border-radius:12px; background:var(--bone-2); color:var(--forest); display:grid; place-items:center; flex:none; }
.info-card .ic svg{ width:23px; height:23px; }
.info-card b{ display:block; color:var(--ink); font-family:var(--f-display); font-weight:600; font-size:1.05rem; margin-bottom:.15rem; }
.info-card p{ margin:0; font-size:.95rem; color:var(--ink-55); }
.info-card a{ color:var(--ink-70); } .info-card a:hover{ color:var(--clay); }

.map-embed{ position:relative; border-radius:var(--r-xl); overflow:hidden; height:100%; min-height:480px; box-shadow:var(--shadow); border:1px solid var(--line); background:var(--bone-2); }
.map-embed iframe{ position:absolute; inset:0; width:100%; height:100%; border:0; display:block; filter:saturate(.85); }

/* ==========================================================================
   CTA
   ========================================================================== */
.cta-inner{ background:radial-gradient(120% 130% at 90% 0%, var(--forest-2), var(--forest) 45%, var(--ink)); color:#fff; border-radius:var(--r-xl); padding:clamp(2.6rem,5vw,4.5rem); display:grid; grid-template-columns:1.5fr auto; gap:2rem; align-items:center; position:relative; overflow:hidden; }
.cta-inner::after{ content:""; position:absolute; left:-5%; bottom:-40%; width:45%; height:100%; background:radial-gradient(circle, rgba(47,107,212,.22), transparent 62%); }
.cta-inner h2{ color:#fff; margin:0 0 .5rem; }
.cta-inner p{ color:var(--sage-2); margin:0; max-width:36rem; }
.cta-inner .actions{ position:relative; z-index:1; display:flex; flex-wrap:wrap; gap:.8rem; }

/* ==========================================================================
   Footer
   ========================================================================== */
.footer{ background:var(--ink); color:#94a3bd; padding-block:clamp(3rem,6vw,4.5rem) 2rem; }
.footer a{ color:#c7d3e8; } .footer a:hover{ color:var(--clay); }
.footer-grid{ display:grid; grid-template-columns:1.5fr 1fr 1fr 1.2fr; gap:2.5rem; padding-bottom:2.5rem; border-bottom:1px solid rgba(255,255,255,.08); }
.footer .brand-name{ color:#fff; } .footer .brand:hover{ color:#fff; }
.footer h4{ color:#fff; font-family:var(--f-body); font-size:.78rem; letter-spacing:.16em; text-transform:uppercase; font-weight:700; margin-bottom:1.1rem; }
.footer ul{ list-style:none; margin:0; padding:0; display:grid; gap:.6rem; font-size:.95rem; }
.footer-about{ font-size:.95rem; max-width:24rem; margin-top:1.1rem; }
.footer-social{ display:flex; gap:.6rem; margin-top:1.3rem; }
.footer-social a{ width:40px; height:40px; border-radius:11px; background:rgba(255,255,255,.06); display:grid; place-items:center; color:#c7d3e8; transition:background .2s, color .2s; }
.footer-social a:hover{ background:var(--clay); color:#fff; }
.footer-social svg{ width:19px; height:19px; }
.footer-bottom{ display:flex; flex-wrap:wrap; justify-content:space-between; gap:1rem; padding-top:1.6rem; font-size:.85rem; color:#6b7a95; }
.footer-disclaimer{ font-size:.8rem; color:#5b6a85; max-width:62rem; margin-top:1rem; line-height:1.6; }

/* ==========================================================================
   Mobile bar + to-top
   ========================================================================== */
.mobile-bar{ position:fixed; left:0; right:0; bottom:0; z-index:900; display:none; grid-template-columns:1fr 1fr; gap:.6rem; padding:.7rem var(--gutter) calc(.7rem + env(safe-area-inset-bottom)); background:rgba(244,247,251,.94); backdrop-filter:blur(12px); border-top:1px solid var(--line); }
.mobile-bar .btn{ padding:.9rem 1rem; font-size:.95rem; }
.to-top{ position:fixed; right:1.2rem; bottom:1.2rem; z-index:850; width:48px; height:48px; border-radius:50%; background:var(--forest); color:#fff; display:grid; place-items:center; box-shadow:var(--shadow-lg); border:0; cursor:pointer; opacity:0; visibility:hidden; transform:translateY(12px); transition:opacity .25s var(--ease), transform .25s, visibility .25s; }
.to-top.show{ opacity:1; visibility:visible; transform:none; }
.to-top svg{ width:22px; height:22px; }

/* ==========================================================================
   Reveal
   ========================================================================== */
.reveal{ opacity:0; transform:translateY(24px); transition:opacity .7s var(--ease), transform .7s var(--ease); }
.reveal.in{ opacity:1; transform:none; }
.reveal.d1{ transition-delay:.09s; } .reveal.d2{ transition-delay:.18s; } .reveal.d3{ transition-delay:.27s; }
@media (prefers-reduced-motion: reduce){
  .reveal{ opacity:1 !important; transform:none !important; transition:none !important; }
  .btn:hover,.tile:hover,.svc-card:hover,.rev:hover{ transform:none; }
}

/* ==========================================================================
   Responsive
   ========================================================================== */
@media (max-width:1080px){
  .nav-menu{ display:none; }
  .nav-toggle{ display:grid; }
  .bento{ grid-template-columns:repeat(2,1fr); }
  .tile.span2{ grid-column:span 2; }
}
@media (max-width:860px){
  .about-grid, .contact-grid, .proc-grid, .video-grid{ grid-template-columns:1fr; }
  .about-media{ max-width:24rem; margin-inline:auto; }
  .proc-media{ max-width:26rem; margin-inline:auto; }
  .hero{ min-height:0; }
  .hero-stats{ grid-template-columns:repeat(2,1fr); }
  .svc-feature{ grid-template-columns:1fr; gap:1.4rem; }
  .acc-grid{ columns:1; }
  .rev-top{ grid-template-columns:1fr; }
  .cta-inner{ grid-template-columns:1fr; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .nav-phone{ display:none; }
  .insta-grid{ grid-template-columns:repeat(3,1fr); }
}
@media (max-width:560px){
  body{ font-size:1rem; }
  .bento{ grid-template-columns:1fr; } .tile.span2{ grid-column:span 1; }
  .hero-stats{ grid-template-columns:1fr 1fr; }
  .footer-grid{ grid-template-columns:1fr; gap:1.8rem; }
  .mobile-bar{ display:grid; }
  .to-top{ bottom:5rem; }
  .proc-media .glass{ left:.4rem; }
  .insta-grid{ grid-template-columns:repeat(2,1fr); gap:.6rem; }
}

/* ==========================================================================
   İç sayfalar — page hero + breadcrumb
   ========================================================================== */
.page-hero{
  background:
    radial-gradient(80% 90% at 88% -20%, rgba(56,102,180,.45), transparent 62%),
    linear-gradient(180deg, #21396B 0%, var(--forest) 40%, var(--ink) 100%);
  color:#fff; position:relative; overflow:hidden;
  padding:calc(78px + clamp(2.8rem,6vw,5rem)) 0 clamp(2.6rem,5vw,4.2rem);
}
.page-hero::after{ content:""; position:absolute; right:-6%; bottom:-40%; width:40%; height:90%; background:radial-gradient(circle, rgba(47,107,212,.12), transparent 66%); filter:blur(12px); pointer-events:none; }
.page-hero .container{ position:relative; z-index:1; }
.crumbs{ display:flex; flex-wrap:wrap; align-items:center; gap:.5rem; font-size:.85rem; color:var(--sage-2); margin-bottom:1.2rem; }
.crumbs a{ color:var(--sage-2); } .crumbs a:hover{ color:#fff; }
.crumbs .sep{ opacity:.45; }
.crumbs [aria-current]{ color:#fff; }
.page-hero h1{ color:#fff; font-size:clamp(2.3rem,4.8vw,3.9rem); letter-spacing:-.03em; margin:0 0 .7rem; }
.page-hero .lead{ color:#c9d8ef; max-width:46rem; margin:0; }
.page-hero .meta-row{ display:flex; flex-wrap:wrap; gap:1rem; margin-top:1.2rem; font-size:.88rem; color:var(--sage-2); }
.page-hero .meta-row b{ color:#fff; font-weight:600; }

/* ==========================================================================
   Blog
   ========================================================================== */
.post-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
.post-card{
  background:var(--paper); border:1px solid var(--line); border-radius:var(--r-lg); overflow:hidden;
  display:flex; flex-direction:column; box-shadow:var(--shadow);
  transition:transform .25s var(--ease), box-shadow .3s var(--ease);
}
.post-card:hover{ transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.post-card .cover{ aspect-ratio:16/10; overflow:hidden; display:block; }
.post-card .cover img{ width:100%; height:100%; object-fit:cover; transition:transform .5s var(--ease); }
.post-card:hover .cover img{ transform:scale(1.05); }
.post-card .pbody{ padding:1.4rem 1.5rem 1.6rem; display:flex; flex-direction:column; gap:.55rem; flex:1; }
.post-meta{ display:flex; flex-wrap:wrap; align-items:center; gap:.6rem; font-size:.78rem; color:var(--ink-55); }
.post-tag{ display:inline-flex; padding:.22rem .6rem; border-radius:999px; background:var(--bone-2); color:var(--moss); font-weight:600; font-size:.74rem; letter-spacing:.04em; }
.post-card h3{ font-size:1.22rem; margin:0; line-height:1.25; }
.post-card h3 a{ color:var(--ink); } .post-card h3 a:hover{ color:var(--clay); }
.post-card p{ margin:0; font-size:.93rem; color:var(--ink-55); flex:1; }
.post-card .more{ display:inline-flex; align-items:center; gap:.35rem; font-weight:600; font-size:.9rem; color:var(--moss); margin-top:.3rem; }
.post-card .more:hover{ color:var(--clay); }
.post-featured{ display:grid; grid-template-columns:1.25fr 1fr; margin-bottom:1.2rem; }
.post-featured .cover{ aspect-ratio:auto; min-height:320px; }
.post-featured .pbody{ padding:clamp(1.6rem,3vw,2.4rem); justify-content:center; }
.post-featured h3{ font-size:clamp(1.5rem,2.4vw,2.1rem); }

/* ==========================================================================
   Makale (prose) + yan sütun
   ========================================================================== */
.article-grid{ display:grid; grid-template-columns:minmax(0,1fr) 330px; gap:clamp(2rem,4vw,3.5rem); align-items:start; }
.prose{ max-width:47rem; font-size:1.05rem; }
.prose h2{ font-size:clamp(1.5rem,2.4vw,1.9rem); margin:2.4rem 0 .8rem; }
.prose h3{ font-size:1.25rem; margin:1.8rem 0 .6rem; }
.prose p{ margin:0 0 1.15rem; }
.prose ul, .prose ol{ margin:0 0 1.2rem; padding-left:1.3rem; display:grid; gap:.45rem; }
.prose li::marker{ color:var(--clay); }
.prose img{ border-radius:var(--r-lg); box-shadow:var(--shadow); margin:1.6rem 0; }
.prose blockquote{
  margin:1.8rem 0; padding:1.3rem 1.5rem; border-left:3px solid var(--clay);
  background:var(--paper); border-radius:0 var(--r) var(--r) 0; box-shadow:var(--shadow);
  font-family:var(--f-display); font-weight:500; font-size:1.12rem; color:var(--forest);
}
.prose blockquote p{ margin:0; }
.lede{ font-size:1.16rem; color:var(--ink); }
.aside-col{ display:grid; gap:1.1rem; position:sticky; top:98px; }
.aside-card{ background:var(--paper); border:1px solid var(--line); border-radius:var(--r-lg); padding:1.5rem 1.6rem; box-shadow:var(--shadow); }
.aside-card.dark{ background:var(--forest); border-color:transparent; color:var(--sage-2); }
.aside-card.dark h3, .aside-card.dark b{ color:#fff; }
.aside-card h3{ font-size:1.15rem; margin:0 0 .8rem; }
.aside-card ul{ list-style:none; margin:0; padding:0; display:grid; gap:.55rem; font-size:.95rem; }
.aside-card li a{ color:var(--ink-70); display:flex; gap:.5rem; align-items:baseline; }
.aside-card li a::before{ content:"→"; color:var(--clay); flex:none; }
.aside-card li a:hover{ color:var(--clay); }
.fact{ display:flex; justify-content:space-between; gap:1rem; padding:.6rem 0; border-top:1px solid var(--line); font-size:.93rem; }
.fact:first-of-type{ border-top:0; }
.fact b{ color:var(--ink); font-weight:600; text-align:right; }
.author-box{ display:flex; gap:1rem; align-items:center; margin-top:2.2rem; padding:1.3rem 1.4rem; background:var(--paper); border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow); }
.author-box .avatar{ width:58px; height:58px; border-radius:50%; overflow:hidden; flex:none; background:var(--forest); color:#fff; display:grid; place-items:center; font-family:var(--f-display); font-weight:600; font-size:1.3rem; }
.author-box .avatar img{ width:100%; height:100%; object-fit:cover; }
.author-box b{ font-family:var(--f-display); color:var(--ink); display:block; }
.author-box span{ font-size:.86rem; color:var(--ink-55); }

/* ==========================================================================
   Yorum duvarı (statik sayfa)
   ========================================================================== */
.rev-wall{ columns:3; column-gap:1.3rem; }
.rev-wall .rev{ width:auto; display:block; margin-bottom:1.3rem; break-inside:avoid; }
.rev-wall .rev:hover{ transform:translateY(-3px); }

/* ==========================================================================
   Form
   ========================================================================== */
.form-card{ background:var(--paper); border:1px solid var(--line); border-radius:var(--r-xl); padding:clamp(1.6rem,3.5vw,2.6rem); box-shadow:var(--shadow); }
.form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:1.1rem; }
.field{ display:grid; gap:.4rem; }
.field.full{ grid-column:1 / -1; }
.field label{ font-weight:600; font-size:.9rem; color:var(--ink); }
.field input, .field select, .field textarea{
  width:100%; font:inherit; font-size:1rem; color:var(--ink);
  background:var(--bone); border:1.5px solid var(--line); border-radius:14px;
  padding:.85rem 1rem; transition:border-color .2s var(--ease), background .2s;
}
.field textarea{ min-height:140px; resize:vertical; }
.field input:focus, .field select:focus, .field textarea:focus{ outline:none; border-color:var(--moss); background:#fff; }
.field .hint{ font-size:.8rem; color:var(--ink-55); }
.consent{ display:flex; gap:.7rem; align-items:flex-start; font-size:.88rem; color:var(--ink-55); }
.consent input{ width:1.15rem; height:1.15rem; margin-top:.2rem; accent-color:var(--forest); flex:none; }
.consent a{ text-decoration:underline; }

/* ==========================================================================
   Hukuki metin (KVKK)
   ========================================================================== */
.legal{ max-width:50rem; }
.legal h2{ font-size:1.45rem; margin:2.2rem 0 .7rem; }
.legal p, .legal li{ font-size:.98rem; }
.legal ul, .legal ol{ padding-left:1.3rem; display:grid; gap:.4rem; margin:0 0 1.1rem; }
.legal li::marker{ color:var(--clay); }
.legal .updated{ font-size:.85rem; color:var(--ink-55); }

/* ==========================================================================
   404
   ========================================================================== */
.err-hero{ min-height:100vh; display:flex; align-items:center; text-align:center;
  background:radial-gradient(80% 90% at 50% -20%, rgba(56,102,180,.5), transparent 60%), linear-gradient(180deg,#21396B, var(--forest) 40%, var(--ink)); color:#fff; }
.err-hero .code{ font-family:var(--f-display); font-weight:700; font-size:clamp(6rem,18vw,12rem); line-height:1; letter-spacing:-.04em; color:rgba(255,255,255,.12); }
.err-hero h1{ color:#fff; margin:-.5em 0 .6rem; font-size:clamp(1.8rem,3.5vw,2.6rem); }
.err-hero p{ color:var(--sage-2); max-width:30rem; margin:0 auto 1.8rem; }

/* İç sayfa responsive */
@media (max-width:991px){
  .article-grid{ grid-template-columns:1fr; }
  .aside-col{ position:static; }
}
@media (max-width:860px){
  .post-grid{ grid-template-columns:1fr 1fr; }
  .post-featured{ grid-template-columns:1fr; }
  .rev-wall{ columns:2; }
  .form-grid{ grid-template-columns:1fr; }
}
@media (max-width:560px){
  .post-grid{ grid-template-columns:1fr; }
  .rev-wall{ columns:1; }
}

/* ==========================================================================
   Detay sayfaları — medya zenginleştirme
   ========================================================================== */
/* Dikey Shorts embed */
.yt.vert{ aspect-ratio:9/16; max-width:300px; }
.yt.vert .play{ width:52px; height:52px; }
.yt.vert .play svg{ width:20px; height:20px; }
.yt-row{ display:grid; grid-template-columns:1fr 300px; gap:1.1rem; align-items:stretch; }
.yt-row .yt:not(.vert){ aspect-ratio:auto; min-height:100%; }
.prose .yt{ margin:1.6rem 0; border-color:var(--line); }

/* Makale kapak görseli */
.article-cover{ border-radius:var(--r-xl); overflow:hidden; box-shadow:var(--shadow-lg); margin-bottom:clamp(1.8rem,3vw,2.6rem); }
.article-cover img{ width:100%; height:auto; max-height:460px; object-fit:cover; display:block; }
figure.pfig{ margin:1.8rem 0; }
figure.pfig img{ margin:0; width:100%; }
figure.pfig figcaption{ font-size:.83rem; color:var(--ink-55); padding:.6rem .3rem 0; }

/* İçindekiler */
.toc{ background:var(--paper); border:1px solid var(--line); border-radius:var(--r); padding:1.2rem 1.4rem; margin:0 0 2rem; }
.toc b{ display:block; font-family:var(--f-display); color:var(--ink); margin-bottom:.6rem; font-size:1.02rem; }
.toc ol{ margin:0; padding-left:1.2rem; display:grid; gap:.35rem; font-size:.93rem; }
.toc a{ color:var(--ink-70); } .toc a:hover{ color:var(--clay); }

/* Okuma ilerleme çubuğu */
.readbar{ position:fixed; top:0; left:0; height:3px; width:0; background:var(--clay); z-index:1100; transition:width .1s linear; }

/* Sayfalama */
.pagination{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:.45rem; margin-top:clamp(2.2rem,4vw,3.2rem); }
.pagination a, .pagination span{
  min-width:44px; height:44px; padding:0 .9rem; display:inline-flex; align-items:center; justify-content:center;
  border-radius:999px; font-weight:600; font-size:.95rem; color:var(--ink-70);
  background:var(--paper); border:1px solid var(--line); transition:all .2s var(--ease);
}
.pagination a:hover{ border-color:var(--moss); color:var(--forest); transform:translateY(-2px); box-shadow:var(--shadow); }
.pagination .current{ background:var(--forest); border-color:var(--forest); color:#fff; }
.pagination .dots{ border:0; background:transparent; min-width:auto; padding:0 .2rem; }
.pagination .nav-btn{ gap:.4rem; }
.pagination .nav-btn svg{ width:16px; height:16px; }

/* Önceki / sonraki yazı */
.post-nav{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; margin-top:2.4rem; }
.post-nav a{
  display:grid; gap:.3rem; padding:1.2rem 1.4rem; background:var(--paper);
  border:1px solid var(--line); border-radius:var(--r-lg); box-shadow:var(--shadow);
  transition:transform .2s var(--ease), border-color .2s;
}
.post-nav a:hover{ transform:translateY(-3px); border-color:var(--sage); }
.post-nav .dir{ font-size:.76rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--moss); }
.post-nav b{ font-family:var(--f-display); color:var(--ink); font-size:1.02rem; line-height:1.3; }
.post-nav a.next{ text-align:right; }
@media (max-width:640px){
  .yt-row{ grid-template-columns:1fr; }
  .yt.vert{ max-width:100%; aspect-ratio:9/14; }
  .post-nav{ grid-template-columns:1fr; }
}

/* ==========================================================================
   Blog öne çıkan kart — boşluk düzeltmesi (görsel akışa girmeyip alanı doldurur)
   ========================================================================== */
.post-featured{ grid-template-columns:1.05fr 1fr; align-items:stretch; }
.post-featured .cover{ position:relative; aspect-ratio:auto; min-height:100%; height:auto; }
.post-featured .cover img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.post-featured .pbody{ min-height:clamp(300px,27vw,380px); }
@media (max-width:860px){
  .post-featured .cover{ position:relative; aspect-ratio:16/10; min-height:0; }
  .post-featured .pbody{ min-height:0; }
}

/* ==========================================================================
   Çağrı-talep popup (Bootstrap modal + "Kinetik" stili)
   ========================================================================== */
.modal-backdrop.show{ background:var(--ink); opacity:.66; }
.callback-modal{
  background:var(--bone); border:1px solid var(--line); border-radius:var(--r-xl);
  box-shadow:var(--shadow-lg); padding:clamp(1.8rem,4vw,2.6rem); position:relative; overflow:hidden;
}
.callback-modal::before{
  content:""; position:absolute; right:-14%; top:-30%; width:46%; height:70%;
  background:radial-gradient(circle, rgba(47,107,212,.14), transparent 66%); pointer-events:none;
}
.callback-modal > *{ position:relative; z-index:1; }
.cb-close{
  position:absolute; top:1rem; right:1rem; width:42px; height:42px; border-radius:50%; border:0;
  background:var(--bone-2); color:var(--ink); display:grid; place-items:center; cursor:pointer; z-index:2;
  transition:background .2s var(--ease), transform .2s var(--ease);
}
.cb-close:hover{ background:var(--line); transform:rotate(90deg); }
.cb-close svg{ width:20px; height:20px; }
.callback-modal .eyebrow{ margin-bottom:.7rem; }
.callback-modal h2{ font-size:clamp(1.75rem,3.2vw,2.3rem); margin:0 0 .4rem; }
.callback-modal .cb-sub{ color:var(--ink-55); margin:0 0 1.5rem; font-size:1rem; }
.cb-form{ display:grid; gap:.8rem; }
.cb-form input[type="text"], .cb-form input[type="tel"]{
  width:100%; font:inherit; font-size:1rem; color:var(--ink);
  background:var(--paper); border:1.5px solid var(--line); border-radius:14px; padding:.95rem 1.15rem;
  transition:border-color .2s var(--ease);
}
.cb-form input::placeholder{ color:var(--ink-55); }
.cb-form input:focus{ outline:none; border-color:var(--moss); }
.cb-consent{ display:flex; gap:.65rem; align-items:flex-start; font-size:.86rem; color:var(--ink-55); line-height:1.45; cursor:pointer; }
.cb-consent input{ width:1.15rem; height:1.15rem; margin-top:.15rem; accent-color:var(--forest); flex:none; }
.cb-consent a{ color:var(--moss); text-decoration:underline; }
.cb-form .btn{ margin-top:.5rem; }
.cb-or{ display:flex; align-items:center; gap:1rem; margin:1.35rem 0 1rem; font-size:.76rem; font-weight:700; letter-spacing:.2em; color:var(--ink-55); }
.cb-or::before, .cb-or::after{ content:""; flex:1; height:1px; background:var(--line); }
.cb-alt{ display:grid; grid-template-columns:1fr 1fr; gap:.7rem; }
.cb-alt .btn{ padding:.95rem 1rem; }
@media (max-width:420px){ .cb-alt{ grid-template-columns:1fr; } }

/* ==========================================================================
   KVKK / hukuki belge — sağ menü düzeni
   ========================================================================== */
.legal-layout{ display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:clamp(2rem,4vw,3.5rem); align-items:start; }
.legal-nav{ position:sticky; top:98px; background:var(--paper); border:1px solid var(--line); border-radius:var(--r-lg); padding:.9rem; box-shadow:var(--shadow); display:grid; gap:.25rem; }
.legal-nav .ln-title{ font-family:var(--f-body); font-size:.72rem; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--moss); padding:.5rem .9rem .6rem; }
.legal-nav a{ display:flex; gap:.7rem; align-items:center; padding:.8rem .9rem; border-radius:12px; font-weight:500; font-size:.96rem; color:var(--ink-70); transition:background .2s var(--ease), color .2s; }
.legal-nav a:hover{ background:var(--bone-2); color:var(--forest); }
.legal-nav a.active{ background:var(--forest); color:#fff; }
.legal-nav a .ln-ic{ width:34px; height:34px; border-radius:10px; background:var(--bone-2); color:var(--forest); display:grid; place-items:center; flex:none; transition:background .2s, color .2s; }
.legal-nav a .ln-ic svg{ width:18px; height:18px; }
.legal-nav a.active .ln-ic{ background:rgba(255,255,255,.16); color:#fff; }
.legal-doc{ display:none; }
.legal-doc.active{ display:block; animation:fadeUp .4s var(--ease); }
@keyframes fadeUp{ from{ opacity:0; transform:translateY(10px); } to{ opacity:1; transform:none; } }
@media (prefers-reduced-motion: reduce){ .legal-doc.active{ animation:none; } }
@media (max-width:900px){
  .legal-layout{ grid-template-columns:1fr; }
  .legal-nav{ position:static; order:-1; }
}

/* ==========================================================================
   Logo & marka — mobil sığdırma
   ========================================================================== */
@media (max-width:560px){
  .site-header .nav-right .btn-clay{ display:none; }  /* mobil: header CTA gizli (mobil-bar'da var) */
  .brand-logo{ height:34px; }
  .brand-name{ font-size:1.08rem; }
}
@media (max-width:360px){
  .brand-name{ display:none; }  /* çok dar ekranda yalnız logo */
}

/* Dil geçişi (TR/EN, bayraklı) — header + mobil */
.lang-switch{display:inline-flex;align-items:center;gap:.15rem;margin-right:.25rem;font-family:var(--f-body);font-weight:700;font-size:.78rem}
.lang-switch a,.lang-switch .on{display:inline-flex;align-items:center;gap:.32rem;padding:.28rem .5rem;border-radius:999px;letter-spacing:.03em;line-height:1}
.lang-switch img{width:20px;height:20px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px rgba(255,255,255,.35);display:block}
.lang-switch a{color:var(--sage-2);text-decoration:none;transition:color .2s ease,background .2s ease}
.lang-switch a:hover{color:#fff;background:rgba(255,255,255,.1)}
.lang-switch .on{color:#fff;background:rgba(255,255,255,.16)}
.lang-switch .on img{box-shadow:0 0 0 2px var(--clay)}
@media (max-width:991px){.site-header .lang-switch{display:none}}
.mobile-lang{display:flex;gap:.5rem;align-items:center;padding:1rem 1.25rem .2rem;font-family:var(--f-body);font-weight:700}
.mobile-lang span.lbl{color:var(--ink-55);font-weight:500;font-size:.85rem}
.mobile-lang a,.mobile-lang .on{display:inline-flex;align-items:center;gap:.4rem;padding:.4rem .7rem;border-radius:999px;font-size:.9rem;text-decoration:none}
.mobile-lang img{width:22px;height:22px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 1px var(--line);display:block}
.mobile-lang a{color:var(--forest);border:1px solid var(--line)}
.mobile-lang .on{color:#fff;background:var(--clay)}
.mobile-lang .on img{box-shadow:0 0 0 2px rgba(255,255,255,.6)}

/* ============ LANDING (reklam) sayfaları ============ */
.lp-header{position:sticky;top:0;background:rgba(14,28,51,.92)!important;backdrop-filter:saturate(140%) blur(18px);-webkit-backdrop-filter:saturate(140%) blur(18px);border-bottom:1px solid rgba(255,255,255,.08);box-shadow:0 8px 26px rgba(14,28,51,.22)}
.lp-header .d-none-mobile{margin-left:.1rem}
@media (max-width:600px){.lp-header .nav-phone .d-none-mobile{display:none}}

.lp-hero{position:relative;overflow:hidden;background:var(--ink);color:#fff;padding-block:clamp(2.5rem,6vw,4.5rem);isolation:isolate}
.lp-hero::before{content:"";position:absolute;inset:0;z-index:-2;background:var(--lp-bg,none) center/cover no-repeat;transform:scale(1.03)}
.lp-hero-shade{position:absolute;inset:0;z-index:-1;background:linear-gradient(115deg,rgba(14,28,51,.94) 0%,rgba(14,28,51,.86) 42%,rgba(22,41,77,.72) 100%)}
.lp-hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(1.5rem,4vw,3.5rem);align-items:center}
.lp-copy .pill{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.18);color:#fff;margin-bottom:1rem}
.lp-copy .eyebrow.on-dark{margin-bottom:.6rem}
.lp-title{color:#fff;font-family:var(--f-display);font-weight:700;line-height:1.04;letter-spacing:-.02em;font-size:clamp(2.1rem,4.6vw,3.5rem);margin:0 0 1rem}
.lp-title em{color:var(--sage);font-style:normal}
.lp-hero .lp-form-title{color:var(--forest)}
.lp-sub{color:var(--sage-2);font-size:clamp(1rem,1.6vw,1.18rem);line-height:1.6;max-width:34rem;margin:0 0 1.3rem}
.lp-benefits{list-style:none;padding:0;margin:0 0 1.5rem;display:grid;gap:.7rem}
.lp-benefits li{display:flex;gap:.6rem;align-items:flex-start;color:#eaf1fb;font-size:1rem;line-height:1.45}
.lp-benefits .chk{flex:0 0 auto;width:24px;height:24px;display:grid;place-items:center;border-radius:50%;background:rgba(47,107,212,.9);color:#fff}
.lp-benefits .chk svg{width:15px;height:15px}
.lp-hero-actions{display:flex;flex-wrap:wrap;gap:.7rem}

.lp-form-card{background:#fff;color:var(--ink);border-radius:var(--r-lg);padding:clamp(1.4rem,2.5vw,2rem);box-shadow:var(--shadow-lg);scroll-margin-top:90px}
.lp-form-title{font-family:var(--f-display);font-weight:700;font-size:1.5rem;margin:0 0 .35rem;color:var(--forest)}
.lp-form-note{color:var(--ink-55);font-size:.95rem;line-height:1.5;margin:0 0 1.1rem}
.lp-form-card .cb-form{display:grid;gap:.7rem}
.lp-form-card input[type=text],.lp-form-card input[type=tel]{width:100%;padding:.85rem 1rem;border:1px solid var(--line);border-radius:12px;font:inherit;font-size:1rem;background:var(--bone);transition:border-color .2s,background .2s}
.lp-form-card input:focus{outline:none;border-color:var(--clay);background:#fff}
.lp-form-card .cb-consent{display:flex;gap:.5rem;align-items:flex-start;font-size:.82rem;color:var(--ink-55);line-height:1.4}
.lp-form-card .cb-consent input{margin-top:.15rem}
.lp-form-card .cb-consent a{color:var(--clay)}
.lp-form-card .btn-block{width:100%;justify-content:center;margin-top:.2rem}
.lp-form-card .form-messages{margin:.2rem 0 0;font-size:.9rem}
.lp-form-card .form-messages.is-success{color:#1a7f4b}
.lp-form-card .form-messages.is-error{color:#c0392b}
.lp-form-trust{display:flex;gap:.45rem;align-items:center;color:var(--ink-55);font-size:.8rem;line-height:1.4;margin:.9rem 0 0}
.lp-form-trust svg{flex:0 0 auto;color:var(--clay)}

@media (max-width:860px){
  .lp-hero-grid{grid-template-columns:1fr;gap:1.6rem}
  .lp-form-card{order:-1}
}

.lp-footer{padding-block:clamp(2rem,4vw,3rem)}
.lp-footer-top{display:flex;flex-wrap:wrap;gap:1rem 2rem;align-items:center;justify-content:space-between;padding-bottom:1.4rem;border-bottom:1px solid var(--line-dk)}
.lp-footer-contact{display:flex;flex-wrap:wrap;gap:.5rem 1.4rem;align-items:center;color:var(--sage-2);font-size:.95rem}
.lp-footer-contact a{color:#fff;text-decoration:none;display:inline-flex;align-items:center;gap:.4rem}
.lp-footer-contact a:hover{color:var(--sage)}