:root{
  --bg:#F7FAFF;
  --surface:#FFFFFF;
  --surface-2:#F3F8FF;
  --text:#0B1B3A;
  --muted:#344A6B;
  --line:#D7E5FF;
  --brand:#0B5FFF;
  --brand-2:#0A3FD1;
  --success:#16A34A;
  --shadow: 0 18px 40px rgba(11,27,58,.10);
  --shadow-sm: 0 10px 24px rgba(11,27,58,.10);
  --radius: 18px;
  --radius-sm: 14px;
  --max: 1180px;
  --pad: clamp(18px, 3.2vw, 28px);
  --h1: clamp(28px, 4vw, 46px);
  --h2: clamp(20px, 3vw, 32px);
  --h3: clamp(16px, 2vw, 22px);
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Arial, "Helvetica Neue", "Noto Sans", "Liberation Sans", sans-serif;
  color:var(--text);
  background: radial-gradient(1100px 600px at 18% 10%, rgba(11,95,255,.10), transparent 55%),
              radial-gradient(900px 520px at 85% 18%, rgba(11,95,255,.09), transparent 55%),
              var(--bg);
  line-height:1.5;
}
a{color:inherit; text-decoration:none}
img{max-width:100%; display:block}
.container{width:min(var(--max), calc(100% - 2*var(--pad))); margin:0 auto}
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:10px; padding:12px 16px; border-radius:999px;
  border:1px solid rgba(10,35,95,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(245,248,255,.92));
  color: var(--ink);
  font-weight: 800;
  letter-spacing: .1px;
  box-shadow: 0 10px 22px rgba(7,22,51,.06);
  transition: transform .14s ease, box-shadow .14s ease, background .14s ease, border-color .14s ease;
  cursor:pointer;
}
.btn:hover{transform: translateY(-1px); box-shadow: var(--shadow-sm); border-color: rgba(11,95,255,.28)}
.btn.primary{
  background: linear-gradient(180deg, var(--brand), var(--brand-2));
  color:#fff;
  border-color: rgba(255,255,255,.0);
}
.btn.primary:hover{box-shadow: 0 18px 40px rgba(11,95,255,.20)}
.btn.ghost{
  background: transparent;
  border-color: rgba(215,229,255,.9);
}
.badge{
  display:inline-flex; align-items:center; gap:8px;
  padding:7px 10px; border-radius:999px;
  background: rgba(11,95,255,.10);
  border:1px solid rgba(11,95,255,.18);
  color: var(--muted);
  font-weight:600;
  font-size: 12px;
}
.kicker{color:var(--muted); font-weight:700; letter-spacing:.06em; text-transform:uppercase; font-size:12px}
h1{font-size:var(--h1); line-height:1.15; margin:0}
h2{font-size:var(--h2); line-height:1.2; margin:0}
h3{font-size:var(--h3); line-height:1.25; margin:0}
p{color:var(--muted); margin:0}
.section{padding: clamp(42px, 6vw, 76px) 0}
.card{
  background: rgba(255,255,255,.92);
  border:1px solid rgba(215,229,255,.9);
  border-radius: var(--radius);
  box-shadow: 0 10px 28px rgba(11,27,58,.08);
}
.card.pad{padding:22px}
.grid{display:grid; gap:18px}
.topbar{
  background: #062a69;
  color: rgba(255,255,255,.86);
  font-size: 13px;
}
.topbar .inner{
  display:flex; justify-content:space-between; align-items:center;
  padding: 10px var(--pad);
  gap:14px;
}
.topbar a{color:rgba(255,255,255,.92)}
.topbar .meta{display:flex; gap:12px; flex-wrap:wrap; align-items:center}
.sep{opacity:.35}

header{
  position: sticky; top:0; z-index:50;
  background: rgba(247,250,255,.72);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid rgba(215,229,255,.85);
}
.nav{
  display:flex; align-items:center; justify-content:space-between;
  padding: 14px var(--pad);
  gap: 14px;
}
.brand{
  display:flex; align-items:center; gap:12px; min-width: 220px;
}
.logo{
  width: 42px; height:42px; border-radius:14px;
  background: linear-gradient(180deg, var(--brand), var(--brand-2));
  box-shadow: 0 12px 24px rgba(11,95,255,.18);
  position: relative;
}
.logo:after{
  content:""; position:absolute; inset: 10px;
  border-radius:10px;
  background: rgba(255,255,255,.18);
  border:1px solid rgba(255,255,255,.18);
}
.brand b{letter-spacing:.2px}
.nav-links{display:flex; align-items:center; gap:18px}
.nav-links a{
  font-weight:650;
  color: #20314F;
  opacity: .92;
  padding: 10px 10px;
  border-radius: 999px;
  transition: background .15s ease, opacity .15s ease;
}
.nav-links a:hover{background: rgba(11,95,255,.08); opacity: 1}
.nav-cta{display:flex; gap:10px; align-items:center}

.hamburger{
  display:none;
  width: 44px; height: 44px;
  border-radius: 14px;
  border:1px solid rgba(215,229,255,.95);
  background: rgba(255,255,255,.7);
  align-items:center; justify-content:center;
  cursor:pointer;
}
.hamburger span{width:18px; height:2px; background:#20314F; display:block; position:relative}
.hamburger span:before,.hamburger span:after{
  content:""; position:absolute; left:0; width:18px; height:2px; background:#20314F;
}
.hamburger span:before{top:-6px}
.hamburger span:after{top:6px}

.mobile-drawer{
  display:none;
  position: fixed; inset: 0;
  background: rgba(11,27,58,.44);
  backdrop-filter: blur(8px);
  z-index:60;
}
.mobile-drawer .panel{
  position:absolute; right: 0; top:0; height:100%;
  width: min(420px, 88vw);
  background: rgba(255,255,255,.96);
  border-left: 1px solid rgba(215,229,255,.95);
  padding: 18px;
  display:flex; flex-direction:column; gap:14px;
}
.mobile-drawer .row{display:flex; align-items:center; justify-content:space-between}
.mobile-drawer .close{
  width:44px; height:44px; border-radius:14px; border:1px solid rgba(215,229,255,.95);
  background: rgba(247,250,255,.9); cursor:pointer;
}
.mobile-drawer nav{display:flex; flex-direction:column; gap:6px}
.mobile-drawer nav a{
  padding:12px 12px; border-radius:14px;
  border:1px solid rgba(215,229,255,.7);
  background: rgba(247,250,255,.7);
  font-weight:700;
}
.mobile-drawer nav a:hover{background: rgba(11,95,255,.08)}
.mobile-drawer .cta{margin-top:auto; display:grid; gap:10px}

.hero{
  padding: clamp(28px, 4vw, 42px) 0 0;
}
.hero-shell{
  border-radius: calc(var(--radius) + 6px);
  overflow:hidden;
  border: 1px solid rgba(215,229,255,.95);
  background: rgba(255,255,255,.76);
  box-shadow: var(--shadow);
}
.slider{
  position: relative;
}
.slides{display:flex; transition: transform .55s cubic-bezier(.2,.8,.2,1)}
.slide{
  min-width: 100%;
  display:grid;
  grid-template-columns: 1.05fr .95fr;
  align-items:center;
  gap: 18px;
  padding: clamp(22px, 4vw, 44px);
}
.slide .copy{max-width: 560px}
.slide .copy p{margin-top: 12px; font-size: 16px}
.slide .copy .actions{margin-top: 18px; display:flex; gap:10px; flex-wrap:wrap}
.slide .visual{
  border-radius: var(--radius);
  overflow:hidden;
  border:1px solid rgba(215,229,255,.95);
  background: linear-gradient(180deg, rgba(11,95,255,.10), rgba(11,95,255,.04));
}
.slide .visual img{width:100%; height:100%; object-fit:cover}
.slider-controls{
  position:absolute; inset: auto 16px 16px 16px;
  display:flex; justify-content:space-between; align-items:center;
  gap: 10px;
}
.dots{display:flex; gap:8px; align-items:center}
.dot{
  width: 9px; height: 9px; border-radius: 99px;
  background: rgba(11,27,58,.22);
  border: 1px solid rgba(215,229,255,.95);
  cursor:pointer;
}
.dot.active{width: 26px; background: rgba(11,95,255,.9)}
.arrows{display:flex; gap:10px}
.icon-btn{
  width: 42px; height: 42px; border-radius: 14px;
  border:1px solid rgba(215,229,255,.95);
  background: rgba(255,255,255,.78);
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition: transform .15s ease, box-shadow .15s ease;
}
.icon-btn:hover{transform: translateY(-1px); box-shadow: var(--shadow-sm)}

.mini-stats{
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  padding: 18px;
  border-top: 1px solid rgba(215,229,255,.9);
  background: rgba(247,250,255,.7);
}
.stat{
  display:flex; gap:12px; align-items:flex-start;
  padding: 14px;
  border-radius: 16px;
  border:1px solid rgba(215,229,255,.85);
  background: rgba(255,255,255,.85);
}
.stat b{display:block}
.stat small{color:var(--muted)}
.stat .pill{
  width: 40px; height: 40px; border-radius: 16px;
  background: rgba(11,95,255,.10);
  border:1px solid rgba(11,95,255,.16);
}

.section-head{
  display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom: 18px;
}
.section-head p{max-width: 640px}
.cards-3{grid-template-columns: repeat(3, 1fr)}
.cards-4{grid-template-columns: repeat(4, 1fr)}
.cards-2{grid-template-columns: repeat(2, 1fr)}
.cards-6{grid-template-columns: repeat(3, 1fr)}
.card-media{
  border-radius: calc(var(--radius) - 6px);
  overflow:hidden;
  border:1px solid rgba(215,229,255,.95);
  background: rgba(11,95,255,.06);
}
.card-media img{width:100%; height:160px; object-fit:cover}
.card-body{padding: 16px 16px 18px}
.card-body p{margin-top:10px; font-size: 14px}
.card-actions{margin-top: 14px; display:flex; gap:10px; flex-wrap:wrap}
.card:hover{transform: translateY(-2px); box-shadow: 0 22px 52px rgba(11,27,58,.12)}
.card{transition: transform .18s ease, box-shadow .18s ease}

.banner{
  position:relative;
  overflow:hidden;
  border-radius: calc(var(--radius) + 6px);
  border:1px solid rgba(215,229,255,.95);
  box-shadow: var(--shadow);
  background: rgba(255,255,255,.7);
}
.banner .bg{
  position:absolute; inset:0;
  opacity:.9;
}
.banner .bg img{width:100%; height:100%; object-fit:cover; filter: saturate(1.08) contrast(1.03)}
.banner .overlay{
  position:absolute; inset:0;
  background: linear-gradient(90deg, rgba(247,250,255,.96), rgba(247,250,255,.70), rgba(247,250,255,.22));
}
.banner .content{
  position:relative;
  padding: clamp(20px, 4vw, 40px);
  display:flex; align-items:center; justify-content:space-between; gap: 18px;
}
.banner .content p{max-width: 520px}
.banner .content .actions{display:flex; gap:10px; flex-wrap:wrap}

.split{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
}
.list{
  display:grid; gap:10px; margin-top: 12px;
}
.li{
  display:flex; gap:12px; align-items:flex-start;
  padding: 12px 12px;
  border-radius: 16px;
  border:1px solid rgba(215,229,255,.9);
  background: rgba(255,255,255,.86);
}
.li .dot2{
  width: 10px; height:10px; border-radius: 999px;
  background: rgba(11,95,255,.9);
  margin-top: 6px;
}

.testimonials{
  display:grid; gap: 14px;
}
.t-slider{
  position:relative;
  overflow:hidden;
  border-radius: calc(var(--radius) + 6px);
  border:1px solid rgba(215,229,255,.95);
  background: rgba(255,255,255,.86);
  box-shadow: var(--shadow-sm);
}
.t-track{display:flex; transition: transform .55s cubic-bezier(.2,.8,.2,1)}
.t-item{
  min-width: 100%;
  padding: clamp(18px, 3.2vw, 28px);
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 16px;
  align-items:center;
}
.quote{font-size: 18px; color: #20314F; font-weight:650}
.person{display:flex; gap:12px; align-items:center; justify-content:flex-end}
.avatar{
  width: 44px; height:44px; border-radius: 16px;
  background: rgba(11,95,255,.12);
  border:1px solid rgba(11,95,255,.18);
}
.person b{display:block}
.person small{color: var(--muted)}
.t-controls{display:flex; justify-content:space-between; align-items:center; padding: 14px 16px; border-top:1px solid rgba(215,229,255,.9); background: rgba(247,250,255,.72)}

.newsletter{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 18px;
  align-items:stretch;
}
.form{
  display:flex; gap:10px; flex-wrap:wrap;
  background: rgba(255,255,255,.86);
  border:1px solid rgba(215,229,255,.95);
  border-radius: 999px;
  padding: 10px;
}
.input{
  flex: 1 1 220px;
  border:none;
  background: transparent;
  padding: 10px 12px;
  outline:none;
  font-weight:600;
  color: var(--text);
}
.smallprint{font-size:12px; color: var(--muted); margin-top: 10px}

footer{
  background: rgba(11,27,58,.96);
  color: rgba(255,255,255,.86);
  margin-top: 0;
}
.footer-top{
  padding: 46px var(--pad);
  display:grid;
  grid-template-columns: 1.3fr .9fr .9fr .9fr;
  gap: 18px;
}
.footer-top a{color: rgba(255,255,255,.86)}
.footer-top a:hover{color: #fff}
.footer-title{font-weight:800; color:#fff}
.footer-note{color: rgba(255,255,255,.72)}
.footer-bottom{
  border-top: 1px solid rgba(255,255,255,.10);
  padding: 16px var(--pad);
  display:flex; align-items:center; justify-content:space-between; gap: 12px;
  color: rgba(255,255,255,.68);
  font-size: 13px;
}
.chips{display:flex; gap:8px; flex-wrap:wrap}
.chip{
  padding: 7px 10px; border-radius: 999px;
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(255,255,255,.06);
  color: rgba(255,255,255,.82);
  font-weight:650;
  font-size: 12px;
}

/* Page chrome */
.page-hero{
  padding: 34px 0 10px;
}
.breadcrumb{
  display:flex; gap:8px; flex-wrap:wrap;
  color: var(--muted);
  font-weight:650;
  font-size: 13px;
}
.breadcrumb a{color: var(--muted); text-decoration: underline; text-decoration-color: rgba(11,95,255,.22)}
.page-title{margin-top:10px}
.page-lead{margin-top: 12px; max-width: 760px}

/* Product detail */
.product-hero{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 18px;
  margin-top: 18px;
}
.gallery{
  border-radius: calc(var(--radius) + 6px);
  overflow:hidden;
  border:1px solid rgba(215,229,255,.95);
  background: rgba(255,255,255,.88);
  box-shadow: var(--shadow-sm);
}
.gallery-main{
  aspect-ratio: 4/3;
  background: rgba(11,95,255,.06);
  border-bottom: 1px solid rgba(215,229,255,.92);
}
.gallery-main img{width:100%; height:100%; object-fit:cover}
.gallery-thumbs{
  display:flex; gap:10px; padding: 12px;
}
.thumb{
  width: 76px; height: 56px;
  border-radius: 14px;
  overflow:hidden;
  border:1px solid rgba(215,229,255,.95);
  cursor:pointer;
  background: rgba(247,250,255,.9);
}
.thumb img{width:100%; height:100%; object-fit:cover}
.thumb.active{outline: 2px solid rgba(11,95,255,.55); outline-offset: 2px}

.product-summary{
  padding: 22px;
}
.product-summary .meta{
  display:flex; gap:10px; flex-wrap:wrap; align-items:center;
  margin-top: 14px;
}
.kpis{
  margin-top: 16px;
  display:grid; grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}
.kpi{
  padding: 12px;
  border-radius: 16px;
  border:1px solid rgba(215,229,255,.92);
  background: rgba(247,250,255,.72);
}
.kpi b{display:block}
.kpi small{color: var(--muted)}
.tabs{
  margin-top: 18px;
  border-radius: calc(var(--radius) + 6px);
  border:1px solid rgba(215,229,255,.95);
  background: rgba(255,255,255,.86);
  box-shadow: var(--shadow-sm);
  overflow:hidden;
}
.tabbar{
  display:flex; flex-wrap:wrap; gap:10px;
  padding: 14px;
  border-bottom: 1px solid rgba(215,229,255,.92);
  background: rgba(247,250,255,.72);
}
.tabbar button{
  border:1px solid rgba(215,229,255,.92);
  background: rgba(255,255,255,.86);
  padding: 10px 12px;
  border-radius: 999px;
  font-weight:700;
  cursor:pointer;
}
.tabbar button.active{
  background: rgba(11,95,255,.12);
  border-color: rgba(11,95,255,.22);
}
.tabpanes{padding: 18px}
.pane{display:none}
.pane.active{display:block}
.table{
  width:100%; border-collapse:separate; border-spacing:0;
  overflow:hidden;
  border-radius: 16px;
  border:1px solid rgba(215,229,255,.92);
}
.table td{
  padding: 12px 12px;
  border-top: 1px solid rgba(215,229,255,.92);
  color: #20314F;
}
.table tr:first-child td{border-top:none}
.table td:first-child{width: 42%; color: var(--muted); font-weight:800; background: rgba(247,250,255,.72)}
.doc{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding: 12px 12px;
  border-radius: 16px;
  border:1px solid rgba(215,229,255,.92);
  background: rgba(247,250,255,.66);
  margin-top: 10px;
}
.doc b{display:block}
.doc small{color: var(--muted)}
.faq{display:grid; gap:10px; margin-top: 10px}
.faq-item{
  border-radius: 16px;
  border:1px solid rgba(215,229,255,.92);
  background: rgba(247,250,255,.66);
  overflow:hidden;
}
.faq-q{
  width:100%;
  padding: 14px 14px;
  background: transparent;
  border:none;
  font-weight:850;
  color: #20314F;
  display:flex; align-items:center; justify-content:space-between;
  cursor:pointer;
}
.faq-a{
  display:none;
  padding: 0 14px 14px 14px;
  color: var(--muted);
}
.faq-item.open .faq-a{display:block}
.pill2{
  width: 32px; height: 32px;
  border-radius: 12px;
  border:1px solid rgba(215,229,255,.95);
  background: rgba(255,255,255,.82);
  display:flex; align-items:center; justify-content:center;
}

/* Blog */
.blog-grid{grid-template-columns: repeat(3, 1fr)}
.post-meta{display:flex; gap:10px; flex-wrap:wrap; align-items:center; color: var(--muted); font-weight:700; font-size: 13px; margin-top: 10px}
.toc{
  border-radius: 18px;
  border:1px solid rgba(215,229,255,.92);
  background: rgba(247,250,255,.70);
  padding: 14px;
}
.toc a{display:block; padding: 8px 10px; border-radius: 14px; font-weight:700; color: #20314F}
.toc a:hover{background: rgba(11,95,255,.08)}
.article p{margin-top: 12px}
.article h3{margin-top: 18px}

/* Utilities */
.muted{color: var(--muted)}
hr.sep2{border:none; border-top:1px solid rgba(215,229,255,.92); margin: 18px 0}
.note{
  padding: 12px 14px; border-radius: 16px;
  border:1px dashed rgba(11,95,255,.28);
  background: rgba(11,95,255,.06);
  color: var(--muted);
  font-weight:650;
}

/* Animations */
.reveal{opacity:0; transform: translateY(10px); transition: opacity .5s ease, transform .5s ease}
.reveal.show{opacity:1; transform:none}

/* Responsive */
@media (max-width: 980px){
  .slide{grid-template-columns: 1fr; }
  .mini-stats{grid-template-columns: repeat(2, 1fr)}
  .cards-4{grid-template-columns: repeat(2, 1fr)}
  .cards-6{grid-template-columns: repeat(2, 1fr)}
  .split, .newsletter, .product-hero{grid-template-columns: 1fr}
  .t-item{grid-template-columns: 1fr}
  .person{justify-content:flex-start}
  .blog-grid{grid-template-columns: repeat(2, 1fr)}
  .footer-top{grid-template-columns: 1fr 1fr}
  .brand{min-width: auto}
  .nav-links{display:none}
  .hamburger{display:flex}
}
@media (max-width: 560px){
  .mini-stats{grid-template-columns: 1fr}
  .cards-3, .cards-2, .cards-4, .cards-6, .blog-grid{grid-template-columns: 1fr}
  .slider-controls{inset: auto 12px 12px 12px}
  .footer-top{grid-template-columns: 1fr}
}



/* Language switcher */
.lang{position:relative}
.lang-btn{padding:10px 12px}
.lang-btn .flag{font-size:16px; line-height:1}
.lang-btn .caret{font-size:12px; opacity:.8}
.lang-menu{
  position:absolute; right:0; top: calc(100% + 10px);
  min-width: 170px;
  background: rgba(255,255,255,.92);
  border:1px solid rgba(215,229,255,.95);
  border-radius: 14px;
  box-shadow: var(--shadow-sm);
  padding: 8px;
  display:none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  z-index: 60;
}
.lang-menu.open{display:block}
.lang-item{
  width:100%;
  display:flex; align-items:center; gap:10px;
  padding: 10px 10px;
  background: transparent;
  border: 0;
  border-radius: 12px;
  cursor:pointer;
  font-weight:700;
  color: var(--text);
}
.lang-item:hover{background: rgba(11,95,255,.08)}
.lang-item .flag{font-size:16px}

@media (max-width: 980px){
  #langWidget{display:none}
  #langWidgetMobile{display:block; width:100%}
  #langWidgetMobile .lang-btn{width:100%; justify-content:space-between}
  #langWidgetMobile .lang-menu{right:auto; left:0; width:100%}
}



/* Hero (more realistic, full-width) */
.hero{padding: 0}
.hero-full{
  width:100%;
  border-radius: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  overflow: hidden;
}
.hero-slide{
  min-width: 100%;
  position: relative;
  background: var(--hero-bg) center/cover no-repeat;
}
.hero-slide:before{
  content:"";
  position:absolute; inset:0;
  background:
    linear-gradient(90deg, rgba(255,255,255,.88) 0%, rgba(255,255,255,.76) 38%, rgba(255,255,255,.44) 66%, rgba(255,255,255,.10) 100%);
}
.hero-slide:after{
  content:"";
  position:absolute; inset:auto 0 0 0;
  height: 180px;
  background: linear-gradient(180deg, rgba(247,250,255,0) 0%, rgba(247,250,255,.92) 100%);
}
.hero-slide .slide-inner{
  position:relative;
  z-index:1;
  min-height: clamp(460px, 62vh, 680px);
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  align-items:center;
  gap: clamp(18px, 3vw, 44px);
  padding: clamp(26px, 5vw, 60px) 0;
}
.hero-slide .copy{max-width: 620px}
.hero-slide h1{letter-spacing: -0.01em}
.hero-slide .copy p{font-size: 16.5px; color: rgba(11,27,58,.82); max-width: 56ch}
.hero-meta{
  margin-top: 18px;
  display:flex;
  gap: 10px;
  flex-wrap: wrap;
}
.hero-chip{
  padding: 8px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.70);
  border: 1px solid rgba(215,229,255,.95);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  font-weight: 700;
  font-size: 12.5px;
  color: rgba(11,27,58,.78);
}
.visual-device{
  background: transparent !important;
  border: 0 !important;
  position: relative;
  overflow: visible !important;
}
.visual-device img{
  width: min(760px, 100%);
  height: auto;
  max-height: 520px;
  object-fit: contain !important;
  filter: drop-shadow(0 22px 34px rgba(11,27,58,.18));
  transform: translateY(6px);
}
.visual-device:after{
  content:"";
  position:absolute;
  left: 8%;
  right: 8%;
  bottom: 14px;
  height: 26px;
  background: radial-gradient(closest-side, rgba(11,27,58,.26), rgba(11,27,58,0));
  filter: blur(2px);
}

.hero-full .slider-controls{
  inset: auto 0 18px 0;
  width: min(var(--max), calc(100% - 2*var(--pad)));
  margin: 0 auto;
  padding: 0;
}

@media (max-width: 980px){
  .hero-slide .slide-inner{
    grid-template-columns: 1fr;
    padding: 26px 0 18px;
    min-height: auto;
  }
  .visual-device img{
    width: min(760px, 96%);
    margin: 8px auto 0;
    transform: none;
  }
  .hero-full .slider-controls{
    inset: auto 0 14px 0;
  }
}


/* Product images (real) */
.card-media{
  background: radial-gradient(120% 90% at 50% 15%, rgba(255,255,255,.95) 0%, rgba(247,250,255,.88) 55%, rgba(11,95,255,.05) 100%);
}
.card-media img{
  height: 190px;
  object-fit: contain;
  padding: 10px 12px;
}
@media (max-width: 560px){
  .card-media img{height: 170px}
}


/* Gallery image containment */
.gallery-main img{width:100%; height:100%; object-fit: contain; background: rgba(247,250,255,.65)}
.gallery-thumbs img{object-fit: contain; background: rgba(247,250,255,.65)}


/* Grid stability fixes */
.grid.cards-4{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 16px;
}
@media (max-width: 1100px){
  .grid.cards-4{grid-template-columns: repeat(2, minmax(0, 1fr))}
}
@media (max-width: 560px){
  .grid.cards-4{grid-template-columns: 1fr}
}
.card{height:100%}
.card-body{display:flex; flex-direction:column}
.card-actions{margin-top:auto}



/* Hero centering fix */
.hero-slide .slide-inner{
  margin-left:auto;
  margin-right:auto;
  padding-left: var(--pad);
  padding-right: var(--pad);
}



/* Hero slide layout fix (override generic .slide grid) */
.hero-slide{
  display:block;
  padding:0 !important;
  grid-template-columns: none !important;
  gap: 0 !important;
}



/* Premium Services (left image / right content) */
.service-list{display:flex; flex-direction:column; gap: 18px; margin-top: 18px}
.service-row{
  display:grid;
  grid-template-columns: 360px 1fr;
  gap: 18px;
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(215,229,255,.95);
  border-radius: 22px;
  overflow:hidden;
  box-shadow: var(--shadow-sm);
}
.service-media{position:relative; min-height: 240px}
.service-media img{width:100%; height:100%; object-fit: cover; display:block}
.service-media:after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(90deg, rgba(11,27,58,.08) 0%, rgba(11,27,58,0) 60%);
}
.service-content{padding: 18px 18px 18px 6px}
.service-content h3{margin-top: 4px}
.service-bullets{
  margin: 12px 0 0;
  padding: 0;
  list-style:none;
  display:grid;
  gap: 8px;
  color: rgba(11,27,58,.78);
}
.service-bullets li{
  position:relative;
  padding-left: 18px;
}
.service-bullets li:before{
  content:"";
  position:absolute;
  left:0; top: 9px;
  width:8px; height:8px;
  border-radius:999px;
  background: rgba(11,95,255,.65);
}
.service-actions{display:flex; gap: 10px; flex-wrap:wrap; margin-top: 14px}
@media (max-width: 980px){
  .service-row{grid-template-columns: 1fr}
  .service-content{padding: 16px}
  .service-media{min-height: 200px}
}

/* Corporate wide banner */
.kicker-on-dark{color: rgba(255,255,255,.82)}
.corp-wide{
  position:relative;
  padding: 54px 0;
  overflow:hidden;
  background: #071633;
}
.corp-bg{
  position:absolute; inset:0;
  background-size: cover;
  background-position: center;
  filter: saturate(1.02) contrast(1.02);
  transform: scale(1.03);
}
.corp-overlay{
  position:absolute; inset:0;
  background:
    radial-gradient(1200px 520px at 18% 30%, rgba(11,95,255,.32) 0%, rgba(11,95,255,0) 55%),
    linear-gradient(90deg, rgba(7,22,51,.96) 0%, rgba(7,22,51,.78) 52%, rgba(7,22,51,.90) 100%);
}
.corp-inner{
  position:relative;
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 18px;
  align-items: stretch;
}
.corp-copy h2{color:#fff; margin-top: 8px}
.corp-copy p{color: rgba(255,255,255,.78); max-width: 62ch}
.corp-badges{
  margin-top: 16px;
  display:flex; gap: 10px; flex-wrap:wrap;
}
.corp-badge{
  padding: 10px 12px;
  border-radius: 16px;
  /* İstek: pill arka plandaki opak/blur efektini kaldir */
  background: transparent;
  border: 0;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  color: rgba(255,255,255,.86);
  display:flex; gap: 8px; align-items: baseline;
}
.corp-badge b{font-size: 14px}
.corp-badge span{font-size: 12.5px; opacity:.9}
.corp-actions{margin-top: 16px; display:flex; gap: 10px; flex-wrap:wrap}
.corp-panel{
  position:relative;
  /* İstek: pill arka plandaki opak/blur efektini kaldır */
  background: transparent;
  border: 0;
  border-radius: 22px;
  padding: 18px;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.corp-stat{
  padding: 14px 14px;
  border-radius: 18px;
  background: rgba(7,22,51,.35);
  border: 1px solid rgba(255,255,255,.10);
}
.corp-stat b{color:#fff; font-size: 20px}
.corp-stat span{display:block; margin-top: 6px; color: rgba(255,255,255,.78); font-size: 12.5px}
@media (max-width: 980px){
  .corp-inner{grid-template-columns: 1fr}
  .corp-panel{grid-template-columns: 1fr 1fr}
}
@media (max-width: 560px){
  .corp-panel{grid-template-columns: 1fr}
}

/* Testimonials redesign */
.testimonial-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 14px;
}
.t-card{
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(215,229,255,.95);
  border-radius: 22px;
  padding: 18px;
  box-shadow: var(--shadow-sm);
  display:flex;
  flex-direction:column;
  gap: 12px;
}
.t-top{display:flex; justify-content:space-between; gap: 10px; align-items:center}
.t-stars{letter-spacing: 2px; font-size: 14px}
.t-tag{font-size: 12.5px; color: rgba(11,27,58,.70); font-weight: 700}
.t-quote{
  color: rgba(11,27,58,.82);
  line-height: 1.7;
  font-size: 14.5px;
}
.t-person{
  margin-top:auto;
  display:flex;
  align-items:center;
  gap: 10px;
}
.t-avatar{
  width: 44px;
  height: 44px;
  border-radius: 16px;
  display:grid;
  place-items:center;
  font-weight: 900;
  color: rgba(11,27,58,.92);
  background: radial-gradient(120% 120% at 30% 20%, rgba(11,95,255,.26) 0%, rgba(11,95,255,.06) 60%, rgba(11,95,255,.02) 100%);
  border: 1px solid rgba(215,229,255,.95);
}
.t-person small{display:block; margin-top: 3px; color: rgba(11,27,58,.68)}
@media (max-width: 1100px){
  .testimonial-grid{grid-template-columns: repeat(2, minmax(0, 1fr))}
}
@media (max-width: 560px){
  .testimonial-grid{grid-template-columns: 1fr}
}

/* Newsletter wide banner */
.newsletter-wide{
  position:relative;
  padding: 54px 0;
  overflow:hidden;
  background: #071633;
}
.nl-bg{
  position:absolute; inset:0;
  background-size: cover;
  background-position: center;
  transform: scale(1.03);
}
.nl-overlay{
  position:absolute; inset:0;
  background:
    radial-gradient(1200px 520px at 20% 30%, rgba(11,95,255,.30) 0%, rgba(11,95,255,0) 55%),
    linear-gradient(90deg, rgba(7,22,51,.95) 0%, rgba(7,22,51,.76) 55%, rgba(7,22,51,.90) 100%);
}
.nl-inner{
  position:relative;
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 18px;
  align-items: start;
}
.nl-copy h2{color:#fff; margin-top: 8px}
.nl-copy p{color: rgba(255,255,255,.78); margin-top: 10px}
.nl-form{
  position:relative;
  /* İstek: pill arka plandaki opak/blur efektini kaldır */
  background: transparent;
  border: 0;
  border-radius: 22px;
  padding: 18px;
  display:grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 10px;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.nl-form .input{
  background: rgba(255,255,255,.90);
}
@media (max-width: 980px){
  .nl-inner{grid-template-columns: 1fr}
  .nl-form{grid-template-columns: 1fr}
  .nl-form button{width:100%}
}


/* Mobile header CTA hide */
@media (max-width: 980px){
  .nav-cta > a.btn.primary{display:none}
}


/* Marquee bar */
.marquee-bar{
  background: rgba(7,22,51,.98);
  color: rgba(255,255,255,.88);
  font-size: 12.5px;
  border-bottom: 1px solid rgba(255,255,255,.08);
  overflow:hidden;
}
.marquee-track{
  display:flex;
  gap: 18px;
  white-space: nowrap;
  padding: 8px var(--pad);
  will-change: transform;
  animation: marquee 18s linear infinite;
}
.marquee-track .dot{opacity:.45}
@keyframes marquee{
  0%{transform: translateX(0)}
  100%{transform: translateX(-100%)}
}
@media (prefers-reduced-motion: reduce){
  .marquee-track{animation:none}
}

/* Topbar mobile stability */
@media (max-width: 640px){
  .topbar .inner{
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
    padding: 10px var(--pad);
  }
  .topbar .meta{gap: 8px}
  .topbar .meta:last-child{
    width: 100%;
    justify-content: flex-start;
  }
  .topbar .sep{display:none}
}


/* Services premium grid */
.services-grid{
  margin-top: 18px;
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
}
.s-card{
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(215,229,255,.95);
  border-radius: 22px;
  overflow:hidden;
  box-shadow: var(--shadow-sm);
  display:flex;
  flex-direction:column;
  height:100%;
}
.s-media{height: 190px; position:relative}
.s-media img{width:100%; height:100%; object-fit: cover; display:block}
.s-media:after{
  content:"";
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(0,0,0,.10) 0%, rgba(0,0,0,0) 55%);
}
.s-body{padding: 16px 16px 18px; display:flex; flex-direction:column; height:100%}
.s-body h3{margin-top: 2px}
.s-body p{margin-top: 8px; color: rgba(11,27,58,.80); font-size: 14.5px; line-height: 1.65}
.s-list{
  margin: 12px 0 0;
  padding: 0;
  list-style:none;
  display:grid;
  gap: 8px;
  color: rgba(11,27,58,.74);
  font-size: 13.5px;
}
.s-list li{position:relative; padding-left: 18px}
.s-list li:before{
  content:"";
  position:absolute;
  left:0; top: 8px;
  width:8px; height:8px;
  border-radius:999px;
  background: rgba(11,95,255,.65);
}
.s-body .btn{margin-top: auto; align-self:flex-start}
@media (max-width: 1100px){
  .services-grid{grid-template-columns: repeat(2, minmax(0, 1fr))}
}
@media (max-width: 640px){
  .services-grid{grid-template-columns: 1fr}
  .s-media{height: 170px}
}


/* Small buttons (used in product cards) */
.btn.sm{
  padding: 9px 12px;
  font-size: 13px;
  border-radius: 12px;
}


/* WhatsApp CTA */
.btn.whatsapp{
  border-color: rgba(34,197,94,.35);
}
.btn.whatsapp:hover{
  background: rgba(34,197,94,.10);
  border-color: rgba(34,197,94,.55);
}


/* Service detail premium */
.breadcrumb-on-dark a, .breadcrumb-on-dark span{color: rgba(255,255,255,.78)}
.breadcrumb-on-dark a:hover{color:#fff}

.service-hero{
  position:relative;
  padding: 54px 0 28px;
  overflow:hidden;
  background:#071633;
}
.service-hero-bg{
  position:absolute; inset:0;
  background-size: cover;
  background-position:center;
  transform: scale(1.03);
}
.service-hero-overlay{
  position:absolute; inset:0;
  background:
    radial-gradient(1100px 520px at 18% 30%, rgba(11,95,255,.30) 0%, rgba(11,95,255,0) 55%),
    linear-gradient(90deg, rgba(7,22,51,.96) 0%, rgba(7,22,51,.78) 52%, rgba(7,22,51,.90) 100%);
}
.service-hero-inner{
  position:relative;
  display:grid;
  grid-template-columns: 1.2fr .8fr;
  gap: 18px;
  margin-top: 14px;
  align-items:start;
}
.service-hero-copy h1{color:#fff; margin-top: 10px}
.service-hero-copy p{color: rgba(255,255,255,.78); max-width: 64ch; margin-top: 10px}
.service-hero-actions{margin-top: 14px; display:flex; gap: 10px; flex-wrap:wrap}
.service-hero-chips{margin-top: 14px; display:flex; gap: 10px; flex-wrap:wrap}
.service-hero-chips .chip{
  padding: 8px 12px;
  border-radius: 999px;
  /* İstek: pill arka plandaki opak/blur efektini kaldır */
  background: transparent;
  border: 0;
  color: rgba(255,255,255,.86);
  font-weight: 800;
  font-size: 12.5px;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.service-hero-panel .panel-card{
  /* İstek: pill arka plandaki opak/blur efektini kaldır */
  background: transparent;
  border: 0;
  border-radius: 22px;
  padding: 18px;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.panel-title{color: rgba(255,255,255,.82); font-weight:900}
.panel-kpis{
  margin-top: 12px;
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.panel-kpis .pk{
  padding: 12px 12px;
  border-radius: 18px;
  background: rgba(7,22,51,.35);
  border: 1px solid rgba(255,255,255,.10);
}
.panel-kpis .pk b{color:#fff; font-size: 18px}
.panel-kpis .pk small{display:block; margin-top: 6px; color: rgba(255,255,255,.76)}
.panel-note{margin-top: 12px; color: rgba(255,255,255,.72); font-size: 12.5px}

.scope-grid{
  display:grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 16px;
  margin-top: 14px;
}
.timeline{
  display:grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 12px;
}
.t-step{
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(215,229,255,.95);
  border-radius: 22px;
  padding: 14px;
  box-shadow: var(--shadow-sm);
  display:flex;
  gap: 10px;
  align-items:flex-start;
}
.t-num{
  width: 40px;
  height: 40px;
  border-radius: 16px;
  display:grid;
  place-items:center;
  font-weight: 900;
  background: rgba(11,95,255,.10);
  border: 1px solid rgba(215,229,255,.95);
}
.service-cta{
  position:relative;
  padding: 44px 0;
  overflow:hidden;
  background:#071633;
}
.service-cta .cta-bg{
  position:absolute; inset:0;
  background-size: cover;
  background-position:center;
  transform: scale(1.03);
}
.service-cta .cta-overlay{
  position:absolute; inset:0;
  background:
    radial-gradient(1000px 520px at 20% 30%, rgba(11,95,255,.30) 0%, rgba(11,95,255,0) 55%),
    linear-gradient(90deg, rgba(7,22,51,.96) 0%, rgba(7,22,51,.72) 60%, rgba(7,22,51,.90) 100%);
}
.service-cta .cta-inner{
  position:relative;
  display:flex;
  justify-content:space-between;
  gap: 18px;
  align-items:center;
}
.service-cta h2{color:#fff; margin-top: 8px}
.service-cta p{color: rgba(255,255,255,.78); margin-top: 10px; max-width: 60ch}
.service-cta .cta-actions{display:flex; gap: 10px; flex-wrap:wrap}

.faq-grid{
  display:grid;
  grid-template-columns: 1fr;
  gap: 10px;
  margin-top: 14px;
}
.faq{
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(215,229,255,.95);
  border-radius: 18px;
  padding: 14px 16px;
  box-shadow: var(--shadow-sm);
}
.faq summary{
  cursor:pointer;
  font-weight: 900;
}
.faq summary::-webkit-details-marker{display:none}
.faq[open]{border-color: rgba(11,95,255,.25)}
.faq > div{margin-top: 10px}

@media (max-width: 1100px){
  .service-hero-inner{grid-template-columns: 1fr}
  .scope-grid{grid-template-columns: 1fr}
  .timeline{grid-template-columns: 1fr 1fr}
  .service-cta .cta-inner{flex-direction: column; align-items:flex-start}
}
@media (max-width: 560px){
  .timeline{grid-template-columns: 1fr}
  .panel-kpis{grid-template-columns: 1fr}
}


/* About page premium */
.about-hero{
  position:relative;
  padding: 54px 0 26px;
  overflow:hidden;
  background:#071633;
}
.about-hero-bg{
  position:absolute; inset:0;
  background-size: cover;
  background-position:center;
  transform: scale(1.03);
}
.about-hero-overlay{
  position:absolute; inset:0;
  background:
    radial-gradient(1100px 520px at 18% 30%, rgba(11,95,255,.30) 0%, rgba(11,95,255,0) 55%),
    linear-gradient(90deg, rgba(7,22,51,.96) 0%, rgba(7,22,51,.78) 52%, rgba(7,22,51,.90) 100%);
}
.about-hero-inner{
  position:relative;
  display:grid;
  grid-template-columns: 1.15fr .85fr;
  gap: 18px;
  margin-top: 14px;
  align-items:start;
}
.about-hero-copy h1{color:#fff; margin-top: 10px}
.about-hero-copy p{color: rgba(255,255,255,.78); max-width: 68ch; margin-top: 10px}
.about-hero-actions{margin-top: 14px; display:flex; gap: 10px; flex-wrap:wrap}
.about-chips{margin-top: 14px; display:flex; gap: 10px; flex-wrap:wrap}
.about-chips .chip{
  padding: 8px 12px;
  border-radius: 999px;
  /* İstek: pill arka plandaki opak/blur efektini kaldır */
  background: transparent;
  border: 0;
  color: rgba(255,255,255,.86);
  font-weight: 800;
  font-size: 12.5px;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.about-stats{
  padding: 18px 0 6px;
  background: rgba(247,250,255,.8);
  border-bottom: 1px solid rgba(215,229,255,.75);
}
.stats-grid{
  display:grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
.stat{
  background: rgba(255,255,255,.86);
  border: 1px solid rgba(215,229,255,.95);
  border-radius: 18px;
  padding: 14px 14px;
  box-shadow: var(--shadow-sm);
}
.stat b{display:block; font-size: 14px}
.stat span{display:block; margin-top: 6px; color: rgba(11,27,58,.74); font-size: 13px; line-height: 1.55}

.about-two{
  display:grid;
  grid-template-columns: 1.1fr .9fr;
  gap: 16px;
  align-items: stretch;
  margin-top: 14px;
}
.about-photo{
  position:relative;
  border-radius: 22px;
  overflow:hidden;
  border: 1px solid rgba(215,229,255,.95);
  box-shadow: var(--shadow-sm);
  min-height: 320px;
}
.about-photo img{width:100%; height:100%; object-fit: cover; display:block}
.photo-cap{
  position:absolute;
  left: 14px;
  right: 14px;
  bottom: 14px;
  padding: 12px 14px;
  border-radius: 18px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.18);
  color: rgba(255,255,255,.88);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.photo-cap span{display:block; margin-top: 6px; opacity:.92}

@media (max-width: 1100px){
  .about-hero-inner{grid-template-columns: 1fr}
  .stats-grid{grid-template-columns: 1fr 1fr}
  .about-two{grid-template-columns: 1fr}
  .about-photo{min-height: 260px}
}
@media (max-width: 560px){
  .stats-grid{grid-template-columns: 1fr}
}


/* Header brand logo (custom) */
.brand{display:flex; align-items:center; gap:12px}
\.brand-logo{
  height:64px;
  width:auto;
  display:block;
  object-fit:contain;
}
@media (max-width: 820px){
  .brand-logo{height:48px}
}


@media (max-width: 820px){
  .brand{padding: 5px 8px; border-radius: 14px}
}


/* Brand badge reset for logo mark */
.brand{
  padding: 0;
  border-radius: 0;
  background: transparent;
  border: 0;
  box-shadow: none;
}







/* Header alignment */
.site-header .nav-inner,
.site-header .nav-row{
  align-items: center;
}


/* Contact page (premium) */
.contact-hero .hero-grid{display:grid; grid-template-columns: 1.15fr .85fr; gap:22px; align-items:stretch}
.contact-hero .hero-panel{display:flex}
.contact-hero .hero-actions{display:flex; gap:12px; margin-top:16px; flex-wrap:wrap}
.contact-hero .contact-highlights{display:grid; grid-template-columns: repeat(3,1fr); gap:10px; margin-top:18px}
.contact-hero .contact-highlights .mini{border:1px solid var(--line); border-radius:14px; padding:12px; background: rgba(255,255,255,.75); backdrop-filter: blur(10px)}
.contact-hero .contact-highlights .k{font-size:.8rem; color: var(--muted)}
.contact-hero .contact-highlights .v{font-weight:700}

.map-card{border:1px solid var(--line); border-radius:18px; overflow:hidden; background:#fff; box-shadow: var(--shadow-sm); width:100%}
.map-top{display:flex; justify-content:space-between; align-items:center; padding:14px 16px; background: linear-gradient(180deg, rgba(7,22,51,.06), rgba(7,22,51,0))}
.map-top .badge{font-size:.78rem; padding:6px 10px; border-radius:999px; background: rgba(7,22,51,.08); color: var(--ink); font-weight:700}
.map-top .meta{font-size:.85rem; color: var(--muted)}
.map-embed{min-height:260px; background: radial-gradient(900px 240px at 50% 0%, rgba(26,115,232,.18), rgba(26,115,232,0)), linear-gradient(180deg, rgba(245,248,255,1), rgba(255,255,255,1))}
.map-placeholder{position:relative; height:260px; display:flex; align-items:flex-end; padding:16px}
.map-placeholder .pin{width:14px; height:14px; border-radius:50%; background: var(--primary); box-shadow: 0 0 0 8px rgba(26,115,232,.16); position:absolute; left:50%; top:45%; transform: translate(-50%,-50%)}
.map-placeholder .txt{border:1px solid var(--line); background:#fff; border-radius:14px; padding:12px 14px; box-shadow: var(--shadow-sm); max-width: 320px}
.map-placeholder .txt span{display:block; color: var(--muted); margin-top:4px; font-size:.9rem}
.map-bottom{display:flex; gap:10px; padding:14px 16px; flex-wrap:wrap; border-top:1px solid var(--line)}

.contact-grid{display:grid; grid-template-columns: .95fr 1.05fr; gap:18px; align-items:start}
.contact-cards{display:grid; gap:12px}
.contact-card{display:flex; gap:12px; padding:16px; border:1px solid var(--line); border-radius:16px; background:#fff; box-shadow: var(--shadow-xs)}
.contact-card .icon{width:40px; height:40px; border-radius:12px; display:flex; align-items:center; justify-content:center; background: rgba(26,115,232,.10); font-size:18px}
.contact-card .links{margin-top:8px; display:flex; flex-wrap:wrap; gap:8px; color: var(--muted); font-size:.92rem}
.contact-card .links a{color: var(--ink); font-weight:700}
.contact-card .sep{color: var(--muted)}
.form-card{border:1px solid var(--line); border-radius:18px; background:#fff; box-shadow: var(--shadow-sm); overflow:hidden}
.form-head{padding:18px 18px 0}
.contact-form{padding:16px 18px 18px}
.contact-form .row{display:flex; flex-direction:column; gap:8px; margin-top:12px}
.contact-form .row.two{display:grid; grid-template-columns:1fr 1fr; gap:12px}
.contact-form label{font-weight:700; font-size:.9rem}
.contact-form input, .contact-form select, .contact-form textarea{
  width:100%; border:1px solid var(--line); border-radius:14px; padding:12px 12px; background: rgba(245,248,255,.6);
  outline:none;
}
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus{border-color: rgba(26,115,232,.55); box-shadow: 0 0 0 4px rgba(26,115,232,.12)}
.contact-form .row.consent{flex-direction:row; align-items:flex-start; gap:10px}
.contact-form .row.consent input{width:auto; margin-top:3px}
.contact-form .row.actions{display:flex; gap:10px; flex-wrap:wrap; margin-top:14px}
.contact-form .fineprint{margin-top:12px; color: var(--muted); font-size:.85rem}

.contact-faq .faq-grid{display:grid; grid-template-columns: 1fr 1fr; gap:12px}
.faq-item{border:1px solid var(--line); border-radius:16px; padding:12px 14px; background:#fff}
.faq-item summary{cursor:pointer; font-weight:800}
.faq-item .ans{color: var(--muted); margin-top:8px; line-height:1.6}

.cta-strip{margin-top:18px; padding:18px; border-radius:18px; border:1px solid rgba(26,115,232,.18);
  background: radial-gradient(1000px 280px at 0% 0%, rgba(26,115,232,.18), rgba(26,115,232,0)),
              linear-gradient(180deg, rgba(7,22,51,.04), rgba(255,255,255,1));
  display:flex; justify-content:space-between; gap:14px; align-items:center
}
.cta-strip h3{margin:0 0 4px}
.cta-strip p{margin:0; color: var(--muted)}
.cta-strip .cta-actions{display:flex; gap:10px; flex-wrap:wrap}

@media (max-width: 980px){
  .contact-hero .hero-grid{grid-template-columns:1fr}
  .contact-grid{grid-template-columns:1fr}
  .contact-hero .contact-highlights{grid-template-columns:1fr}
  .contact-faq .faq-grid{grid-template-columns:1fr}
  .contact-form .row.two{grid-template-columns:1fr}
}


/* Header sizing guard (smaller logo) */
.site-header .nav-inner,
.site-header .nav-row{
  min-height: 68px;
  align-items: center;
}
@media (max-width: 820px){
  .site-header .nav-inner,
  .site-header .nav-row{
    min-height: 56px;
  }
}


/* --- Header logo & spacing force (fix for overrides) --- */
.nav{ padding-top:10px !important; padding-bottom:10px !important; }
.brand{ min-width:auto !important; }
.nav .brand-logo{ height:56px !important; width:auto !important; object-fit:contain !important; }
@media (max-width: 820px){
  .nav{ padding-top:8px !important; padding-bottom:8px !important; }
  .nav .brand-logo{ height:44px !important; }
}



/* Smaller CTA buttons (index) */
.btn.btn-xsmall{
  padding: 8px 12px !important;
  font-size: .86rem !important;
  border-radius: 12px !important;
}
.btn.btn-xsmall.btn-soft,
.btn.btn-xsmall.btn-ghost{
  padding: 7px 12px !important;
}
@media (max-width: 820px){
  .btn.btn-xsmall{
    padding: 7px 10px !important;
    font-size: .84rem !important;
    border-radius: 12px !important;
  }
}


/* Blog detail premium */
.blog-hero{padding: 36px 0 14px; background: radial-gradient(900px 220px at 20% 0%, rgba(26,115,232,.16), rgba(26,115,232,0))}
.blog-hero-inner{display:grid; grid-template-columns: 1.2fr .8fr; gap:18px; align-items:stretch}
.blog-hero .crumbs{display:flex; flex-wrap:wrap; gap:8px; color: var(--muted); font-size:.92rem}
.blog-hero .crumbs a{color: var(--ink); font-weight:700}
.blog-hero .crumbs span{color: var(--muted)}
.blog-hero .post-meta{display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-top:14px}
.blog-hero .chip{font-size:.78rem; padding:6px 10px; border-radius:999px; background: rgba(7,22,51,.08); font-weight:800}
.blog-hero .meta{color: var(--muted); display:flex; gap:8px; align-items:center; flex-wrap:wrap}
.blog-hero .dot{opacity:.7}
.blog-hero .post-actions{display:flex; gap:10px; margin-top:14px; flex-wrap:wrap}
.hero-media-card{border:1px solid var(--line); border-radius:18px; overflow:hidden; background:#fff; box-shadow: var(--shadow-sm); position:relative}
.hero-media-card img{width:100%; height:100%; max-height:320px; object-fit:cover; display:block}
.hero-media-overlay{position:absolute; inset:auto 0 0 0; display:grid; grid-template-columns: repeat(3,1fr); gap:8px; padding:12px; background: linear-gradient(180deg, rgba(0,0,0,0), rgba(0,0,0,.45))}
.hero-media-overlay .kpi{border:1px solid rgba(255,255,255,.22); border-radius:14px; padding:10px; color:#fff; backdrop-filter: blur(8px); background: rgba(0,0,0,.14)}
.hero-media-overlay .n{font-size:1.05rem; font-weight:900}
.hero-media-overlay .t{font-size:.82rem; opacity:.9}

.blog-layout{display:grid; grid-template-columns: .38fr .62fr; gap:18px; align-items:start}
.blog-aside .aside-card{border:1px solid var(--line); border-radius:16px; padding:14px; background:#fff; box-shadow: var(--shadow-xs); margin-bottom:12px}
.blog-aside .aside-card.subtle{background: rgba(245,248,255,.6)}
.aside-title{font-weight:900; margin-bottom:10px}
.toc{display:flex; flex-direction:column; gap:8px}
.toc a{color: var(--ink); font-weight:700}
.mini-lines{display:flex; flex-direction:column; gap:8px}
.aside-actions{display:flex; gap:10px; margin-top:12px; flex-wrap:wrap}

.blog-content .content-card{border:1px solid var(--line); border-radius:18px; padding:18px; background:#fff; box-shadow: var(--shadow-sm)}
.blog-content h2{margin-top:16px}
.checklist{padding-left: 18px}
.callout{border:1px solid rgba(26,115,232,.18); background: rgba(26,115,232,.06); border-radius:16px; padding:14px; margin:14px 0}
.callout-title{font-weight:900; margin-bottom:6px}
.split{display:grid; grid-template-columns: 1fr 1fr; gap:12px; margin:14px 0}
.split .box{border:1px solid var(--line); border-radius:16px; padding:14px; background: rgba(245,248,255,.55)}
.table-like{border:1px solid var(--line); border-radius:16px; overflow:hidden; margin:12px 0}
.table-like .row{display:grid; grid-template-columns: .25fr .5fr .25fr; gap:10px; padding:10px 12px; border-top:1px solid var(--line)}
.table-like .row.head{background: rgba(7,22,51,.06); border-top:none; font-weight:900}
.quote{border-left:4px solid rgba(26,115,232,.45); padding: 10px 14px; margin: 16px 0; background: rgba(245,248,255,.6); border-radius: 12px}
.quote p{margin:0}
.quote span{display:block; margin-top:8px; color: var(--muted); font-weight:700}
.article-end{display:flex; justify-content:space-between; gap:12px; margin-top:16px; flex-wrap:wrap; align-items:center}
.tags{display:flex; gap:8px; flex-wrap:wrap}
.tag{font-size:.78rem; padding:6px 10px; border-radius:999px; background: rgba(7,22,51,.08); font-weight:800}
.share{display:flex; gap:10px; align-items:center; color: var(--muted)}
.share a{color: var(--ink); font-weight:800}

.related{margin-top:14px}
.rel-head{display:flex; justify-content:space-between; align-items:center; gap:12px; margin:16px 0 10px}
.rel-grid{display:grid; grid-template-columns: repeat(3,1fr); gap:12px}
.rel-card{border:1px solid var(--line); border-radius:16px; overflow:hidden; background:#fff; box-shadow: var(--shadow-xs); display:block}
.rel-card .thumb{height:140px; background-size:cover; background-position:center}
.rel-body{padding:12px}
.rel-title{font-weight:900; color: var(--ink)}
.rel-meta{margin-top:6px; color: var(--muted); font-size:.9rem}

@media (max-width: 980px){
  .blog-hero-inner{grid-template-columns:1fr}
  .blog-layout{grid-template-columns:1fr}
  .rel-grid{grid-template-columns:1fr}
  .split{grid-template-columns:1fr}
  .hero-media-card img{max-height:260px}
}


/* Button polish */
.btn:hover{
  transform: translateY(-1px);
  border-color: rgba(26,115,232,.30);
  box-shadow: 0 14px 28px rgba(7,22,51,.10);
}
.btn:active{ transform: translateY(0); box-shadow: 0 10px 22px rgba(7,22,51,.08); }
.btn:focus-visible{
  outline: none;
  box-shadow: 0 0 0 5px rgba(26,115,232,.14), 0 12px 26px rgba(7,22,51,.10);
  border-color: rgba(26,115,232,.44);
}

.btn.primary{
  background: linear-gradient(180deg, rgba(26,115,232,1), rgba(12,86,196,1));
  color:#fff;
  border-color: rgba(26,115,232,.55);
  box-shadow: 0 14px 28px rgba(26,115,232,.20);
}
.btn.primary:hover{ box-shadow: 0 18px 34px rgba(26,115,232,.26); }

.btn.ghost{
  background: rgba(255,255,255,.55);
  border-color: rgba(215,229,255,.95);
}
.btn.soft{
  background: rgba(26,115,232,.10);
  border-color: rgba(26,115,232,.18);
}

.btn.btn-xsmall{
  padding: 8px 12px !important;
  font-size: .86rem !important;
  border-radius: 12px !important;
  font-weight: 800 !important;
}


/* Topbar premium pills */
/* İstek: "Yeni Nesil Klinik Çözümler • CE Uyumlu" alanının arka planı */
.topbar{background: #062a69; border-bottom:1px solid rgba(255,255,255,.10)}
.topbar .meta{color: rgba(255,255,255,.82)}
.topbar .meta a{color:#fff; opacity:.92}
.topbar .meta a:hover{opacity:1}
.topbar .topbar-pills{display:flex; align-items:center; gap:10px}
.topbar .pill{
  display:inline-flex; align-items:center;
  padding: 7px 12px;
  border-radius: 999px;
  /* İstek: pill arka plandaki opak/blur efektini kaldır */
  background: transparent;
  border: 0;
  color: rgba(255,255,255,.90);
  font-weight: 900;
  font-size: 12.5px;
  letter-spacing:.2px;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
.topbar .pill-sep{opacity:.85; font-weight:900}
@media (max-width: 820px){
  .topbar .topbar-pills{gap:8px}
  .topbar .pill{padding:6px 10px; font-size: 12px}
}


}


/* Product page enhancements */
.summary-highlights{
  margin-top: 12px;
  border: 1px solid rgba(215,229,255,.95);
  background: rgba(245,248,255,.55);
  border-radius: 16px;
  padding: 12px 12px;
}
.summary-highlights .h{font-weight: 900; margin-bottom: 8px}
.summary-highlights ul{margin:0; padding-left: 18px; color: rgba(11,27,58,.82); line-height:1.55}
.summary-highlights li{margin: 6px 0}

.offices .card.pad{padding:16px}


/* Layout background & overflow fixes */
html, body{overflow-x:hidden}
body{background: #f7faff}

/* Live Support Widget */
.live-support{position:fixed; right:18px; bottom:18px; z-index: 9999; font-family: inherit}
.live-btn{
  display:flex; align-items:center; gap:10px;
  padding: 10px 14px;
  border-radius: 999px;
  border: 1px solid rgba(10,35,95,.14);
  background: rgba(255,255,255,.92);
  box-shadow: 0 14px 28px rgba(7,22,51,.14);
  font-weight: 900;
}
.live-btn .dot{
  width:10px; height:10px; border-radius:50%;
  background: #18c964;
  box-shadow: 0 0 0 6px rgba(24,201,100,.18);
}
.live-panel{
  position:absolute;
  right:0;
  bottom:56px;
  width: 320px;
  max-width: calc(100vw - 36px);
  border-radius: 18px;
  border: 1px solid rgba(215,229,255,.95);
  background:#fff;
  box-shadow: 0 20px 40px rgba(7,22,51,.18);
  overflow:hidden;
  transform: translateY(10px);
  opacity: 0;
  pointer-events:none;
  transition: opacity .16s ease, transform .16s ease;
}
.live-panel.open{opacity:1; transform: translateY(0); pointer-events:auto}
.live-head{display:flex; justify-content:space-between; gap:10px; align-items:flex-start; padding:12px 14px; background: rgba(245,248,255,.8); border-bottom:1px solid rgba(215,229,255,.95)}
.live-close{border:0; background:transparent; font-size:22px; line-height:1; padding:0 6px; cursor:pointer}
.live-body{padding:12px 14px}
.live-msg{padding:10px 12px; border-radius:14px; background: rgba(26,115,232,.08); border:1px solid rgba(26,115,232,.14); color: rgba(11,27,58,.90); line-height:1.5}
.live-actions{display:flex; gap:10px; margin-top:10px; flex-wrap:wrap}
.live-form{display:grid; gap:10px; margin-top:12px}
.live-form input, .live-form textarea{
  width:100%;
  border:1px solid rgba(215,229,255,.95);
  border-radius: 14px;
  padding: 10px 12px;
  background: rgba(245,248,255,.6);
}
@media (max-width: 820px){
  .live-support{right:12px; bottom:12px}
  .live-panel{bottom:54px}
}


/* Contact one-plane layout */
.contact-one{padding-top: 34px}
.contact-one-head{
  display:flex; justify-content:space-between; gap:16px; align-items:flex-start;
  padding: 18px;
  border:1px solid rgba(215,229,255,.95);
  border-radius: 20px;
  background: rgba(255,255,255,.90);
  box-shadow: 0 14px 28px rgba(7,22,51,.06);
}
.contact-one-quick{
  min-width: 280px;
  border: 1px solid rgba(215,229,255,.95);
  border-radius: 18px;
  background: rgba(245,248,255,.60);
  padding: 12px 12px;
}
.contact-one-quick .q{display:flex; flex-direction:column; gap:2px; padding:10px 10px; border-radius:14px; background: rgba(255,255,255,.70); border: 1px solid rgba(215,229,255,.70); margin-top:8px}
.contact-one-quick .q:first-child{margin-top:0}
.contact-one-quick span{color: var(--muted)}
.quick-actions{display:flex; gap:10px; margin-top:10px; flex-wrap:wrap}

.contact-one-grid{display:grid; grid-template-columns: .95fr 1.05fr; gap:16px; margin-top:16px; align-items:start}
@media (max-width: 980px){
  .contact-one-head{flex-direction:column}
  .contact-one-quick{min-width: unset; width:100%}
  .contact-one-grid{grid-template-columns:1fr}
}

/* Footer chips polish */
footer .chips{display:flex; gap:10px; flex-wrap:wrap; margin-top:12px}
footer .chips span{
  padding: 7px 12px;
  border-radius: 999px;
  background: rgba(255,255,255,.08);
  border: 0;
  color: rgba(255,255,255,.86);
  font-weight: 900;
  font-size: 12.5px;
}


/* --- Featured carousel (Index) --- */
.carousel{
  position: relative;
}
.carousel-track{
  display:flex;
  gap: 16px;
  overflow-x:auto;
  scroll-snap-type:x mandatory;
  scroll-padding: 8px;
  padding: 6px 2px 10px;
  -webkit-overflow-scrolling: touch;
}
.carousel-track::-webkit-scrollbar{ display:none; }
.carousel-item{
  scroll-snap-align:start;
  flex: 0 0 calc(25% - 12px);
}
@media (max-width: 980px){
  .carousel-item{ flex-basis: calc(50% - 10px); }
}
@media (max-width: 560px){
  .carousel-item{ flex-basis: 86%; }
}
.carousel-btn{
  position:absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 42px;
  height: 42px;
  border-radius: 999px;
  border: 1px solid rgba(215,229,255,.95);
  background: rgba(255,255,255,.92);
  box-shadow: var(--shadow-sm);
  color: var(--text);
  font-size: 22px;
  line-height: 1;
  display:grid;
  place-items:center;
  cursor:pointer;
  z-index: 3;
}
.carousel-btn:hover{ transform: translateY(-50%) scale(1.03); }
.carousel-btn.prev{ left: -10px; }
.carousel-btn.next{ right: -10px; }
@media (max-width: 980px){
  .carousel-btn{ display:none; } /* touch swipe */
}

/* --- Product promo video section --- */
.video-card{
  position: relative;
  border-radius: calc(var(--radius) + 6px);
  overflow:hidden;
  background: linear-gradient(180deg, rgba(11,95,255,.12), rgba(11,27,58,.10));
  border: 1px solid rgba(215,229,255,.9);
  box-shadow: var(--shadow);
}
.video-cover{
  width:100%;
  aspect-ratio: 16 / 7;
  display:block;
  border:0;
  padding:0;
  cursor:pointer;
  background:
    linear-gradient(90deg, rgba(11,27,58,.55), rgba(11,27,58,.15) 55%, rgba(11,27,58,.06)),
    url('../img/hero-photo-2.jpg');
  background-size: cover;
  background-position: center;
}
.video-cover .play{
  position:absolute;
  left: 26px;
  bottom: 26px;
  width: 58px;
  height: 58px;
  border-radius: 999px;
  display:grid;
  place-items:center;
  font-size: 18px;
  color: white;
  background: rgba(11,95,255,.92);
  box-shadow: 0 18px 40px rgba(11,95,255,.28);
}
.video-meta{
  position:absolute;
  left: 26px;
  top: 22px;
  right: 26px;
  display:flex;
  gap: 12px;
  align-items:center;
  justify-content:space-between;
  color: rgba(255,255,255,.92);
}
.video-meta strong{
  font-weight: 800;
  letter-spacing: .2px;
}
.video-meta span{
  font-weight: 700;
  font-size: 12.5px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.18);
}

.modal{
  position: fixed;
  inset: 0;
  background: rgba(3,10,22,.62);
  display:none;
  align-items:center;
  justify-content:center;
  padding: 18px;
  z-index: 9999;
}
.modal.open{ display:flex; }
.modal-inner{
  width: min(980px, 100%);
  border-radius: 18px;
  overflow:hidden;
  background: #0B1B3A;
  box-shadow: 0 22px 70px rgba(0,0,0,.35);
  position: relative;
}
.modal-close{
  position:absolute;
  top: 10px;
  right: 10px;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.15);
  /* İstek: pill arka plandaki opak/blur efektini kaldır */
  background: transparent;
  color: white;
  cursor:pointer;
  z-index: 2;
}
.video-frame{
  width:100%;
  aspect-ratio: 16 / 9;
}
.video-frame iframe{
  width:100%;
  height:100%;
  border:0;
}
body.modal-open{ overflow:hidden; }


/* === v29 polish: spacing & premium form === */
.card-actions{ margin-top:16px; gap:10px; flex-wrap:wrap; }
.card-body p + .card-actions{ margin-top:18px; }

.newsletter .newsletter-form,
.newsletter-form{
  display:flex;
  gap:12px;
  align-items:center;
  padding:10px;
  border-radius:16px;
  background: rgba(255,255,255,.72);
  border: 1px solid rgba(15, 23, 42, .10);
  box-shadow: 0 10px 28px rgba(2,6,23,.08);
  backdrop-filter: blur(8px);
}
.newsletter-form input[type="email"],
.newsletter-form input[type="text"]{
  flex:1;
  min-width: 220px;
  height: 46px;
  padding: 0 14px;
  border-radius: 12px;
  border: 1px solid rgba(15, 23, 42, .14);
  background: rgba(255,255,255,.92);
  outline: none;
}
.newsletter-form input:focus{
  border-color: rgba(37, 99, 235, .45);
  box-shadow: 0 0 0 4px rgba(37, 99, 235, .14);
}
.newsletter-form .btn{
  height: 46px;
  padding: 0 16px;
  border-radius: 12px;
}
@media (max-width: 720px){
  .newsletter .newsletter-form,
  .newsletter-form{
    flex-direction: column;
    align-items: stretch;
    padding: 12px;
  }
  .newsletter-form input{ min-width: 0; width: 100%; }
}




/* Dynamic products cards */
.prod-card{
  display:block;
  text-decoration:none;
  color:inherit;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(0,0,0,.22);
  border-radius:18px;
  overflow:hidden;
  transition:transform .18s ease, border-color .18s ease, background .18s ease;
}
.prod-card:hover{
  transform:translateY(-2px);
  border-color:rgba(255,255,255,.18);
  background:rgba(0,0,0,.28);
}
.prod-media{
  aspect-ratio:16/10;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:16px;
}
.prod-media img{
  width:100%;
  height:100%;
  object-fit:contain;
  display:block;
}
.prod-body{padding:14px 14px 16px;}
.prod-title{font-weight:800; letter-spacing:.1px;}
.prod-desc{opacity:.82; margin-top:6px; font-size:.95rem; line-height:1.35; min-height:2.7em;}
.prod-meta{margin-top:10px; display:flex; gap:8px; flex-wrap:wrap;}
.chip{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.12);
  background:rgba(0,0,0,.18);
  font-size:.82rem;
}
.chip-accent{border-color:rgba(255,255,255,.20);}


/* Footer address dynamic line */
.footer-address{color: rgba(255,255,255,.75); font-size: 12.5px; line-height: 1.45; max-width: 360px;}

/* Certificates section */
.cert-grid{display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:12px}
.cert-card{
  display:flex; gap:12px; align-items:center;
  padding:14px 14px;
  border-radius:18px;
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  text-decoration:none;
  color:inherit;
  transition: transform .18s ease, border-color .18s ease, background .18s ease;
}
.cert-card:hover{transform: translateY(-2px); border-color: rgba(255,255,255,.18); background: rgba(255,255,255,.06)}
.cert-ic{
  width:46px; height:46px;
  border-radius:14px;
  display:grid; place-items:center;
  background: rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
  color: rgba(255,255,255,.9);
}
.cert-ic svg{width:26px; height:26px}
.cert-txt b{display:block; font-size:14px}
.cert-txt span{display:block; margin-top:3px; font-size:12.5px; opacity:.78; line-height:1.35}
@media (max-width: 980px){.cert-grid{grid-template-columns:repeat(2, minmax(0,1fr));}}
@media (max-width: 520px){.cert-grid{grid-template-columns:1fr;}}


/* product price */
.card-price{margin-top:10px; font-size:13px; opacity:.92; display:flex; gap:8px; align-items:baseline}
.card-price b{font-weight:700}
.card-price span{opacity:.85}

.product-price{display:flex; gap:10px; align-items:center; margin-top:12px}
.product-price b{font-size:18px}

/* Product hero KPI layout (service/target/focus/support) */
.hero-badge{margin-bottom:10px}
.hero-kpis{
  margin-top:16px;
  display:grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap:12px;
}
.kpi-card{
  border:1px solid rgba(255,255,255,.10);
  background: rgba(255,255,255,.04);
  border-radius:18px;
  padding:14px 14px;
}
.kpi-card b{display:block; font-size:13.5px; letter-spacing:.2px}
.kpi-card small{display:block; margin-top:6px; opacity:.78; line-height:1.35}
.kpi-actions{margin-top:12px; display:flex; gap:10px; flex-wrap:wrap}
@media (max-width: 980px){
  .hero-kpis{grid-template-columns: repeat(2, minmax(0,1fr))}
}
@media (max-width: 520px){
  .hero-kpis{grid-template-columns: 1fr}
}

/* Product summary title + price */
.product-title{margin:0 0 10px; font-size:32px; line-height:1.1; letter-spacing:-.3px}
.product-price-row{display:flex; gap:10px; align-items:center; margin-bottom:12px}
.product-price-row b{font-size:18px}
@media(max-width:980px){.product-title{font-size:26px}}

/* Fixed CTA under service list */
.fixed-cta-under{
  margin-top:18px;
  display:flex;
  gap:14px;
  flex-wrap:wrap;
  align-items:stretch;
}
.fixed-cta-under .btn{
  padding:12px 16px;
  min-height:46px;
  border-radius:14px;
}



/* Fix: hide stray src text under gallery images */
/* Ürün detay kapak/galeri altında yanlışlıkla görünen metin parçalarını gizler */
.gallery-main{
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
  overflow: hidden !important;
}

/* Görseller normal kalsın */
.gallery-main img{
  display:block;
  width:100%;
  height:auto;
}

/* Eğer thumbs altında da stray metin olursa */
.gallery-thumbs{
  font-size: 0 !important;
  line-height: 0 !important;
  color: transparent !important;
  overflow: hidden !important;
}
.gallery-thumbs img{
  display:block;
  width:100%;
  height:auto;
}


/* Hero (photo-only slider) */
.hero.hero-photo-only{padding:0}
.hero-photo-only .hero-slide{
  background:#0b0b0f !important;
}
.hero-photo-only .hero-slide:before,
.hero-photo-only .hero-slide:after{display:none !important;}
.hero-photo-only .hero-slide .slide-inner{display:block; padding:0 !important; min-height:auto !important;}
.hero-photo-only .hero-photo{
  width:100%;
  height:auto;
  object-fit:contain;
  display:block;
  background:#0b0b0f;
}
.hero-photo-only .slider-controls{
  position:absolute;
  inset:auto 0 18px 0;
  z-index:3;
  display:flex;
  justify-content:center;
  pointer-events:none;
}
.hero-photo-only .slider-controls .dots{pointer-events:auto}
@media (max-width: 560px){
  .hero-photo-only .hero-photo{height: 340px; object-fit: cover;}
  .hero-photo-only .slider-controls{inset:auto 0 14px 0;}
}

/* =========================
   3 Adımda Teklif Al
   ========================= */
.quote-steps .qs-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
}
.quote-steps .qs-card{
  display:flex;
  gap:14px;
  padding:16px;
  border-radius:16px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.04);
}
.quote-steps .qs-ic{
  width:44px;
  height:44px;
  border-radius:14px;
  display:flex;
  align-items:center;
  justify-content:center;
  background:rgba(255,255,255,.08);
  flex:0 0 auto;
}
.quote-steps .qs-ic svg{ width:22px; height:22px; fill:currentColor; opacity:.92; }
.quote-steps .qs-step{
  font-size:12px;
  font-weight:800;
  text-transform:uppercase;
  letter-spacing:.08em;
  opacity:.72;
}
.quote-steps h3{ margin:6px 0 6px; font-size:18px; letter-spacing:-.01em; }
.quote-steps p{ margin:0; opacity:.82; line-height:1.5; }
.quote-steps .qs-actions{ margin-top:10px; display:flex; gap:10px; flex-wrap:wrap; }
.quote-steps .qs-note{
  margin-top:14px;
  padding:12px 14px;
  border-radius:14px;
  border:1px dashed rgba(255,255,255,.18);
  background:rgba(255,255,255,.03);
  opacity:.9;
}
@media (max-width: 980px){
  .quote-steps .qs-grid{ grid-template-columns:1fr; }
}