/* Yılmaz Dijital arayüz katmanı (v3). En son yüklenir; önceki katmanların (style, editorial, depth, premium)
   kart, katalog ve ürün sayfası görünümünü tek bir düzene bağlar. */
:root{
  --ui-ink:#0b1224;--ui-text:#3b4762;--ui-mute:#6b7690;--ui-line:#e5e9f2;--ui-soft:#f4f6fb;
  --ui-a:#5b5bf7;--ui-a-soft:#eef0ff;--ui-ok:#12a150;--ui-ok-soft:#e8f7ee;
  --ui-r:18px;--ui-r2:12px;
  --ui-sh:0 1px 2px rgba(16,24,48,.05),0 10px 26px -12px rgba(16,24,48,.16);
  --ui-sh-h:0 2px 4px rgba(16,24,48,.06),0 24px 48px -16px rgba(40,52,130,.30);
}

/* ---------- Ürün ızgaraları ---------- */
html body .product-grid,
html body .catalog-shell .product-grid,
html body .product-grid.collection-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 22px}
html body .product-grid.hl-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:22px 18px}
html body .catalog-shell{grid-template-columns:230px minmax(0,1fr);gap:32px}

/* ---------- Ürün kartı: tek çerçeve, sade gövde ---------- */
html body .product-card{display:flex;flex-direction:column;padding:0;border:1px solid var(--ui-line);border-radius:var(--ui-r);background:#fff;box-shadow:var(--ui-sh)}
html body .product-card:hover{box-shadow:var(--ui-sh-h);border-color:#cdd4ff}
html body .product-card-cover{display:block;padding:0;margin:0;background:none;border:0;border-radius:0;box-shadow:none}
html body .product-card-cover:hover{background:none}
html body .product-card .product-cover{border:0;border-radius:0;box-shadow:none;aspect-ratio:16/10}
html body .product-card .product-cover--screen img{width:100%;height:100%;object-fit:cover;object-position:top center}
html body .product-body{padding:16px 18px 18px}
html body .product-card .product-category{font-size:10.5px;font-weight:700;letter-spacing:.12em;margin-bottom:6px}
html body .product-card .product-title{font-size:16.5px;line-height:1.35;margin:0 0 4px;min-height:2.7em}
html body .product-card .card-detail-link{display:none}
html body .product-footer{margin-top:auto;padding-top:14px;border-top:1px solid var(--ui-line)}
html body .product-card .product-price{font-size:19px;font-weight:800;letter-spacing:-.02em;color:var(--ui-ink);-webkit-text-fill-color:var(--ui-ink)}
html body .product-card .product-price .kdv-note{font-size:11px;font-weight:600;color:var(--ui-mute);-webkit-text-fill-color:var(--ui-mute)}
html body .product-card .hl-from{display:block;font-size:11px;font-weight:600;color:var(--ui-mute);-webkit-text-fill-color:var(--ui-mute);letter-spacing:0}
html body .product-card-action{font-size:12.5px;font-weight:700;padding:9px 14px;border-radius:10px;background:var(--ui-a-soft);color:#3b3fd1}
html body .product-card-action:hover{background:var(--ui-a);color:#fff}
html body .product-card .product-badge{top:12px;left:12px;right:auto;font-size:10.5px;padding:5px 9px;border-radius:999px;background:rgba(11,18,36,.78);color:#fff;backdrop-filter:blur(6px)}
html body .product-card .hl-options-badge{left:auto;right:12px;background:#fff;color:var(--ui-ink);box-shadow:0 4px 14px rgba(0,0,0,.18)}

/* ---------- Abonelik/lisans görselleri: logo, kendi renginden yayılan ışıkla koyu zeminde ---------- */
html body .product-cover--photo{position:relative;display:grid;place-items:center;overflow:hidden;aspect-ratio:16/10;
  background:radial-gradient(120% 95% at 50% 0%,#262055 0%,#12142b 58%,#0b0d1c 100%)}
html body .product-cover--photo .cover-aura{position:absolute;inset:-20%;background-repeat:no-repeat;background-position:center;background-size:55%;
  filter:blur(44px) saturate(1.9) brightness(1.25);opacity:.9;pointer-events:none}
html body .product-cover--photo img,
html body .product-card .product-cover--photo img{position:relative;z-index:1;width:auto;height:48%;max-width:48%;object-fit:contain;border-radius:22%;
  box-shadow:none;border-radius:0;filter:drop-shadow(0 16px 28px rgba(0,0,0,.55))}
html body .product-card:hover .product-cover--photo img{transform:scale(1.06)}

/* ---------- Katalog kenar çubuğu ---------- */
html body .catalog-sidebar{position:sticky;top:96px;align-self:start;padding:18px;background:#fff;border:1px solid var(--ui-line);border-radius:var(--ui-r);box-shadow:var(--ui-sh)}
html body .catalog-cat-link{border-radius:10px}

/* ---------- Ürün sayfası ---------- */
html body .product-detail{grid-template-columns:minmax(0,1fr) 360px;gap:32px}
html body .product-gallery{padding:0;margin-bottom:14px;background:none;border:0;box-shadow:none;border-radius:var(--ui-r)}
html body .product-gallery .product-cover{border-radius:var(--ui-r);border:1px solid var(--ui-line)}
html body .product-gallery .product-cover--photo{display:grid;place-items:center;aspect-ratio:16/9;border:0;background:radial-gradient(120% 95% at 50% 0%,#262055 0%,#12142b 58%,#0b0d1c 100%)}
html body .product-gallery .product-cover--photo .cover-aura{background-size:34%}
html body .product-gallery .product-cover--photo img{height:46%;max-width:34%}
html body .product-detail-sidebar .card{padding:24px;border:1px solid var(--ui-line);border-radius:var(--ui-r);box-shadow:var(--ui-sh)}
html body .product-detail-title{font-size:26px;line-height:1.25;letter-spacing:-.03em}
html body .product-detail-price{font-size:34px;font-weight:800;letter-spacing:-.03em;color:var(--ui-ink);margin:10px 0 4px}
html body .product-detail-price .kdv-note{font-size:13px;color:var(--ui-mute)}
html body .purchase-note{display:block;font-size:13px;line-height:1.6;color:var(--ui-mute)}

.buy-trust{list-style:none;margin:18px 0 0;padding:16px 0 0;border-top:1px solid var(--ui-line);display:grid;gap:12px}
.buy-trust li{display:flex;gap:12px;align-items:flex-start;font-size:12.5px;line-height:1.5;color:var(--ui-mute)}
.buy-trust li svg{flex:0 0 34px;width:34px;height:34px;padding:8px;border-radius:10px;background:var(--ui-a-soft);color:var(--ui-a);stroke:currentColor}
.buy-trust strong{display:block;font-size:13.5px;color:var(--ui-ink)}
.buy-support{display:flex;align-items:center;gap:10px;margin-top:16px;padding:12px 14px;border-radius:12px;background:var(--ui-ok-soft);color:#0d6b37;font-size:13px;text-decoration:none;border:1px solid #cdeedb;transition:background .2s}
.buy-support:hover{background:#d9f3e4}
.buy-support svg{color:#25d366;flex:0 0 auto}

/* ---------- Tablet ---------- */
@media (max-width:1180px){
  html body .catalog-shell .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  html body .product-grid.hl-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  html body .product-detail{grid-template-columns:minmax(0,1fr) 320px;gap:24px}
}
@media (max-width:900px){
  html body .product-grid,html body .product-grid.collection-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  html body .catalog-shell{grid-template-columns:1fr;gap:18px}
  html body .catalog-sidebar{position:static}
  html body .product-detail{grid-template-columns:1fr}
  html body .product-detail-sidebar{position:static}
}

/* ---------- Telefon: yazılımlar tek sütun, hesap/lisans kartları iki sütun ---------- */
@media (max-width:600px){
  html body .product-grid,html body .product-grid.collection-grid,html body .catalog-shell .product-grid{grid-template-columns:1fr;gap:16px}
  html body .product-grid:not(:has(.product-cover--screen)),
  html body .product-grid.hl-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  html body .product-grid:not(:has(.product-cover--screen)) .product-body,
  html body .product-grid.hl-grid .product-body{padding:11px 12px 13px}
  html body .product-grid:not(:has(.product-cover--screen)) .product-cover,
  html body .product-grid.hl-grid .product-cover{aspect-ratio:1/1}
  html body .product-grid:not(:has(.product-cover--screen)) .product-cover--photo img,
  html body .product-grid.hl-grid .product-cover--photo img{height:52%;max-width:52%}
  html body .product-grid:not(:has(.product-cover--screen)) .product-category,
  html body .product-grid.hl-grid .product-category{display:none}
  html body .product-grid:not(:has(.product-cover--screen)) .product-title,
  html body .product-grid.hl-grid .product-title{font-size:14px;min-height:2.7em}
  html body .product-grid:not(:has(.product-cover--screen)) .product-card-action,
  html body .product-grid.hl-grid .product-card-action{display:none}
  html body .product-grid:not(:has(.product-cover--screen)) .product-footer,
  html body .product-grid.hl-grid .product-footer{padding-top:10px}
  html body .product-grid:not(:has(.product-cover--screen)) .product-price,
  html body .product-grid.hl-grid .product-price{font-size:16px}
  html body .product-card .hl-options-badge{top:8px;right:8px;font-size:9.5px;padding:4px 7px}
  html body .product-detail-title{font-size:22px}
  html body .product-detail-price{font-size:28px}
}
@media (prefers-reduced-motion:reduce){html body .product-card:hover .product-cover--photo img{transform:none}}
/* Görseli olmayan araç ürünleri (ör. Chrome eklentisi): ürün sayfasında da koyu kapak */
html body .product-gallery .product-cover--tool{aspect-ratio:16/9;border:0;background:radial-gradient(420px 220px at 50% 35%,rgba(124,92,255,.35),transparent 70%),linear-gradient(160deg,#0d1426,#141d34)}
html body .product-gallery .product-cover--tool .tool-product-caption{color:#fff}

/* Kurulum formundaki onay kutusu metni tek paragraf olarak akar */
html body .hl-install-form .hl-check{display:block;position:relative;padding-left:28px;font-weight:400;line-height:1.55}
html body .hl-install-form .hl-check input{position:absolute;left:0;top:3px;margin:0}

/* Telefonda: görsel → satın alma kutusu → açıklama; arama kutusu tam genişlik */
@media (max-width:900px){
  html body .product-detail{display:flex;flex-direction:column;gap:16px}
  html body .product-detail-main{display:contents}
  html body .product-detail-main>*{width:100%;min-width:0}
  html body .product-detail-main>.product-gallery{order:1;margin-bottom:0}
  html body .product-detail-main>.preview-caption{order:2}
  html body .product-detail-sidebar{order:3;width:100%}
  html body .product-detail-main>*:not(.product-gallery):not(.preview-caption){order:4}
}
@media (max-width:600px){
  html body .catalog-search{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end}
  html body .catalog-search .catalog-search-field{grid-column:1/-1}
  html body .catalog-search .btn{width:100%;justify-content:center}
  html body .catalog-search:has(.btn-ghost){grid-template-columns:1fr 1fr}
}
/* Yazılım ürününde demo düğmesi yoksa "Sepete Ekle" tam genişlikte */
html body .product-detail-actions .btn:nth-child(2):last-child{grid-column:1/-1}

/* ================= Ana sayfa üst bölümü (hx) ================= */
html body .depth-intro .hx{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,1fr);gap:56px;align-items:center;padding:28px 0 36px}
html body .hx-eyebrow{display:inline-flex;align-items:center;gap:9px;padding:7px 13px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.05);color:#cfd7ef;font-size:11px;font-weight:700;letter-spacing:.14em}
html body .hx .status-dot{width:7px;height:7px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 4px rgba(34,197,94,.18)}
html body .depth-intro .hx h1{font-size:clamp(36px,4.2vw,58px);line-height:1.05;letter-spacing:-.045em;font-weight:800;color:#fff;margin:20px 0 18px;max-width:720px}
html body .hx-grad{background:linear-gradient(90deg,#8ea2ff 0%,#c084fc 55%,#67e8f9 100%);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}
html body .hx .depth-lead{font-size:17px;line-height:1.65;color:#b6c0da;max-width:560px;margin:0 0 26px}
html body .depth-intro .hx-search{max-width:560px;min-height:60px;padding:8px 8px 8px 18px;border-radius:16px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);box-shadow:0 20px 50px -24px rgba(0,0,0,.7)}
html body .depth-intro .hx-search input{font-size:15px;color:#fff}
html body .depth-intro .hx-search input::placeholder{color:#8f9bbb}
html body .depth-intro .hx-search>svg{color:#9fb0dd;width:18px}
html body .depth-intro .hx-search button{width:44px;height:44px;min-width:44px;border-radius:12px;background:var(--p-grad,linear-gradient(135deg,#4f7cff,#a855f7));color:#fff}
html body .hx-chips{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:16px 0 0;max-width:600px}
html body .hx-chips span{font-size:12.5px;color:#8f9bbb;margin-right:2px}
html body .hx-chips a{font-size:12.5px;font-weight:600;color:#dbe2f5;text-decoration:none;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.10);transition:background .2s,border-color .2s}
html body .hx-chips a:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.22);color:#fff}
html body .hx-trust{list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,max-content));gap:10px 26px;margin:28px 0 0;padding:0}
html body .hx-trust li{display:flex;align-items:center;gap:9px;font-size:13.5px;font-weight:600;color:#dde4f6}
html body .hx-trust svg{width:18px;height:18px;color:#8ea2ff;flex:0 0 auto}

/* Sağ taraf: öne çıkan yazılım + popüler abonelikler mozaiği */
html body .hx-stage{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
html body .hx-tile{min-width:0}
html body .hx-tile{display:flex;text-decoration:none;color:#fff;border-radius:18px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.10);
  box-shadow:0 24px 60px -30px rgba(0,0,0,.8);transition:transform .35s cubic-bezier(.2,.8,.2,1),border-color .25s,background .25s}
html body .hx-tile:hover{transform:translateY(-4px);border-color:rgba(160,175,255,.45);background:rgba(255,255,255,.07)}
html body .hx-tile--sw{grid-column:1/-1;flex-direction:column;padding:10px}
html body .hx-shot{display:block;aspect-ratio:16/8.2;overflow:hidden;border-radius:12px;background:#11152a}
html body .hx-shot img{width:100%;height:100%;object-fit:cover;object-position:top center;display:block}
html body .hx-tile--sw .hx-meta{display:grid;grid-template-columns:1fr auto;align-items:end;gap:2px 12px;padding:12px 6px 4px}
html body .hx-meta small{grid-column:1/-1;font-size:10.5px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#8ea2ff}
html body .hx-meta strong{font-size:15px;font-weight:700;line-height:1.3;color:#fff}
html body .hx-meta em{font-style:normal;font-size:15px;font-weight:800;color:#fff;white-space:nowrap}
html body .hx-meta em i{font-style:normal;font-size:11px;font-weight:600;color:#8f9bbb}
html body .hx-tile--hl{align-items:center;gap:14px;padding:12px}
html body .hx-logo{position:relative;flex:0 0 64px;width:64px;height:64px;display:grid;place-items:center;overflow:hidden;border-radius:14px;background:#0f1226}
html body .hx-logo .cover-aura{position:absolute;inset:-30%;background-size:60%;background-repeat:no-repeat;background-position:center;filter:blur(16px) saturate(1.9) brightness(1.3);opacity:.9}
html body .hx-logo img{position:relative;z-index:1;width:42px;height:42px;object-fit:contain;filter:drop-shadow(0 6px 10px rgba(0,0,0,.5))}
html body .hx-tile--hl .hx-meta{display:flex;flex-direction:column;gap:4px;min-width:0}
html body .hx-tile--hl .hx-meta strong{font-size:14px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
html body .hx-tile--hl .hx-meta em{font-size:13.5px;color:#cfd7ef}

/* Abonelik vitrini */
html body .hl-showcase{background:linear-gradient(180deg,#eef1fb 0%,#f5f7fb 100%)}
html body .hl-showcase-lead{margin:10px 0 0;max-width:620px;font-size:15px;line-height:1.6;color:var(--ui-mute)}
html body .hl-showcase .collection-heading{align-items:flex-end}
html body .hl-showcase-all{white-space:nowrap}

@media (max-width:1100px){
  html body .depth-intro .hx{gap:36px}
  html body .hx-trust{grid-template-columns:1fr 1fr}
}
@media (max-width:900px){
  html body .depth-intro .hx{grid-template-columns:1fr;padding:12px 0 24px}
  html body .hx-stage{max-width:640px}
}
@media (max-width:600px){
  html body .depth-intro .hx h1{font-size:36px}
  html body .hx .depth-lead{font-size:15.5px}
  html body .hx-trust{grid-template-columns:1fr 1fr;gap:10px 14px}
  html body .hx-trust li{font-size:12.5px}
  html body .hx-stage{gap:10px}
  html body .hx-tile--hl{flex-direction:column;align-items:flex-start;gap:10px;padding:10px}
  html body .hx-tile--hl .hx-meta strong{white-space:normal}
  html body .hl-showcase .collection-heading{flex-direction:column;align-items:flex-start;gap:14px}
}
