#main:has(.kb) { background:#fff; }
.kb {
  --ink: #102e42;
  --blue: #007fb3;
  --text: #405768;
  --line: #c8dce6;
  --pad: 0px;
  margin-inline: var(--site-content-left, 20px) var(--site-content-right, 20px);
  padding-bottom: 14px;
  background: #fff;
  color: var(--ink);
  line-height: 1.4;
  color-scheme: light;
}
.kb * { box-sizing: border-box; min-width: 0; }
.kb [hidden] { display: none!important; }
.kb :is(h1,h2,h3,p,figure) { margin: 0; }
.kb :is(h1,h2,h3) { line-height: 1.06; color: var(--ink); letter-spacing: -.04em; }
.kb h1 { font-size: clamp(36px,4.6vw,68px); }
.kb h2 { font-size: clamp(29px,3.2vw,46px); }
.kb h3 { font-size: clamp(20px,2.35vw,35px); }
.kb p { color: var(--text); line-height: 1.5; font-size: clamp(14px,1.28vw,20px); }
.kb a { color: #006f9c; text-decoration: none; }
.kb :is(button,input,select,textarea) { font: inherit; color: inherit; }
.kb :is(button,summary,label:has(input)) { cursor: pointer; }
.kb :is(a,button,input,select,summary,textarea):focus-visible { outline: 3px solid #008abb; outline-offset: 3px; }
.kb .kb-button { display: inline-flex; align-items:center; justify-content: center; min-height: 44px; padding: 9px 16px; background: linear-gradient(120deg,#008fbd,#007aa7); color: white; border-radius: 5px; font-weight: 650; }
.kb .kb-button:hover { background: #066d96; }
.kb-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); }
.kb :is(.kb-group,.kb-list,.kb-nav) { scroll-margin-top: 110px; }
.kb-hero {
  display:grid;
  grid-template-columns: minmax(0,.8fr) minmax(0,1fr);
  grid-template-rows: auto 1fr;
  grid-template-areas: "crumb scene" "heading scene";
  align-items:center;
  gap:0 clamp(12px,2vw,28px);
  padding-block:clamp(14px,2vw,28px);
}
.kb-hero nav { grid-area:crumb; }
.kb-hero { border-bottom:1px solid var(--line); }
.kb-hero figure:after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(90deg,#fff,transparent 8%); }
.kb-hero figure { grid-area:scene; position:relative; margin:0; }
.kb-hero img { display:block; width:100%; height:auto; border-radius:8px; }
.kb-hero figcaption { position:absolute; inset:0; pointer-events:none; z-index:1; }
.kb-hero figcaption a { position:absolute; display:inline-flex; align-items:center; min-height:44px; padding-inline:10px; font-size:clamp(11px,.95vw,15px); font-weight:650; color:var(--ink); pointer-events:auto; isolation:isolate; }
.kb-hero figcaption a:before { content:""; position:absolute; z-index:-1; inset:7px 0; border-radius:4px; background:#ffffffed; border-left:2px solid var(--blue); box-shadow:0 2px 10px #13334616; }
.kb-hero figcaption a:nth-child(1){ left:6%; top:9%; }
.kb-hero figcaption a:nth-child(2){ right:3%; top:51%; }
.kb-hero figcaption a:nth-child(3){ left:4%; bottom:5%; }
.kb-eyebrow { display:block; margin-bottom:12px; font-size:clamp(11px,.85vw,14px); text-transform:uppercase; letter-spacing:.12em; font-weight:650; color:#00749c; }
.kb-hero nav { display: flex; gap: 8px; align-items:center; flex-wrap:wrap; font-size: clamp(11px,1vw,15px); color:var(--text); }
.kb-hero nav a { display:inline-flex; align-items:center; min-height:44px; }
.kb-hero>div { grid-area:heading; padding-block:18px; }
.kb-hero h1:after { content:""; display:block; height:3px; width:58px; background:#0798be; margin:15px 0; }
.kb-hero p { font-size:clamp(17px,2vw,29px); }
.kb-hero-links { display:flex; align-items:center; flex-wrap:wrap; gap:8px 22px; margin-top:20px; }
.kb-hero-links a:not(.kb-button) { border-bottom:1px solid var(--blue); display:inline-flex; align-items:center; min-height:44px; }
.kb-nav { margin-inline:var(--pad); display:grid; grid-template-columns:repeat(4,1fr); border-bottom:2px solid var(--line); }
.kb-nav a { position:relative; display:flex; align-items:center; justify-content:center; gap:9px; min-height:clamp(55px,7vw,95px); font-weight:650; color:var(--ink); }
.kb-nav a+a:before { content:""; height:20px; width:1px; background:var(--line); position:absolute; left:0; }
.kb-nav a[aria-current]:after { content:""; position:absolute; inset:auto 0 -2px; height:3px; background:var(--blue); }
.kb-nav svg { width:clamp(25px,3.6vw,52px); fill:none; stroke:currentColor; stroke-width:1; stroke-linejoin:round; }
.kb-group { margin-inline:var(--pad); padding-block:clamp(18px,3vw,48px) 1.5vw; }
.kb-group small { font-size:clamp(11px,1.2vw,16px); color:#006e99; text-transform:uppercase; letter-spacing:.08em; font-weight:650; }
.kb-group header { display:grid; grid-template-columns:1.48fr 1fr; align-items:center; gap:3%; margin:12px 0 clamp(16px,2.7vw,39px); }
.kb-group header p { border-left:2px solid #84c2dc; padding-left:6%; }
.kb-pair { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:clamp(12px,2.5vw,36px); }
.kb-card { display:grid; grid-template-columns:59% 41%; align-items:stretch; border-radius:10px; overflow:hidden; background:linear-gradient(115deg,#edf5f9,#fcfdfe 80%,#eaf3f8); }
.kb-card img { display:block; width:100%; height:100%; object-fit:cover; clip-path:polygon(0 0,100% 0,84% 100%,0 100%); }
.kb-card>div { display:flex; flex-direction:column; align-items:start; justify-content:center; padding:clamp(12px,1.7vw,24px) 9% clamp(10px,1.4vw,20px) 0; }
.kb-card p { font-size:clamp(13px,1.22vw,18px); margin:8px 0 12px; }
.kb-card a { display:inline-flex; align-items:center; gap:12px; min-height:44px; font-weight:600; }
#km-concrete .kb-card { min-height:clamp(195px,21vw,300px); }
.kb-list { margin:clamp(22px,3vw,45px) var(--pad) 0; background:linear-gradient(125deg,#eef7fae8,#f7fbfdf2 55%,#e3f1f7); border-radius:12px; display:grid; grid-template-columns:.86fr 1.42fr 1fr; gap:3%; align-items:start; padding:clamp(20px,3vw,48px); position:relative; isolation:isolate; }
.kb-list:before { content:""; position:absolute; bottom:0; left:0; width:16%; height:25%; z-index:-1; background:url('/images/karacabey-materials-design/plans.webp') no-repeat left bottom / contain; opacity:.65; }
.kb-list h2,.kb-region h2 { font-size:clamp(24px,3.2vw,46px); }
.kb-list p,.kb-region p { margin-top:10px; }
.kb-table-head,.kb-entry { display:grid; grid-template-columns:1.35fr 1fr .83fr; align-items:center; gap:8px; }
.kb-table-head { font-size:.85em; border-bottom:1px solid var(--line); padding:0 0 6px; }
.kb-entry { border-bottom:1px solid #dce9ee; }
.kb-entry label { display:flex; align-items:center; gap:7px; min-height:44px; font-weight:600; }
.kb-entry input[type=checkbox] { accent-color:var(--blue); flex:none; }
.kb-entry :is(input[type=text],select),.kb-fallback textarea { width:100%; min-height:32px; background:white; border:1px solid #a9c2cf; border-radius:4px; padding:3px 6px; }
.kb-entry :disabled { opacity:.58; }
.kb-entry [aria-invalid=true] { border-color:#a14533; }
.kb-list aside { padding-left:8%; border-left:1px solid var(--line); }
.kb-list output,.kb-list small { display:block; color:var(--text); margin:9px 0; white-space:pre-line; }
.kb-list button { min-height:44px; border:0; background:transparent; color:#006c97; text-decoration:underline; }
.kb-list button:disabled { color:#667580; }
.kb-fallback textarea { display:block; min-height:90px; }
.kb-region { margin-inline:var(--pad); display:grid; grid-template-columns:1fr 1fr; gap:4%; align-items:center; padding-block:2.5vw; }
.kb-region address { border-left:1px solid var(--line); padding-left:9%; font-style:normal; }
.kb-region address p { margin:4px 0 8px; }
.kb-region address a { display:inline-flex; align-items:center; min-height:44px; }
@media(min-width:651px) and (max-width:980px){
  .kb-list { grid-template-columns:.77fr 1.4fr 1fr; padding:20px; gap:2%; font-size:14px; }
  .kb-card p,.kb-group header p { font-size:13px; }
}
@media(max-width:650px){
  .kb-hero { grid-template-columns:1fr; grid-template-areas:"crumb" "heading" "scene"; gap:0; }
  .kb-hero>div { padding-block:12px 18px; }
  .kb-hero nav { font-size:11px; gap:6px; }
  .kb-hero h1 { font-size:clamp(40px,8.5vw,55px); }
  .kb-nav { grid-template-columns:1fr 1fr; }
  .kb-nav a { justify-content:start; min-height:48px; }
  .kb-nav a:before { display:none; }
  .kb-nav svg { width:25px; }
  .kb-pair,.kb-group header,.kb-list,.kb-region { grid-template-columns:1fr; }
  .kb-group header { gap:10px; }
  .kb-group header p { padding-left:12px; }
  .kb-card { grid-template-columns:49% 51%; }
  #km-concrete .kb-card { min-height:0; }
  .kb-card>div { padding-block:14px; }
  .kb-card p { margin:7px 0 3px; }
  .kb-list { gap:16px; padding:18px 13px; }
  .kb-list:before { display:none; }
  .kb-list aside { padding:12px 0 0; border:0; border-top:1px solid var(--line); }
  .kb-entry :is(input[type=text],select) { min-height:44px; margin:2px 0; }
  .kb-region { gap:16px; padding-block:24px; }
  .kb-region address { padding-left:12px; }
}

.kb-card picture { display:block; position:relative; min-height:120px; }
.kb-card picture img { position:absolute; inset:0; }

.kb-contact { display:flex; flex-wrap:wrap; gap:5px 10px; }
@media(min-width:651px) and (max-width:840px){
  .kb-hero-links { gap:10px; font-size:13px; }
  .kb-hero-links .kb-button { padding-inline:10px; }
}
@media(max-width:650px){.kb-region { grid-template-columns:1fr; }}

@media(min-width:651px) and (max-width:1040px) {
  .kb-list { grid-template-columns:.85fr 1.35fr; gap:18px; padding:20px; }
  .kb-list aside { grid-column:1/-1; border-left:0; border-top:1px solid var(--line); padding:12px 0 0; }
  .kb-list aside p { display:inline; margin-left:6px; }
  .kb-region { grid-template-columns:1fr 1.35fr; }
}
.kb-nav a { text-align:center; }
.kb-group header { align-items:center; }
.kb-card { border:1px solid #e4eef3; }
.kb-list aside { overflow-wrap:anywhere; }
@media(prefers-reduced-motion:no-preference) { .kb-card img { transition:filter .2s; } .kb-card:hover img { filter:contrast(1.04); } }
