/* skytekpress.com — tek stil dosyası.
   İki katman: (1) yayınevi çerçevesi — Skytek ana logosundan yeşil + bordo (--h-*): üst bant, alt bilgi, ana sayfa,
   kataloglar, iç sayfalar; (2) ürün teması — her ürün sayfasının giriş/kapanış/satın alma kutuları o ürünün kapak
   renklerini taşır (--navy/--orange adları ürün teması içindir; .product üzerinde ürün başına ezilebilir).
   Üçüncü taraf istek yok: yazı tipleri fonts.css'ten. */
:root {
  --h-green: #1f4d38; --h-green-2: #2c6a4c; --h-wine: #5b1e3a; --h-wine-soft: #f6ecf0; --h-mist: #f1f4f1;
  --h-ink: #17251d; --h-slate: #4f5d55; --h-line: #d9e0db;
  /* ürün teması varsayılanı = Skytek kimliği (yeşil zemin, bordo vurgu). Adlar tarihsel: --navy = koyu zemin, --orange = vurgu */
  --navy: #1f4d38; --navy-2: #275c44; --navy-line: #3a6b55; --on-navy: #f4f6f2; --on-navy-soft: #c9d8cd;
  --orange: #a8325c; --orange-hover: #bf3d6b; --orange-ink: #8a2b4d; --tint: #f6ecf0; --btn-text: #ffffff; --hl: #f0b6c9;
  --paper: #ffffff; --mist: #f1f4f1; --ink: #17251d; --slate: #4f5d55; --line: #d9e0db;
  --f-display: "Inter Tight", "Helvetica Neue", Arial, sans-serif;
  --f-body: "IBM Plex Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
  --f-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;
  --wrap: 1120px;
  color-scheme: light;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--f-body); font-size: 17px; line-height: 1.6; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--orange-ink); text-underline-offset: 3px; }
:focus-visible { outline: 3px solid var(--orange); outline-offset: 3px; }
.wrap { max-width: var(--wrap); margin: 0 auto; padding-inline: 24px; }
h1, h2, h3 { font-family: var(--f-display); color: inherit; margin: 0; }
h2 { font-size: clamp(26px, 3.4vw, 36px); line-height: 1.12; font-weight: 800; letter-spacing: -0.02em; }
h3 { font-size: 18px; line-height: 1.3; font-weight: 600; }
p { margin: 0 0 12px; }

/* ---------- üst bant: yayınevi çerçevesi ---------- */
.top { background: var(--paper); color: var(--h-ink); border-bottom: 1px solid var(--h-line); }
.top .bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px 28px; padding-block: 14px; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-family: var(--f-display); font-weight: 800; font-size: 20px; letter-spacing: -0.015em; color: var(--h-green); text-decoration: none; }
.brand img { width: 34px; height: 27px; }
/* yazı: yayınevlerinin çizgisinde editoryal serif (Newsreader; Leanpub kullanıyor, Tiempos/Ivar'a yakın); küçük taç.
   Etkileşim: üstüne gelince taç hafifçe eğilir, "Press" altında bordo çizgi açılır. */
.wm { font-family: "Newsreader", Georgia, serif; font-weight: 600; font-size: 25px; line-height: 1; letter-spacing: -0.01em; color: var(--h-green); }
.wm em { font-style: normal; color: #7a2443; background: linear-gradient(#7a2443, #7a2443) no-repeat 0 100% / 0 2px; padding-bottom: 2px; transition: background-size .35s ease; }
.brand img { transition: transform .35s cubic-bezier(.3, 1.6, .5, 1); }
.brand:hover img, .brand:focus-visible img { transform: translateY(-2px) rotate(-6deg); }
.brand:hover .wm em, .brand:focus-visible .wm em { background-size: 100% 2px; }
.brand.on-dark .wm { color: #f4f6f2; }
.brand.on-dark .wm em { color: #c9d8cd; background-image: linear-gradient(#c9d8cd, #c9d8cd); }
@media (prefers-reduced-motion: reduce) { .brand img, .wm em { transition: none; } }
.site-nav { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 22px; font-size: 15.5px; }
.site-nav a { color: var(--h-slate); text-decoration: none; padding: 6px 0; }
.site-nav a:hover { color: var(--h-ink); }
.site-nav a[aria-current="page"] { color: var(--h-ink); box-shadow: inset 0 -2px 0 var(--h-wine); }
.site-nav .legal-nav { display: flex; gap: 14px; padding-left: 18px; border-left: 1px solid var(--h-line); font-size: 13.5px; }

/* ---------- ana sayfa: giriş ---------- */
.hero { background: var(--navy); color: var(--on-navy); padding-bottom: 72px; }
.hero .grid { display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 56px; align-items: start; padding-top: 48px; }
.hero h1 { font-size: clamp(44px, 7.4vw, 88px); line-height: 0.95; font-weight: 800; letter-spacing: -0.035em; max-width: 9ch; }
.hero .subtitle { font-size: 19px; line-height: 1.45; color: var(--on-navy); margin: 22px 0 0; max-width: 34em; font-weight: 600; }
.hero .tagline { margin: 16px 0 0; font-family: var(--f-display); font-weight: 600; font-size: 20px; color: var(--hl); }
.hero .lead { margin: 14px 0 0; color: var(--on-navy-soft); max-width: 36em; }
.cover { margin: 0; }
.cover img { border-radius: 4px; box-shadow: 0 30px 60px -24px rgb(0 0 0 / 0.6), 0 0 0 1px rgb(255 255 255 / 0.06); }

.kit { margin-top: 30px; background: var(--paper); color: var(--ink); border-radius: 12px; padding: 22px 24px; max-width: 560px; border-top: 6px solid var(--orange); }
.kit .kit-name { font-family: var(--f-display); font-weight: 700; font-size: 18px; line-height: 1.3; margin: 0 0 8px; }
.kit .price { margin: 0; color: var(--slate); font-size: 15px; }
.kit .price strong { color: var(--ink); font-family: var(--f-display); font-size: 20px; margin-right: 2px; }
.actions { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: center; margin-top: 16px; }
.btn { display: inline-flex; align-items: center; justify-content: center; font: 600 16px/1 var(--f-body); padding: 14px 22px; border-radius: 8px; border: 2px solid var(--orange); background: var(--orange); color: var(--btn-text); text-decoration: none; cursor: pointer; }
.btn:hover { background: var(--orange-hover); border-color: var(--orange-hover); }
.btn[disabled] { opacity: 0.6; cursor: progress; }
.btn.quiet { background: transparent; color: var(--ink); border-color: var(--line); }
.btn.quiet:hover { border-color: var(--ink); }
.on-navy .btn.quiet { color: var(--on-navy); border-color: var(--navy-line); }
.on-navy .btn.quiet:hover { border-color: var(--on-navy); }

/* ---------- bölümler ---------- */
.sec { padding-block: 72px; }
.sec + .sec { padding-top: 0; }
.sec.mist { background: var(--mist); padding-top: 72px; }
.sec.mist + .sec:not(.mist) { padding-top: 72px; }
.sec-head { max-width: 640px; margin-bottom: 28px; }
.sec-head p { color: var(--slate); margin: 10px 0 0; }

/* hesap şeridi: kitabın 1. bölümündeki formül */
.sum { margin-top: -40px; position: relative; }
.sum .sheet { background: var(--paper); border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 18px 40px -28px rgb(23 37 29 / 0.45); padding: 26px 28px; display: grid; grid-template-columns: 1fr auto; gap: 18px 32px; align-items: end; }
.sum h2 { font-size: 22px; letter-spacing: -0.01em; }
.sum .hint { color: var(--slate); font-size: 15px; margin: 6px 0 0; }
.sum .calc { display: flex; flex-wrap: wrap; align-items: end; gap: 10px 14px; grid-column: 1 / -1; font-family: var(--f-mono); font-size: 16px; }
.sum label { display: grid; gap: 4px; font-family: var(--f-body); font-size: 13px; color: var(--slate); }
.sum input { font: 500 22px/1 var(--f-mono); color: var(--ink); width: 5.2ch; padding: 10px 8px; border: 1.5px solid var(--line); border-radius: 8px; background: var(--tint); text-align: center; }
.sum input:focus { border-color: var(--orange); outline: none; box-shadow: 0 0 0 3px rgb(168 50 92 / 0.25); }
.sum .op { padding-bottom: 12px; color: var(--slate); }
.sum output { font: 600 18px/1 var(--f-body); color: var(--slate); padding: 8px 0; }
.sum output b { font-family: var(--f-display); font-weight: 800; font-size: 40px; color: var(--orange-ink); letter-spacing: -0.02em; }

/* paket içeriği: kitaptaki kontrol listesi biçimi */
.checklist { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 0 40px; }
.checklist li { position: relative; padding: 16px 0 16px 38px; border-top: 1px solid var(--line); }
.checklist li::before { content: ""; position: absolute; left: 0; top: 19px; width: 20px; height: 20px; border: 2px solid var(--orange); border-radius: 4px; }
.checklist li::after { content: ""; position: absolute; left: 6px; top: 22px; width: 7px; height: 11px; border: solid var(--orange-ink); border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
.checklist strong { display: block; font-family: var(--f-display); font-weight: 700; font-size: 18px; }

/* kitabın içinden */
.pages { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 22px; margin: 0; padding: 0; list-style: none; }
.pages figure { margin: 0; }
.pages img { border-radius: 3px; box-shadow: 0 1px 0 var(--line), 0 14px 30px -20px rgb(23 37 29 / 0.5); background: #fff; }
.pages figcaption { font-size: 14px; color: var(--slate); margin-top: 10px; }
.pages-scroll { overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 6px; }

/* adımlar: Measure → Decide → Build */
.phases { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border-top: 3px solid var(--ink); }
.phase { padding: 18px 22px 0 0; }
.phase + .phase { padding-left: 22px; border-left: 1px solid var(--line); }
.phase h3 { font-size: 15px; color: var(--orange-ink); font-weight: 700; margin-bottom: 10px; }
.phase ol { margin: 0; padding: 0; list-style: none; }
.phase li { display: grid; grid-template-columns: 30px 1fr; gap: 6px; margin-bottom: 14px; }
.phase li span { font-family: var(--f-display); font-weight: 800; color: var(--ink); }

/* kimin için */
.fit { display: grid; grid-template-columns: 3fr 2fr; gap: 40px; }
.fit ul { margin: 0; padding-left: 20px; }
.fit li { margin-bottom: 8px; }
.fit .not { background: var(--mist); border-radius: 12px; padding: 20px 22px; color: var(--slate); align-self: start; }

/* içindekiler: kitaptaki tablo */
.toc { list-style: none; margin: 0; padding: 0; border-top: 2px solid var(--ink); max-width: 760px; }
.toc li { padding: 11px 0; border-bottom: 1px solid var(--line); font-variant-numeric: tabular-nums; }
.toc li.appx { color: var(--slate); }

/* Skytek ekibi: kitaptaki kendi örneklerimiz */
.team { display: grid; grid-template-columns: minmax(0, 3fr) minmax(0, 2fr); gap: 48px; align-items: start; }
.team h2 { margin-bottom: 16px; }
.team p { max-width: 62ch; }
.our-list { margin: 8px 0 0; background: var(--paper); border: 1px solid var(--line); border-radius: 12px; padding: 18px 20px; }
.our-list figcaption { font-size: 14px; color: var(--slate); margin-bottom: 10px; }
.our-list table { width: 100%; border-collapse: collapse; font-size: 15px; }
.our-list th, .our-list td { text-align: left; padding: 9px 0; border-bottom: 1px solid var(--line); vertical-align: top; }
.our-list th { font-weight: 600; color: var(--slate); font-size: 13px; }
.our-list td:last-child, .our-list th:last-child { text-align: right; padding-left: 16px; white-space: nowrap; }
.our-list td:last-child { font-family: var(--f-display); font-weight: 800; font-size: 20px; color: var(--orange-ink); }
.our-list tr:last-child td { border-bottom: 0; }

/* sorular */
.faq { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 48px; max-width: 980px; }
.faq div { padding: 16px 0; border-top: 1px solid var(--line); }
.faq h3 { margin-bottom: 6px; }
.faq p { color: var(--slate); margin: 0; }

/* kapanış: ikinci satın alma noktası */
.closing { background: var(--navy); color: var(--on-navy); padding-block: 56px; }
.closing .grid { display: grid; grid-template-columns: 140px minmax(0, 1fr); gap: 32px; align-items: center; max-width: 760px; }
.closing img { border-radius: 3px; box-shadow: 0 18px 30px -18px rgb(0 0 0 / 0.7); }
.closing .kit-name { font-family: var(--f-display); font-weight: 700; font-size: 22px; line-height: 1.25; margin: 0 0 8px; }
.closing .price { color: var(--on-navy-soft); margin: 0; }
.closing .price strong { color: var(--on-navy); }

.updates { padding-block: 48px; }
.updates p { color: var(--slate); }

/* ---------- iç sayfalar (yasal, /thanks, /template) ---------- */
.page-head { background: var(--h-green); color: #f4f6f2; padding: 40px 0 48px; }
.page-head .eyebrow { color: #c9d8cd; font-size: 15px; text-decoration: none; }
.page-head h1 { font-size: clamp(34px, 5vw, 52px); line-height: 1.02; font-weight: 800; letter-spacing: -0.03em; margin-top: 8px; max-width: 18ch; }
.page-head .lead { color: #d3dfd6; max-width: 40em; margin: 14px 0 0; }
.legal { padding-block: 36px 24px; }
.legal > * { max-width: 760px; }
.legal .updated { color: var(--slate); margin: 0 0 18px; }
.legal p, .legal li { max-width: 70ch; }
.legal ul { padding-left: 20px; margin: 0 0 14px; }
.legal a { color: var(--h-wine); }
.tbl-wrap { overflow-x: auto; margin: 4px 0 18px; border: 1px solid var(--line); border-radius: 10px; }
.tbl-wrap table { width: 100%; border-collapse: collapse; font-size: 15px; min-width: 480px; }
.tbl-wrap th, .tbl-wrap td { text-align: left; padding: 10px 14px; border-bottom: 1px solid var(--line); vertical-align: top; }
.tbl-wrap th { background: var(--mist); font-weight: 600; }
.tbl-wrap tr:last-child td { border-bottom: 0; }
.inner { padding-block: 36px 24px; }
.inner > * { max-width: 760px; }
.inner .kit { margin-top: 0; border: 1px solid var(--line); border-top: 6px solid var(--orange); }
.inner .note { margin-top: 18px; color: var(--slate); }

/* ---------- alt bilgi ---------- */
.foot { background: var(--h-green); color: #c9d8cd; font-size: 14px; padding-block: 44px 40px; }
.foot a { color: #eef3ee; text-decoration: none; }
.foot a:hover { text-decoration: underline; }
.foot .cols { display: grid; grid-template-columns: 1.4fr repeat(3, 1fr); gap: 28px; margin-bottom: 28px; }
.foot .cols h2 { font: 600 13.5px/1.3 var(--f-body); color: #9fb8a7; margin: 0 0 10px; letter-spacing: 0; }
.foot .cols ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 15px; }
.foot .brand { color: #f4f6f2; }
.foot .fine { border-top: 1px solid #2f6149; padding-top: 18px; }
.foot .fine p { margin: 0 0 8px; max-width: 90ch; }
.foot .links { display: flex; flex-wrap: wrap; gap: 4px 10px; }

/* ---------- dar ekranlar ---------- */
@media (max-width: 900px) {
  .hero .grid { grid-template-columns: minmax(0, 1fr) 220px; gap: 28px; }
  .pages { grid-template-columns: repeat(4, 220px); }
  .phases { grid-template-columns: 1fr; }
  .phase + .phase { border-left: 0; padding-left: 0; border-top: 1px solid var(--line); }
  .faq, .fit, .checklist, .team { grid-template-columns: 1fr; }
  .foot .cols { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  body { font-size: 16px; }
  .wrap { padding-inline: 18px; }
  .hero .grid { grid-template-columns: 1fr; padding-top: 22px; }
  .cover { order: -1; max-width: 160px; }
  .hero { padding-bottom: 60px; }
  .kit { padding: 18px; }
  .sum .sheet { grid-template-columns: 1fr; padding: 20px; }
  .sec, .sec.mist, .sec.band { padding-block: 52px; }
  .sec + .sec:not(.mist) { padding-top: 0; }
  .sec.mist + .sec:not(.mist) { padding-top: 52px; }
  .closing .grid { grid-template-columns: 90px minmax(0, 1fr); gap: 18px; }
  .site-nav { font-size: 14.5px; gap: 2px 16px; }
  .site-nav .legal-nav { width: 100%; padding-left: 0; border-left: 0; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; transition: none !important; } }

/* mobil alt satın alma çubuğu: giriş ve kapanış kutuları görünmezken çıkar */
.buybar { display: none; }
@media (max-width: 640px) {
  .buybar:not([hidden]) { display: flex; position: fixed; left: 0; right: 0; bottom: 0; z-index: 10; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 18px calc(10px + env(safe-area-inset-bottom)); background: var(--navy); color: var(--on-navy); font-family: var(--f-display); font-weight: 700; box-shadow: 0 -8px 24px -12px rgb(0 0 0 / 0.5); }
  .buybar .btn { padding: 11px 16px; font-size: 15px; }
  .foot { padding-bottom: 96px; }
}

/* ======================= yayınevi sayfaları ======================= */
.house { --ink: var(--h-ink); --slate: var(--h-slate); --line: var(--h-line); --mist: var(--h-mist); }
.house a { color: var(--h-wine); }
.house .feature, .house .feature:hover { color: #f3f5fa; }
.sec.band { padding-top: 72px; }
.house .btn { background: var(--h-wine); border-color: var(--h-wine); color: #fff; }
.house .btn:hover { background: #722747; border-color: #722747; }
.house .btn.quiet { background: transparent; color: var(--h-ink); border-color: var(--h-line); }
.house .btn.quiet:hover { border-color: var(--h-ink); }

/* ana sayfa girişi: yayınevinin ne yaptığı + öne çıkan ürün */
.h-hero { padding: 64px 0 56px; border-bottom: 1px solid var(--h-line); }
.h-hero .grid { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 56px; align-items: center; }
.h-hero h1 { font-size: clamp(38px, 5.6vw, 66px); line-height: 1.0; font-weight: 800; letter-spacing: -0.03em; color: var(--h-green); max-width: 14ch; }
.h-hero .lead { font-size: 18.5px; color: var(--h-slate); margin: 20px 0 0; max-width: 36em; }
.h-hero .actions { margin-top: 26px; }

/* öne çıkan ürün kartı: ürünün kendi renkleriyle */
.feature { display: grid; grid-template-columns: 150px minmax(0, 1fr); gap: 22px; align-items: center; background: var(--p-bg, var(--navy)); color: #f3f5fa; border-radius: 14px; padding: 22px; text-decoration: none; }
.feature img { border-radius: 3px; box-shadow: 0 18px 30px -16px rgb(0 0 0 / 0.6); }
.feature .kind { font-size: 13.5px; color: var(--on-navy-soft); margin: 0 0 4px; }
.feature h2 { font-size: 26px; line-height: 1.08; }
.feature p { color: var(--on-navy-soft); font-size: 15px; margin: 8px 0 0; }
.feature .row { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-top: 14px; }
.feature .price { font-family: var(--f-display); font-weight: 800; font-size: 22px; color: #fff; }
.feature .more { color: var(--hl); font-weight: 600; }

/* raflar: kitaplar, şablonlar, ücretsiz araçlar */
.shelves { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.shelf h3 { font-size: 20px; color: var(--h-green); display: flex; justify-content: space-between; align-items: baseline; border-bottom: 2px solid var(--h-green); padding-bottom: 8px; margin-bottom: 4px; }
.shelf h3 a { color: inherit; text-decoration: none; }
.shelf h3 small { font: 500 14px/1 var(--f-body); color: var(--h-slate); }
.shelf ul { list-style: none; margin: 0; padding: 0; }
.shelf li a { display: grid; grid-template-columns: 44px 1fr; gap: 12px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--h-line); text-decoration: none; color: var(--h-ink); }
.shelf li img { width: 44px; border-radius: 2px; box-shadow: 0 4px 10px -6px rgb(0 0 0 / 0.5); }
.shelf li .t { font-weight: 600; display: block; line-height: 1.3; }
.shelf li .m { font-size: 13.5px; color: var(--h-slate); }
.shelf .icon { width: 44px; height: 44px; border-radius: 8px; background: var(--h-wine-soft); display: grid; place-items: center; font: 800 18px/1 var(--f-display); color: var(--h-wine); }

/* söz listesi: nasıl yayımlıyoruz */
.promises { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0 28px; }
.promises li { border-top: 3px solid var(--h-wine); padding-top: 14px; }
.promises strong { display: block; font-family: var(--f-display); font-size: 18px; color: var(--h-ink); margin-bottom: 6px; }
.promises span { color: var(--h-slate); font-size: 15.5px; }

.band { background: var(--h-mist); }
.band.wine { background: var(--h-wine-soft); }

/* sürüm günlüğü */
.log { list-style: none; margin: 0; padding: 0; max-width: 760px; }
.log li { display: grid; grid-template-columns: 150px 1fr; gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--h-line); }
.log time { color: var(--h-slate); font-variant-numeric: tabular-nums; }

/* katalog kartları */
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 28px; list-style: none; margin: 0; padding: 0; }
.card a { display: block; text-decoration: none; color: var(--h-ink); }
.card .art { background: var(--h-mist); border-radius: 10px; padding: 22px; display: grid; place-items: center; aspect-ratio: 4 / 4.4; }
.card .art img { max-height: 100%; width: auto; border-radius: 3px; box-shadow: 0 16px 28px -16px rgb(0 0 0 / 0.55); }
.card .chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 14px 0 8px; }
.chip { font-size: 12.5px; padding: 3px 9px; border-radius: 99px; background: var(--h-mist); color: var(--h-slate); border: 1px solid var(--h-line); }
.chip.kind { background: var(--h-wine-soft); color: var(--h-wine); border-color: transparent; font-weight: 600; }
.card h2 { font-size: 21px; line-height: 1.2; letter-spacing: -0.01em; }
.card p { color: var(--h-slate); font-size: 15px; margin: 6px 0 0; }
.card .price { font-family: var(--f-display); font-weight: 800; margin-top: 10px; display: block; }
.empty-note { color: var(--h-slate); max-width: 60ch; }

/* araç sayfası */
.tool .sum { margin-top: 0; }
.tool .sum .sheet { box-shadow: none; }
.tool .sum input { background: var(--h-wine-soft); }
.tool .sum output b { color: var(--h-wine); }
.prose > * { max-width: 70ch; }
.prose h2 { font-size: 26px; margin: 32px 0 10px; }

@media (max-width: 900px) {
  .h-hero .grid { grid-template-columns: 1fr; gap: 32px; }
  .shelves, .promises { grid-template-columns: 1fr; gap: 24px; }
  .log li { grid-template-columns: 1fr; gap: 2px; }
}
@media (max-width: 640px) {
  .h-hero { padding: 36px 0 40px; }
  .feature { grid-template-columns: 96px minmax(0, 1fr); gap: 16px; padding: 16px; }
  .feature h2 { font-size: 21px; }
}

/* ======================= mağaza formu (Türkçe /magaza ile aynı düzen, Skytek yeşil/bordo) ======================= */
.announce { display: block; margin: 18px 0 0; padding: 12px 16px; border: 1px solid #e3cfd8; background: var(--h-wine-soft); border-radius: 10px; color: var(--h-ink); text-decoration: none; font-size: 15px; }
.house a.announce { color: var(--h-ink); }
.announce strong { color: var(--h-wine); }
.announce:hover { border-color: var(--h-wine); }

.shop-hero { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 48px; align-items: center; padding-block: 48px 40px; }
.shop-hero h1 { font-size: clamp(36px, 5.2vw, 60px); line-height: 1.02; font-weight: 800; letter-spacing: -0.03em; color: var(--h-ink); max-width: 15ch; }
.shop-hero h1 em { font-style: normal; color: var(--h-green-2); }
.shop-hero .lead { color: var(--h-slate); font-size: 17px; margin: 18px 0 0; max-width: 40em; }
.shop-hero .actions { margin-top: 24px; }
.assure { list-style: none; margin: 18px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 20px; font-size: 14px; color: var(--h-slate); }
.assure li::before { content: "✓"; color: var(--h-green-2); font-weight: 700; margin-right: 6px; }

.spot { position: relative; display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 20px; align-items: center; background: var(--h-mist); border: 1px solid var(--h-line); border-radius: 14px; padding: 26px 22px 22px; text-decoration: none; color: var(--h-ink); }
.house a.spot { color: var(--h-ink); }
.spot:hover { border-color: var(--h-green-2); }
.spot img { border-radius: 3px; box-shadow: 0 14px 26px -14px rgb(0 0 0 / 0.55); }
.spot-tag { position: absolute; top: -12px; left: 18px; background: var(--h-wine); color: #fff; font-size: 12.5px; font-weight: 600; padding: 3px 10px; border-radius: 99px; }
.spot-body { display: grid; gap: 8px; }
.spot-body b { font-family: var(--f-display); font-size: 20px; line-height: 1.15; }
.spot-body > span:not(.btn) { color: var(--h-slate); font-size: 14.5px; }
.spot-price { font-family: var(--f-display); font-weight: 800; font-size: 24px; color: var(--h-ink) !important; }
.spot .btn { justify-self: start; }

.filters { display: flex; flex-wrap: wrap; gap: 10px; padding-bottom: 18px; border-bottom: 1px solid var(--h-line); }
.chip { font: 500 15px/1 var(--f-body); padding: 11px 18px; border-radius: 99px; border: 1px solid var(--h-line); background: #fff; color: var(--h-ink); cursor: pointer; }
.chip .n { color: var(--h-slate); margin-left: 6px; }
.chip[aria-pressed="true"] { background: var(--h-green); border-color: var(--h-green); color: #fff; }
.chip[aria-pressed="true"] .n { color: #c9d8cd; }
.kind { margin-top: 30px; padding-bottom: 8px; border-bottom: 2px solid var(--h-ink); }
.kind h3 { font-size: 24px; }
.kind p { color: var(--h-slate); margin: 4px 0 0; font-size: 15px; }
.cat { margin-top: 24px; }
.cat-head h3 { font-size: 15px; text-transform: uppercase; letter-spacing: 0.06em; color: var(--h-green-2); }
.cat-head p { color: var(--h-slate); font-size: 14.5px; margin: 4px 0 14px; }
.grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 20px; }
.card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--h-line); border-radius: 12px; overflow: hidden; }
.card .thumb { display: grid; place-items: center; background: var(--h-mist); padding: 18px; height: 210px; }
.card .thumb { overflow: hidden; }
.card .thumb img { max-height: 174px; height: auto; width: auto; max-width: 100%; border-radius: 3px; box-shadow: 0 12px 22px -14px rgb(0 0 0 / 0.55); }
.card-body { display: flex; flex-direction: column; gap: 10px; padding: 18px; flex: 1; }
.card-body h4 { margin: 0; font-family: var(--f-display); font-size: 19px; line-height: 1.2; }
.house .card-body h4 a { color: var(--h-ink); text-decoration: none; }
.card-body > p { color: var(--h-slate); font-size: 14.5px; margin: 0; }
.meta { display: flex; flex-wrap: wrap; gap: 6px; }
.tag { font-size: 12.5px; font-weight: 600; padding: 4px 10px; border-radius: 99px; background: var(--h-mist); color: var(--h-slate); }
.tag.hot { background: var(--h-wine-soft); color: var(--h-wine); }
.tag.fast { background: #e3efe7; color: #1f6b4a; }
.card-foot { margin-top: auto; display: flex; flex-wrap: wrap; align-items: end; justify-content: space-between; gap: 12px; padding-top: 8px; }
.pr { font-family: var(--f-display); font-weight: 800; font-size: 24px; color: var(--h-ink); line-height: 1.1; }
.pr small { display: block; font: 400 12.5px/1.3 var(--f-body); color: var(--h-slate); }
.acts { display: flex; flex-wrap: wrap; gap: 6px; }
.btn.sm { padding: 10px 14px; font-size: 14.5px; }
.house .btn.ghost { background: #fff; color: var(--h-ink); border-color: var(--h-line); }
.house .btn.ghost:hover { border-color: var(--h-ink); }

.steps { list-style: none; counter-reset: s; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.steps li { counter-increment: s; background: #fff; border: 1px solid var(--h-line); border-radius: 12px; padding: 18px; }
.steps li::before { content: counter(s); display: block; font-family: var(--f-display); font-weight: 800; color: var(--h-wine); margin-bottom: 6px; }
.steps b { display: block; margin-bottom: 4px; }
.steps span { color: var(--h-slate); font-size: 15px; }

/* İncele penceresi */
#det { width: min(680px, calc(100vw - 24px)); max-height: calc(100vh - 40px); padding: 0; border: 0; border-radius: 14px; box-shadow: 0 30px 80px -20px rgb(0 0 0 / 0.5); }
#det::backdrop { background: rgb(23 37 29 / 0.55); }
.det-head { position: sticky; top: 0; display: flex; justify-content: flex-end; padding: 8px; background: #fff; }
.det-x { font-size: 26px; line-height: 1; width: 40px; height: 40px; border: 0; background: var(--h-mist); border-radius: 99px; cursor: pointer; color: var(--h-ink); }
.det-body { padding: 0 24px 24px; display: grid; gap: 14px; }
.det-cover { max-height: 220px; width: auto; justify-self: start; border-radius: 3px; box-shadow: 0 12px 22px -14px rgb(0 0 0 / 0.55); }
.det-body h3 { font-size: 24px; margin-bottom: 8px; }
.det-body h4 { margin: 14px 0 6px; font-size: 15px; color: var(--h-green-2); text-transform: uppercase; letter-spacing: 0.05em; }
.det-body p, .det-body li { color: var(--h-slate); font-size: 15px; }
.det-body ul, .det-body ol { padding-left: 20px; margin: 0; }
.det-foot { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: end; gap: 12px; border-top: 1px solid var(--h-line); padding-top: 14px; }
#det a { color: var(--h-wine); }
#det .btn { background: var(--h-wine); border-color: var(--h-wine); color: #fff; }
#det .btn.ghost { background: #fff; color: var(--h-ink); border-color: var(--h-line); }

@media (max-width: 900px) {
  .shop-hero { grid-template-columns: 1fr; gap: 32px; }
  .steps { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .shop-hero { padding-block: 28px 24px; }
  .spot { grid-template-columns: 92px minmax(0, 1fr); padding: 22px 16px 16px; }
  .chip { padding: 9px 14px; font-size: 14px; }
}

/* ======================= renk güçlendirme (rakipler: Someka, Vertex42, Spreadsheet123 marka rengini yüzey olarak kullanıyor) =======================
   Koyu yeşil üst çubuk ve giriş bandı, bordo duyuru şeridi, belirgin yeşil-gri katalog zemini üstünde beyaz kartlar. */
:root {
  /* daha canlı, logodaki yeşil: koyu-donuk #1f4d38 yerine #1f6b4a */
  --h-green: #1f6b4a; --h-green-2: #26875c; --h-green-deep: #175539;
  --navy: #1f6b4a; --navy-2: #24784f; --navy-line: #3f8a66; --on-navy-soft: #d4e8db;
  --hl: #b8e6c8; --orange: #7a2443; --orange-hover: #8f2c50; --orange-ink: #6a1f3a;
  --h-mist: #e2efe6; --h-wine-soft: #f3e2ea; --mist: #e2efe6; --h-line: #c4d9ca; --line: #c4d9ca; --h-mint: #b8e6c8;
}
.top { background: var(--h-green-deep); color: #f4f6f2; border-bottom: 1px solid #2a7a55; }
.site-nav a { color: #d3dfd6; }
.site-nav a:hover { color: #fff; }
.site-nav a[aria-current="page"] { color: #fff; box-shadow: inset 0 -2px 0 var(--h-mint); }
.site-nav .legal-nav { border-left-color: #3f8a66; }
.site-nav .legal-nav a { color: #b9cdbf; }

/* duyuru: tam genişlik bordo şerit */
.announce { margin-top: 0; border: 0; border-radius: 0; background: var(--h-wine); color: #fbeef3; padding: 11px 0; box-shadow: 0 0 0 100vmax var(--h-wine); clip-path: inset(0 -100vmax); }
.house a.announce { color: #fbeef3; }
.announce strong { color: #fff; }
.announce:hover { text-decoration: underline; }

/* ana sayfa girişi: tam genişlik koyu yeşil bant */
.shop-hero { background: var(--h-green); box-shadow: 0 0 0 100vmax var(--h-green); clip-path: inset(0 -100vmax); color: #f4f6f2; padding-block: 56px 60px; }
.shop-hero h1 { color: #fff; }
.shop-hero h1 em { color: var(--h-mint); }
.shop-hero .lead, .assure { color: #d3dfd6; }
.assure li::before { color: var(--h-mint); }
.house .shop-hero .btn { background: #fff; border-color: #fff; color: var(--h-green); }
.house .shop-hero .btn:hover { background: var(--h-mint); border-color: var(--h-mint); }
.house .shop-hero .btn.quiet { background: transparent; color: #fff; border-color: rgb(255 255 255 / 0.45); }
.house .shop-hero .btn.quiet:hover { border-color: #fff; background: transparent; }
.shop-hero .spot { background: #fff; border-color: #fff; box-shadow: 0 24px 50px -24px rgb(0 0 0 / 0.55); }
.house .shop-hero .spot .btn { background: var(--h-wine); border-color: var(--h-wine); color: #fff; }

/* katalog: yeşil-gri zemin, beyaz kartlar */
#catalog { background: var(--h-mist); }
.chip { border-color: #b7c9bc; }
.chip:hover { border-color: var(--h-green); }
.kind { border-bottom: 3px solid var(--h-green); }
.kind h3 { color: var(--h-green); }
.card { border-color: #c9d6cc; box-shadow: 0 1px 0 #c9d6cc; }
.card:hover { border-color: var(--h-green-2); }
.card .thumb { background: linear-gradient(160deg, #2c6a4c, #1f4d38); }
.steps li { border-top: 4px solid var(--h-wine); }
.steps li::before { display: inline-grid; place-items: center; width: 30px; height: 30px; border-radius: 99px; background: var(--h-wine); color: #fff; font-size: 15px; }
.band { background: var(--h-mist); }

/* iç sayfa başlığı ile üst çubuk arasında ayrım */
.page-head, .hero { border-top: 0; }
.foot { background: var(--h-green-deep); }
.foot .fine { border-top-color: #2a7a55; }
.page-head .lead, .shop-hero .lead, .assure { color: #e1efe6; }

/* ======================= ana kimlikle hizalama (skytekteknoloji.com: siyaha yakın yeşil + gümüş degrade) ======================= */
:root {
  --h-green-deep: #0f1c15;
  --silver: linear-gradient(135deg, #f4f5f7 0%, #c9cfd6 50%, #8f96a0 100%);
  --silver-2: linear-gradient(135deg, #e4e7eb 0%, #b7bcc4 55%, #7d838b 100%);
  --deep-green: radial-gradient(120% 150% at 88% 0%, #2a8a5e 0%, #1f6b4a 30%, #143d2b 65%, #0f1c15 100%);
}
.top { background: var(--h-green-deep); border-bottom: 1px solid rgb(201 207 214 / 0.14); }
.site-nav a { color: #c9cfd6; }
.site-nav .legal-nav a { color: #9aa0a8; }
.site-nav .legal-nav { border-left-color: rgb(201 207 214 / 0.2); }
.site-nav a[aria-current="page"] { box-shadow: inset 0 -2px 0 #c9cfd6; }
.foot { background: var(--h-green-deep); color: #9aa0a8; }
.foot .fine { border-top-color: rgb(201 207 214 / 0.14); }
.foot .cols h2 { color: #c9cfd6; }

/* gümüş yazı logo: degrade metin, "Press" bir ton koyu; üstüne gelince gümüş çizgi açılır */
.brand.on-dark .wm { background: var(--silver); -webkit-background-clip: text; background-clip: text; color: transparent; }
.brand.on-dark .wm em { position: relative; background: var(--silver-2); -webkit-background-clip: text; background-clip: text; color: transparent; padding-bottom: 0; transition: none; }
.brand.on-dark .wm em::after { content: ""; position: absolute; left: 0; bottom: -3px; height: 2px; width: 0; background: var(--silver); transition: width .35s ease; }
.brand.on-dark:hover .wm em::after, .brand.on-dark:focus-visible .wm em::after { width: 100%; }
@media (prefers-reduced-motion: reduce) { .brand.on-dark .wm em::after { transition: none; } }

/* koyu, derin yeşil bantlar (logo yeşilinden ışık) */
.page-head, .hero { background: var(--deep-green); }
.shop-hero { background: none; box-shadow: none; clip-path: none; border-image: var(--deep-green) fill 0 / / 0 100vmax; }
.card .thumb { background: var(--deep-green); }
/* liste sayfaları (/books, /templates, /tools): yeşil-gri zemin, kartlarda derin yeşil görsel alanı */
.page-head + .sec:has(.cards) { background: var(--h-mist); }
.cards .card .art { background: var(--deep-green); }

/* gümüş yazı logo, 3 boyutlu: yukarıdan ışık alan krom degrade + katmanlı gölge (degrade metinde text-shadow içten görünür, bu yüzden drop-shadow) */
.brand.on-dark .wm, .brand.on-dark .wm em {
  background: linear-gradient(180deg, #ffffff 0%, #e6e9ed 38%, #a4abb4 52%, #d3d8de 72%, #f1f3f5 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.brand.on-dark .wm em { background: linear-gradient(180deg, #f1f3f5 0%, #cfd4da 38%, #8b929b 52%, #b9bfc6 72%, #dde1e5 100%); -webkit-background-clip: text; background-clip: text; }
.brand.on-dark .wm { filter: drop-shadow(0 1px 0 #6b7179) drop-shadow(0 1px 0 #4a4f55) drop-shadow(0 3px 4px rgb(0 0 0 / 0.55)); }
.brand.on-dark img { filter: drop-shadow(0 2px 3px rgb(0 0 0 / 0.5)); }

/* "Free:" şeridi gümüş (tam genişlik degrade) */
.announce { background: none; box-shadow: none; clip-path: none; border-image: linear-gradient(180deg, #f4f5f7 0%, #d5dadf 55%, #b7bcc4 100%) fill 0 / / 0 100vmax; color: #17251d; }
.house a.announce { color: #17251d; }
.announce strong { color: #0f1c15; }

/* üst menü daha belirgin */
.site-nav a { color: #f1f3f5; font-weight: 500; }
.site-nav a:hover { color: #fff; }
.site-nav .legal-nav a { color: #d5dadf; font-weight: 500; }
.site-nav .legal-nav a:hover { color: #fff; }
.site-nav .legal-nav { border-left-color: rgb(201 207 214 / 0.3); }