/* Product collection — typography, real product screens and generous spacing. */
.catalog-hero { padding:calc(var(--hdr) + 50px) 0 74px; overflow:hidden; background:radial-gradient(ellipse at 80% 30%,#18223e80,transparent 55%); }
.catalog-hero .crumbs { margin-bottom:40px; }
.catalog-intro { display:grid; grid-template-columns:1fr 1fr; gap:50px; align-items:center; }
.catalog-eyebrow { display:flex; align-items:center; gap:9px; font-size:.68rem; font-weight:600; letter-spacing:.16em; color:var(--tx-2); }
.catalog-eyebrow > span { width:7px; height:7px; border-radius:50%; background:var(--c1); box-shadow:0 0 18px var(--c1); }
.catalog-intro h1 { margin:24px 0; font-size:clamp(2.6rem,4.5vw,5.5rem); line-height:1.08; letter-spacing:-.065em; font-weight:500; }
.catalog-intro h1 em { font-style:normal; color:var(--tx-2); }
.catalog-intro p { color:var(--tx-2); max-width:36em; line-height:1.85; font-size:clamp(1rem,1.2vw,1.15rem); }
.catalog-hero-actions { display:flex; flex-wrap:wrap; align-items:center; gap:24px; margin:30px 0 42px; }
.catalog-facts { display:flex; gap:30px; border-top:1px solid var(--ln-2); padding-top:22px; }
.catalog-facts span { display:grid; color:var(--tx-2); font-size:.75rem; gap:4px; }
.catalog-facts b { color:var(--tx); font-size:1.65rem; font-weight:500; letter-spacing:-.04em; }
.catalog-stage { position:relative; min-height:440px; perspective:1200px; }
.catalog-window { position:absolute; width:90%; border:1px solid #39465a; border-radius:12px; overflow:hidden; background:#131a27; box-shadow:0 24px 65px #0008; transition:translate .3s; }
.catalog-window:hover { translate:0 -7px; }
.catalog-window img,.catalog-window picture { display:block; width:100%; }
.catalog-window img { aspect-ratio:16/10; object-fit:cover; object-position:top; }
.catalog-window-bar { display:flex; align-items:center; gap:9px; padding:9px 13px; color:#d4d9e5; font-size:.63rem; }
.catalog-window-bar i { width:6px; height:6px; border-radius:50%; background:var(--p1); box-shadow:10px 0 #344052,20px 0 #344052; margin-right:20px; }
.catalog-window-bar b { font-weight:400; flex:1; }
.window-0 { top:15%; left:0; z-index:3; transform:rotate(-5deg); }
.window-1 { top:0; left:13%; z-index:2; transform:rotate(5deg); }
.window-2 { top:28%; left:16%; z-index:1; transform:rotate(10deg); }
.catalog-stage-note { position:absolute; bottom:-22px; right:5%; font-size:.6rem; letter-spacing:.22em; color:var(--tx-3); }
.catalog-section { padding:60px 0 0; scroll-margin-top:90px; }
.catalog-heading { display:flex; justify-content:space-between; align-items:end; gap:25px; margin-bottom:34px; }
.catalog-heading h2 { font-size:clamp(2rem,3vw,3.5rem); letter-spacing:-.055em; line-height:1.1; margin-top:16px; font-weight:500; }
.catalog-heading h2 span { color:var(--c1); }
.catalog-heading > p { font-size:.9rem; line-height:1.7; color:var(--tx-2); }
.catalog-tools { display:flex; flex-wrap:wrap; gap:22px; justify-content:space-between; align-items:center; padding:23px 0; border-block:1px solid var(--ln-2); }
.catalog-filters { display:flex; flex-wrap:wrap; gap:6px; }
.catalog-filters button { cursor:pointer; background:transparent; color:var(--tx-2); border:1px solid transparent; border-radius:999px; padding:10px 14px; font:500 .8rem var(--f); }
.catalog-filters button.on { background:var(--tx); color:var(--bg); }
.catalog-filters button:hover:not(.on) { border-color:var(--ln-2); color:var(--tx); }
.catalog-filters small { margin-left:3px; opacity:.65; font-size:.68rem; }
.catalog-search { display:flex; align-items:center; gap:10px; padding:11px 15px; border:1px solid var(--ln-2); border-radius:999px; color:var(--tx-3); }
.catalog-search:focus-within { border-color:var(--tx-2); }
.catalog-search input { width:200px; background:transparent; border:0; outline:0; color:var(--tx); font:inherit; font-size:.8rem; min-width:0; }
.catalog-status { display:flex; flex-wrap:wrap; justify-content:space-between; gap:10px; padding:20px 0 28px; color:var(--tx-3); font-size:.75rem; }
.catalog-status a { color:var(--tx-2); }
.catalog-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; }
.catalog-card { min-width:0; display:flex; flex-direction:column; border:1px solid var(--ln-2); background:linear-gradient(145deg,#10151f,#0b0e15); border-radius:20px; overflow:hidden; scroll-margin-top:100px; }
.catalog-card[hidden],.catalog-empty[hidden] { display:none; }
.catalog-card-visual { position:relative; display:block; overflow:hidden; border-bottom:1px solid var(--ln); }
.catalog-card-visual .pc-img { border-radius:0; aspect-ratio:16/10; }
.catalog-card-visual .pc-shot { left:5%; width:90%; top:8%; }
.catalog-card-visual .pc-shot img { object-fit:contain; background:#101522; }
.catalog-card-visual .pc-mob { width:19%; right:4%; }
.catalog-card-visual .pc-badge { top:5%; left:5%; }
.catalog-card-visual .pc-go { display:none; }
.catalog-image-label { position:absolute; bottom:13px; left:22px; font-size:.53rem; letter-spacing:.14em; color:#d2dae9; background:#0b101dcc; padding:5px 9px; border-radius:4px; }
.catalog-card-body { padding:clamp(22px,2.4vw,36px); display:flex; flex:1; flex-direction:column; align-items:stretch; }
.catalog-card-meta { display:flex; gap:12px; justify-content:space-between; color:var(--tx-2); font-size:.66rem; line-height:1.5; }
.catalog-card-meta > span:last-child { font-family:var(--f-m); color:var(--tx-3); }
.catalog-card h3 { margin:18px 0 16px; font-size:clamp(1.6rem,2.2vw,2.6rem); font-weight:500; letter-spacing:-.045em; line-height:1.1; }
.catalog-card h3 a { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.catalog-card h3 svg { width:22px; height:22px; flex:none; color:var(--tx-3); }
.catalog-card-lead { font-size:1rem; line-height:1.75; color:var(--tx); margin:0 0 12px; }
.catalog-card-description { color:var(--tx-2); font-size:.88rem; line-height:1.85; margin:0 0 23px; }
.catalog-highlights { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:0 0 24px; padding:0; list-style:none; }
.catalog-highlights li { display:flex; gap:8px; font-size:.76rem; color:var(--tx-2); align-items:start; }
.catalog-highlights svg { width:14px; height:18px; flex:none; color:var(--p1,var(--c1)); }
.catalog-more { border-top:1px solid var(--ln-2); margin-top:auto; }
.catalog-more summary { display:flex; justify-content:space-between; cursor:pointer; list-style:none; padding:18px 0; font-size:.78rem; }
.catalog-more summary::-webkit-details-marker { display:none; }
.catalog-more summary span { font-size:1.1rem; line-height:1; color:var(--tx-2); }
.catalog-more[open] summary span { transform:rotate(45deg); }
.catalog-more > div { padding-bottom:20px; }
.catalog-more b { font-size:.75rem; font-weight:600; }
.catalog-more p { color:var(--tx-2); font-size:.8rem; line-height:1.85; margin:7px 0 15px; }
.catalog-card-actions { display:flex; flex-wrap:wrap; gap:16px; justify-content:space-between; align-items:center; padding-top:20px; border-top:1px solid var(--ln-2); }
.catalog-card-actions .btn { min-height:44px; font-size:.77rem; padding:13px 20px; }
.catalog-card-actions .tlink { font-size:.78rem; }
.catalog-empty { padding:60px 20px; text-align:center; border:1px dashed var(--ln-2); border-radius:20px; }
.catalog-empty p { color:var(--tx-2); margin:15px 0 24px; }
.catalog-help { margin:70px 0; padding:clamp(30px,5vw,75px); border-block:1px solid var(--ln-2); background:radial-gradient(ellipse at right,#241726,transparent 65%); }
.catalog-help h2 { font-size:clamp(2.2rem,4vw,4.5rem); line-height:1.1; letter-spacing:-.05em; font-weight:500; margin:22px 0; }
.catalog-help p { max-width:42em; color:var(--tx-2); margin-bottom:28px; line-height:1.8; }
.product-jump { position:sticky; top:0; z-index:20; border-block:1px solid var(--ln-2); background:#0b0e17f5; backdrop-filter:blur(15px); }
.product-jump .wrap { display:flex; overflow-x:auto; gap:26px; align-items:center; scrollbar-width:thin; }
.product-jump a { flex:none; padding:19px 0; font-size:.78rem; color:var(--tx-2); }
.product-jump a:hover { color:var(--tx); }
.product-jump .jump-demo { margin-left:auto; color:var(--hi); }
.product-overview { padding-block:70px; display:grid; grid-template-columns:.7fr 1.3fr; gap:60px; }
.product-overview h2 { font-size:clamp(1.8rem,3vw,3rem); line-height:1.15; letter-spacing:-.04em; font-weight:500; }
.product-overview .rich { color:var(--tx-2); font-size:1rem; line-height:1.9; }
.product-overview .rich p+p { margin-top:20px; }
.product-picture-note { font-size:.7rem; color:var(--tx-3); text-align:center; margin-top:14px; }
.product-gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:34px 26px; }
.product-gallery figure { margin:0; min-width:0; }
.product-gallery figure.gallery-wide,.product-gallery figure:last-child:nth-child(even) { grid-column:1/-1; }
.product-gallery a { display:block; position:relative; overflow:hidden; border:1px solid var(--ln-2); border-radius:14px; background:#111724; box-shadow:0 30px 60px -30px #000c; }
.product-gallery img,.product-gallery picture { width:100%; display:block; }
.product-gallery img { aspect-ratio:16/10; object-fit:cover; object-position:top; transition:transform .4s cubic-bezier(.2,.7,.2,1); }
.product-gallery a:hover img { transform:scale(1.015); }
.product-gallery .gallery-zoom { position:absolute; right:14px; bottom:14px; padding:8px 12px; background:#080c18e8; color:#fff; font-size:.72rem; border-radius:999px; opacity:0; transform:translateY(6px); transition:opacity .25s,transform .25s; }
.product-gallery a:hover .gallery-zoom,.product-gallery a:focus-visible .gallery-zoom { opacity:1; transform:none; }
.product-gallery figcaption { padding:14px 2px 0; font-size:.82rem; color:var(--tx-2); }
.product-gallery figcaption b { color:var(--tx-3); margin-right:10px; font-family:var(--f-m); font-weight:400; }
.gallery-sub { margin:70px 0 26px; font-size:1.35rem; font-weight:600; display:flex; align-items:baseline; gap:14px; flex-wrap:wrap; }
.gallery-sub span { font-size:.78rem; font-weight:400; color:var(--tx-3); }
.gallery-phones { display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:30px 24px; }
.gallery-phones figure { margin:0; min-width:0; }
.gallery-phones a { display:block; padding:9px; border-radius:36px; background:linear-gradient(150deg,#2a3242,#121822); box-shadow:0 0 0 1px #3a4457,0 30px 50px -25px #000d; transition:transform .3s cubic-bezier(.2,.7,.2,1); }
.gallery-phones a:hover { transform:translateY(-4px); }
.gallery-phones img,.gallery-phones picture { width:100%; display:block; }
.gallery-phones img { aspect-ratio:1170/2532; object-fit:cover; object-position:top; border-radius:28px; }
.gallery-phones figcaption { padding:14px 4px 0; font-size:.8rem; color:var(--tx-2); text-align:center; }
.product-lightbox { width:96vw; max-width:1800px; height:94dvh; max-height:1100px; border:1px solid #41495c; border-radius:16px; padding:0; background:#0b101a; color:#fff; overflow:hidden; }
.product-lightbox::backdrop { background:#000d; backdrop-filter:blur(8px); }
.lightbox-top { padding:12px 18px; display:flex; gap:18px; align-items:center; border-bottom:1px solid #303848; }
.lightbox-top p { flex:1; font-size:.8rem; }
.lightbox-top a { color:#c5cbd9; font-size:.75rem; text-decoration:underline; }
.lightbox-top button,.lightbox-bottom button { background:#1d2739; border:1px solid #46516a; color:#fff; padding:9px 13px; border-radius:8px; cursor:pointer; }
.lightbox-canvas { height:calc(100% - 125px); overflow:auto; display:flex; align-items:safe center; justify-content:safe center; }
.lightbox-canvas img { max-width:100%; max-height:100%; object-fit:contain; }
.lightbox-canvas.zoomed { display:block; }
.lightbox-canvas.zoomed img { max-width:none; max-height:none; width:auto; height:auto; }
.lightbox-bottom { display:flex; gap:14px; align-items:center; justify-content:center; padding:12px; }
.lightbox-bottom span { min-width:65px; text-align:center; font-size:.75rem; }
#ozet,#ozellikler,#moduller,#detaylar,#galeri,#sss,#kimler,#demo { scroll-margin-top:75px; }
@media(min-width:1500px) { .catalog-stage { min-height:520px; } }
@media(max-width:1100px) { .catalog-intro { gap:25px; } .catalog-stage { min-height:350px; } .catalog-tools { display:grid; } .catalog-search { width:100%; } .catalog-search input { width:100%; } }
@media(max-width:760px) { .catalog-hero { padding-top:calc(var(--hdr) + 28px); padding-bottom:35px; } .catalog-hero .crumbs { margin-bottom:30px; } .catalog-intro { grid-template-columns:1fr; gap:45px; } .catalog-intro h1 { font-size:clamp(2.5rem,7.5vw,3.9rem); } .catalog-stage { min-height:clamp(270px,66vw,480px); margin:0 10px; } .catalog-stage-note { bottom:-8px; font-size:.5rem; } .catalog-facts { gap:30px; } .catalog-heading { display:block; } .catalog-heading > p { margin-top:18px; } .catalog-grid { grid-template-columns:1fr; gap:25px; } .catalog-section { padding-top:45px; } .catalog-filters button { padding:9px 13px; } .catalog-status a { display:none; } .catalog-card-body { padding:24px; } .catalog-highlights { gap:12px 8px; } .catalog-card h3 { font-size:1.9rem; } .product-overview { grid-template-columns:1fr; gap:25px; padding-block:45px; } .product-jump .wrap { gap:22px; } .product-gallery { grid-template-columns:1fr; gap:26px; } .product-gallery figcaption { font-size:.74rem; } .gallery-phones { grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px 14px; } .gallery-phones a { padding:6px; border-radius:24px; } .gallery-phones img { border-radius:19px; } .gallery-sub { margin-top:50px; } .lightbox-top { flex-wrap:wrap; gap:10px; } .lightbox-top p { min-width:100%; } .lightbox-canvas { height:calc(100% - 160px); } }
@media(prefers-reduced-motion:reduce) { .catalog-window,.product-gallery img,.gallery-phones a { transition:none; } }
.product-feature-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:25px; }
.product-feature-grid article { padding:32px; border:1px solid var(--ln-2); border-radius:18px; background:var(--bg-1); }
.product-feature-grid article > span { display:grid; place-items:center; width:42px; height:42px; margin-bottom:20px; color:var(--hi); background:var(--glass-2); border-radius:10px; }
.product-feature-grid h3 { font-size:1.2rem; font-weight:500; letter-spacing:-.025em; margin-bottom:14px; }
.product-feature-grid p { font-size:.9rem; color:var(--tx-2); line-height:1.85; }
@media(max-width:760px) { .product-feature-grid { grid-template-columns:1fr; gap:15px; } .product-feature-grid article { padding:25px; } }
