/* Marmara Pert V11 — İstanbul topic hub. Existing design tokens/components are reused. */
.istanbul-hub-hero .hero-desc{max-width:820px}
.istanbul-hub-hero .hero-buttons{margin-top:24px;display:flex;gap:12px;flex-wrap:wrap}
.hub-section-first{padding-top:42px}
.istanbul-hub-content>section{scroll-margin-top:118px}

.answer-box-v11{
  background:var(--bg-card);
  border:1px solid var(--border);
  border-left:4px solid var(--accent);
  border-radius:var(--radius);
  padding:24px;
  margin:0 0 34px;
}
.answer-box-v11 h2{margin:8px 0 12px}
.answer-box-v11 p{margin:0}
.answer-label-v11{display:inline-flex;align-items:center;gap:8px;color:var(--accent);font-weight:700;font-size:.82rem;text-transform:uppercase;letter-spacing:.05em}

.hub-service-section{margin:34px 0}
.focus-grid-v11{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:20px}
.focus-card-v11{
  display:flex;align-items:flex-start;gap:14px;padding:18px;
  background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);
  transition:transform var(--transition),border-color var(--transition),background var(--transition);
}
.focus-card-v11:hover{border-color:var(--accent);transform:translateY(-2px)}
.focus-card-v11>i{width:38px;height:38px;border-radius:11px;display:grid;place-items:center;background:rgba(244,123,32,.12);color:var(--accent);flex:0 0 auto}
.focus-card-v11 span{min-width:0;display:block}
.focus-card-v11 strong{display:block;color:var(--text-primary);margin-bottom:4px}
.focus-card-v11 small{display:block;color:var(--text-secondary);font-size:.82rem;line-height:1.55}

.istanbul-hub-content .authority-section{margin:38px 0}
.istanbul-hub-content .authority-section>h2{margin-bottom:14px}
.istanbul-hub-content .authority-section>p:last-child{margin-bottom:0}
.decision-grid-v11{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin:20px 0}
.decision-card-v11{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);padding:18px;min-width:0}
.decision-card-v11 strong{display:block;color:var(--text-primary);margin-bottom:6px}
.decision-card-v11 p{margin:0;color:var(--text-secondary);font-size:.9rem}

.criteria-list-v11{counter-reset:none;display:grid;gap:10px;margin:20px 0;padding-left:1.2rem}
.criteria-list-v11 li{padding-left:4px;color:var(--text-secondary);line-height:1.75}
.criteria-list-v11 strong{color:var(--text-primary)}

.semantic-table-v11{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed;margin:20px 0;border:1px solid var(--border);border-radius:var(--radius-sm);overflow:hidden;background:var(--bg-card)}
.semantic-table-v11 th,.semantic-table-v11 td{padding:14px 16px;border-bottom:1px solid var(--border);vertical-align:top;text-align:left;overflow-wrap:anywhere}
.semantic-table-v11 thead th{background:rgba(244,123,32,.09);color:var(--text-primary)}
.semantic-table-v11 tbody th{width:30%;color:var(--text-primary)}
.semantic-table-v11 tbody td{color:var(--text-secondary)}
.semantic-table-v11 tr:last-child th,.semantic-table-v11 tr:last-child td{border-bottom:0}

.process-list-v11{list-style:none;padding:0;margin:20px 0;display:grid;gap:12px}
.process-list-v11 li{display:grid;grid-template-columns:40px minmax(0,1fr);gap:12px;align-items:start;padding:16px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm)}
.process-list-v11 li>span{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:var(--accent);color:#08111d;font-weight:800}
.process-list-v11 strong{display:block;color:var(--text-primary);margin-bottom:3px}
.process-list-v11 p{margin:0;color:var(--text-secondary);font-size:.9rem}

.source-note-v11{display:flex;gap:10px;align-items:flex-start;padding:14px 16px;background:rgba(244,123,32,.07);border:1px solid rgba(244,123,32,.22);border-radius:var(--radius-sm);font-size:.88rem}
.source-note-v11 i{color:var(--accent);margin-top:.22rem;flex:0 0 auto}
.source-note-v11 a{color:var(--accent);text-decoration:underline;text-underline-offset:2px}

.istanbul-ilce-grid-v11{grid-template-columns:repeat(4,minmax(0,1fr))}
.resource-grid-v11{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:20px 0}
.resource-grid-v11>a{display:flex;gap:12px;padding:16px;background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-sm);min-width:0}
.resource-grid-v11>a:hover{border-color:var(--accent)}
.resource-grid-v11 i{color:var(--accent);margin-top:3px;flex:0 0 auto}
.resource-grid-v11 span{min-width:0}
.resource-grid-v11 strong{display:block;color:var(--text-primary);margin-bottom:4px}
.resource-grid-v11 small{display:block;color:var(--text-secondary);font-size:.82rem;line-height:1.5}
.editorial-note-v11{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:14px 16px;border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-secondary);font-size:.82rem}
.editorial-note-v11 strong{color:var(--text-primary)}
.hub-inline-cta-v11{margin-top:38px}

/* Better visible keyboard focus without altering the design language. */
.istanbul-hub-content a:focus-visible,.istanbul-hub-hero a:focus-visible,.istanbul-ilce-grid-v11 a:focus-visible{outline:3px solid var(--accent);outline-offset:3px}

@media (max-width:768px){
  body{padding-bottom:calc(72px + env(safe-area-inset-bottom))}
  .sticky-bar{padding-bottom:env(safe-area-inset-bottom)}
  .istanbul-hub-hero .hero-buttons{display:grid;grid-template-columns:1fr;width:100%}
  .istanbul-hub-hero .hero-buttons .btn{width:100%;white-space:normal}
  .focus-grid-v11,.decision-grid-v11,.resource-grid-v11{grid-template-columns:1fr}
  .istanbul-ilce-grid-v11{grid-template-columns:repeat(3,minmax(0,1fr))}
  .semantic-table-v11 th,.semantic-table-v11 td{padding:12px 10px;font-size:.84rem}
  .semantic-table-v11 tbody th{width:32%}
  .answer-box-v11{padding:20px}
}
@media (max-width:480px){
  .hub-section-first{padding-top:30px}
  .istanbul-ilce-grid-v11{grid-template-columns:repeat(2,minmax(0,1fr))}
  .process-list-v11 li{grid-template-columns:34px minmax(0,1fr);padding:14px}
  .process-list-v11 li>span{width:32px;height:32px;font-size:.85rem}
  .semantic-table-v11 th,.semantic-table-v11 td{font-size:.78rem;padding:10px 8px}
  .editorial-note-v11{display:grid;gap:6px}
}
