/* Re-layout of the existing teacher guide; no content or link changes. */
body[data-site-page="dijital-araclar"] { --side: 32px; --max: 1200px; }
.hero .hero-copy { max-width: none; display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr); column-gap: 66px; }
.hero .eyebrow { grid-column: 1 / -1; margin-bottom: 24px; }
.hero h1 { grid-column: 1; grid-row: 2 / 5; font-family: 'IBM Plex Sans', sans-serif; font-size: clamp(44px, 5.2vw, 68px); line-height: 1.03; letter-spacing: -.055em; margin: 0; max-width: 14ch; }
.hero .lead { grid-column: 2; margin-bottom: 24px; font-size: 16px; }
.hero .hero-actions { grid-column: 2; gap: 20px; }
.hero .indep-line { grid-column: 2; color: var(--family-muted); font-size: 11px; margin-bottom: 0; }
.arch-word { display: none; }
.hero { padding-bottom: 48px; border-bottom: 0; }
.hero .accent { text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 8px; }
.btn-fill { text-transform: none; }
.btn-ghost { font: 600 12px 'IBM Plex Sans', sans-serif; text-transform: none; }
.ticker { background: #eeeef0; border-color: var(--family-line); }
.ticker-inner { padding-block: 18px; gap: 12px 20px; }
.ticker .chip { padding: 5px 0; border: 0; border-bottom: 1px solid #22242d45; white-space: normal; }
.ticker .chip:hover { background: none; color: var(--family-accent); border-bottom-color: currentColor; }
.tool-search-bar { display: grid; grid-template-columns: 240px minmax(0, 1fr); column-gap: 34px; align-items: center; padding-block: 30px; }
.tool-search-bar label { color: var(--family-ink); line-height: 1.6; margin: 0; }
.tool-search-bar input { border-color: #22242d65; min-height: 52px; background: #f6f7f8; padding-inline: 18px; }
.tool-search-bar p { grid-column: 2; margin-top: 10px; }
section.block { display: grid; grid-template-columns: 280px minmax(0, 1fr); column-gap: 48px; padding-block: 56px; border-bottom-color: var(--family-line); }
section.block[hidden], .profile[hidden] { display: none !important; }
.section-head { grid-column: 1; grid-row: 1 / span 8; align-self: start; position: sticky; top: 156px; max-width: none; margin: 0; }
.section-head h2 { font: 700 clamp(28px, 3vw, 36px)/1.1 'IBM Plex Sans', sans-serif; letter-spacing: -.04em; margin-block: 14px 18px; }
.section-head p { font-size: 14px; line-height: 1.65; }
.section-head .kicker { font-size: 10px; margin: 0; color: var(--family-accent); }
.profile { grid-column: 2; display: grid; grid-template-columns: 1fr 1fr; column-gap: 30px; padding: 28px; border: 0; border-top: 3px solid #365248; background: #f3f6f4; }
.profile + .profile { margin-top: 28px; }
.profile:nth-of-type(even) { border-top-color: var(--family-accent); background: #fff5f2; }
.profile-top { grid-column: 1 / -1; align-items: center; margin-bottom: 14px; gap: 12px; }
.profile h3 { font: 700 28px/1.12 'IBM Plex Sans', sans-serif; letter-spacing: -.035em; }
.profile .kaynak-link { color: var(--family-ink); padding-block: 7px; white-space: normal; overflow-wrap: anywhere; }
.profile .tagline { grid-column: 1 / -1; font-size: 15px; line-height: 1.6; margin-bottom: 22px; }
.field { display: block; border-top: 1px solid var(--family-line); padding-block: 20px; }
.field:first-of-type { border-top: 1px solid var(--family-line); }
.field-label { color: #365248; font-size: 10px; margin-bottom: 10px; padding: 0; }
.field-value { font-size: 14px; line-height: 1.7; }
.field-value ol { padding-left: 20px; }
.field-value li { padding-left: 4px; margin-bottom: 7px; }
.note { grid-column: 1 / -1; border: 0; border-left: 2px solid var(--family-accent); background: #fff; margin-top: 10px; padding: 18px 20px; font-size: 13px; line-height: 1.65; }
.note strong { font-size: 10px; }
#nav { display: block; }
#nav .section-head { position: static; display: grid; grid-template-columns: 1fr 1fr; gap: 12px 48px; margin-bottom: 32px; }
#nav .section-head .kicker { grid-column: 1 / -1; }
#nav .section-head h2 { margin: 0; }
#nav .section-head + div { display: grid; grid-template-columns: 1fr 1fr; column-gap: 38px; }
.need-row { grid-template-columns: 36px minmax(0, 1fr); align-content: start; gap: 10px 14px; padding: 24px 14px; border-top: 1px solid var(--family-line); min-height: 160px; }
.need-row:first-child { border-top: 1px solid var(--family-line); }
.need-num { font: 500 13px 'IBM Plex Mono', monospace; color: var(--family-accent); }
.need-body .q { font: 600 19px/1.25 'IBM Plex Sans', sans-serif; }
.need-body .a { margin-top: 6px; font-size: 13px; }
.need-links { grid-column: 2; justify-self: start; padding-top: 0; }
.need-links a { border-bottom: 1px solid #22242d45; padding-block: 4px; }
.need-row:hover, .need-row:focus-within { background: #e5ece8; transform: none; }
#kaynaklar { display: block; }
#kaynaklar .section-head { position: static; max-width: 700px; margin-bottom: 28px; }
#kaynaklar .chip { background: #eeeef0; border: 0; padding: 12px 16px; white-space: normal; }
#kaynaklar .chip:hover { background: var(--family-ink); color: white; }
#hakkinda { display: block; padding-block: 30px; }
.disclosure { max-width: none; border: 0; border-left: 2px solid #365248; background: #e5ece8; padding: 24px 28px; font-size: 13px; }
input:focus-visible, a:focus-visible, button:focus-visible { outline: 2px solid var(--family-accent); outline-offset: 4px; }
@media (max-width: 1000px) {
  .hero .hero-copy { column-gap: 32px; }
  .hero h1 { font-size: 48px; }
  section.block { grid-template-columns: 210px minmax(0, 1fr); gap: 30px; }
  .profile { padding: 24px; grid-template-columns: 1fr; }
  .profile-top, .profile .tagline, .note { grid-column: 1; }
  .tool-search-bar { grid-template-columns: 210px minmax(0, 1fr); gap: 10px 30px; }
  .profile h3 { font-size: 26px; }
}
@media (max-width: 700px) {
  body[data-site-page="dijital-araclar"] { --side: 18px; }
  .hero .hero-copy { display: block; }
  .hero h1 { font-size: clamp(40px, 10vw, 54px); margin-bottom: 28px; }
  .hero .eyebrow { margin-bottom: 20px; }
  .hero { padding-block: 32px; }
  .hero .lead { margin-bottom: 24px; }
  .hero .accent { text-underline-offset: 6px; }
  .tool-search-bar { display: block; }
  .tool-search-bar label { margin-bottom: 12px; }
  section.block { display: block; padding-block: 40px; }
  .section-head { position: static; margin-bottom: 26px; }
  .profile { padding: 24px 20px; }
  .profile-top { align-items: start; }
  .profile h3 { font-size: 25px; }
  #nav .section-head { display: block; }
  #nav .section-head h2 { margin-block: 12px 18px; }
  #nav .section-head + div { grid-template-columns: 1fr; }
  .need-row { padding: 22px 10px; min-height: 0; }
  .need-links { grid-column: 2; margin-top: 0; }
}
@media print {
  section.block { display: block; }
  .section-head { position: static; }
  .profile { break-inside: avoid; background: white; }
}