/* ==========================================================================
   NEXT GEO — page stylesheet for the FAQ PAIR
     TR  4932   /sss/          EN  25563  /en/faq/
   One authored sheet for both; ng-page-apply.php --css-from copies it to
   faq.css so the pair cannot drift.

   Loads last:
     ng-foundation → ng-components → ng-mobile → ng-shared → THIS FILE
   so a rule here at equal specificity beats all four. ng-shared.css owns
   everything not specific to this page — check there before adding anything,
   and never edit it: two agents are converting pages at the same time.

   ---------------------------------------------------------------------------
   WHAT THIS PAGE IS FOR, AND WHY IT LOOKS LIKE THIS

   /sss/ is the only P0 leaf whose problem was NOT thinness. 401 TR / 487 EN
   words of genuine question-and-answer — the densest real content of any leaf
   page on this site. The defect was presentation, and it was severe. Measured
   before-state, from ng-page-check at 1440/390 and a parse of the
   locally-fetched HTML:

     - The only h1 was the theme banner's and it read "SSS" — three characters
       over a stock 3D question-mark render occupying ~340px of viewport. The
       page's real title, "Sıkça Sorulan Sorular (SSS)", was an h2.
     - Heading outline h1 → h2 → h4 → h4 → h3 → h3 → h3. The two most
       important questions were h4s sitting ABOVE the three h3 group headings.
     - Eleven of the thirteen answers were locked inside Elementor accordion
       widgets whose opening script LiteSpeed delays behind a user
       interaction. /root/ng-shots/sss-390.png, taken before this pass: eleven
       closed rows, no answer text, no visible affordance that they open.
     - Those rows measured 320×26px at 390 — ng-page-check DEFECTS, both
       pages, WCAG 2.5.5 wants 44×44. TR: 2 targets. EN: 3.
     - ZERO links in the whole content area, on a page where every answer
       names something this site has a page for. No CTA either: the page
       dead-ended into the footer.
     - A trailing Elementor section with an empty column and a #310510
       background produced a 140px blank band — 4.0% of page height at 1440.
     - No FAQPage structured data, on the one page where the type is an exact
       fit and Rank Math is already installed.
     - 22,852 bytes of _elementor_data for 401 words, including six dead
       hotlinks to demo.artureanec.com accordion-arrow SVGs.

   So the work here was not "add words". It was: give the answers a real h1
   and a correct outline, make them openable with no JavaScript at all, make
   every list look like a list, link the six answers that name a page on this
   site, and end the page on a decision instead of a footer.

   ---------------------------------------------------------------------------
   THE FOUR BANDS AND THE SURFACE ROLES

     10 masthead   ground   copy + a five-row "kısa cevaplar" record card
     20 başlarken  ground   the two definitional answers, permanently open
     30 sorular    MIST     three white plates of <details> rows
     40 cta        indigo   the one decision

   Two surface roles only, as the contract sets them: raised (white +
   hairline + soft shadow) holds text; sunken (mist + hairline) holds white
   chrome. Band 30 is the sunken one and the three question plates are the
   white chrome it holds — which is also what makes the three groups read as
   three objects rather than as one 900px list with headings in it.

   The alternative was all four bands on the ground with hairline rules
   between question rows, closer to the original. Rejected on the 390
   screenshot: eleven hairline rows on one flat ground is exactly the
   undifferentiated list that made the old page unreadable, and a mist band
   is the cheapest way to say "this part of the page is a different kind of
   thing" without adding a single graphic.

   ---------------------------------------------------------------------------
   REAL CONTENT ONLY. All thirteen answers are the client's own. Where a
   sentence was rewritten it was to pull a list out of it, never to add or
   drop an item, and the connective prose ("Yapay zekâ modellerimiz şu
   alanlarda aktif olarak kullanılır:") keeps the original verb. The only
   number on the page, 1–3 iş günü, is the client's own stated standard and
   keeps their own qualifier beside it. "on üç soru", "üç başlık" and "on
   dört sektör" are countable — thirteen questions on this page, three
   groups on this page, fourteen published sector pages. There is no client
   count, no accuracy percentage, no case-study result, no testimonial and no
   illustrative figure anywhere on either page, so nothing here needed the
   homepage's "Örnek çıktı. Sayılar temsilîdir." label.

   One spelling fix: the source answer wrote "dökümantasyon". The word is
   "dokümantasyon".
   ========================================================================== */


/* ==========================================================================
   1. MASTHEAD — copy column, jump chips, and the answer card

   The masthead keeps ng-shared.css §4 wholesale: 58/42 at ≥960, clamp()
   headline, optional aside. Only three things are added.
   ========================================================================== */

/* The jump row. .ng-actions--chips rather than plain .ng-actions because
   ng-shared §12 stacks a plain action row full-bleed at ≤767 — right for two
   buttons that are two answers to one question, wrong for three chips that
   are an index. --chips is the documented opt-out and keeps them a wrapping
   row at every width.
   28px is ng-shared's action-row top margin; 22px here because the row
   follows a lede rather than a headline and the chips are visually lighter
   than a pair of pills. */
.ng-v2 .ng-sss-mh__jump{ margin-top:22px; }

/* The count badge inside a chip. 12px at 0.1em is the tracked-label
   exception in the contract (and what ng-page-check partitions as label type
   rather than small body copy); it is glanced at, never read. Mist fill
   rather than accent, because the chip's own label is the thing being read
   and a second magenta object beside it competes. */
.ng-v2 .ng-sss-mh__n{
  display:inline-flex; align-items:center; justify-content:center;
  min-width:22px; height:20px; margin-left:8px; padding:0 6px;
  border-radius:var(--ng-radius-pill);
  background:var(--ng-surface-sunken);
  font-family:var(--ng-font-label); font-weight:600;
  font-size:12px; line-height:1; letter-spacing:.1em;
  text-transform:none;                /* digits, but the rule is the rule */
  color:var(--ng-muted);
}

/* ---- the answer card in the aside ---------------------------------------
   WHY A RECORD CARD AND NOT AN IMAGE. ng-shared makes the masthead aside
   optional and the copy simply takes the full measure without one, so the
   honest options were "nothing" or "something a visitor actually wants".
   This page has no product screenshot to show, and a stock illustration is
   precisely what was wrong with the banner this rebuild removes.

   Every value in the card is lifted out of an answer below — 1–3 iş günü,
   PDF/Excel/PNG/JPEG, the six named sources, bulut veya kurum içi, API. A
   visitor who came for one number gets it before scrolling; the note says
   where the detail is. Same reasoning as the künye aside on /biz-kimiz/:
   a record card carries more checkable fact per pixel than a photograph. */
.ng-v2 .ng-sss-quick{
  padding:24px 22px;
  background:var(--ng-surface);
  border:1px solid var(--ng-hairline);
  border-radius:var(--ng-radius);
  box-shadow:var(--ng-shadow-card);
}
.ng-v2 .ng-sss-quick__label{ margin:0 0 4px; }

/* dl reset. The theme leaves dd at the UA's margin-inline-start:40px, which
   would indent every value by 40px inside a 42%-wide column. */
.ng-v2 .ng-sss-quick__list{ margin:0; padding:0; }
.ng-v2 .ng-sss-quick__row{
  display:grid; gap:2px;
  padding:14px 0;
  border-bottom:1px solid var(--ng-hairline);
}
.ng-v2 .ng-sss-quick__row:last-child{ border-bottom:0; padding-bottom:4px; }
.ng-v2 .ng-sss-quick__k{
  margin:0;
  font-family:var(--ng-font-label); font-weight:600;
  font-size:12px; line-height:1.35; letter-spacing:.1em;
  text-transform:none;   /* "KURULUM SÜRESİ" is authored uppercase: the case
                            engine maps i→I and would print "KURULUM SURESI" */
  color:var(--ng-muted);
}
.ng-v2 .ng-sss-quick__v{
  margin:0;              /* dd's UA margin-inline-start */
  font-size:15px; line-height:1.5;
  color:var(--ng-ink);
}
.ng-v2 .ng-sss-quick__note{ margin-top:16px; }


/* ==========================================================================
   2. BAŞLARKEN — the two permanently-open answers

   No new component: .ng-grid--2 + .ng-card + .ng-card__title, all from
   ng-shared, which also means these two cards inherit the reveal fix in
   ng-shared §10 and the 22px mobile padding without a line here.

   The only page-level rule is the meta label's colour. .ng-card__meta is
   muted by default, which is right for a date or a category; here it is a
   position marker ("TEMEL SORU 01") for the two questions that do not
   collapse, and the accent is what visually ties them to the numbered rows
   in band 30. --ng-accent, never --ng-accent-display: 12px is far under the
   24px floor that token is reserved for.
   ========================================================================== */
.ng-v2 .ng-sss-basic .ng-card__meta{ color:var(--ng-accent); }
.ng-v2 .ng-sss-basic .ng-card__body{ margin-top:12px; }


/* ==========================================================================
   3. THE QUESTION BAND — group rail + white plate

   Two columns at ≥960: a left rail carrying the group's eyebrow count, h2
   and one-line lede, and the plate of questions on the right. This is the
   docs-index shape (Stripe, Vercel) and it is here for a measured reason —
   the old page ran its answer paragraphs to the full 1120px container, which
   is a ~150-character line. Splitting the container gives the answers a
   ~70ch measure at 1440 without leaving the right third of the page empty,
   which a simple centred column would.

   The rail is sticky so the group you are reading stays named while you
   scroll a long group. align-self:start is what makes sticky work inside a
   grid item — a stretched item is already as tall as the row and has nothing
   to stick within. top:110px clears the theme's sticky header.
   ========================================================================== */
.ng-v2 .ng-sss-group{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:20px;
  /* The masthead jump chips are in-page anchors and the theme header is
     sticky, so without this the heading lands underneath it. */
  scroll-margin-top:110px;
}
.ng-v2 .ng-sss-group + .ng-sss-group{ margin-top:44px; }

@media (min-width:960px){
  .ng-v2 .ng-sss-group{
    grid-template-columns:minmax(0,300px) minmax(0,1fr);
    column-gap:56px;
  }
  .ng-v2 .ng-sss-group + .ng-sss-group{ margin-top:56px; }
  .ng-v2 .ng-sss-group__rail{
    position:sticky; top:110px;
    align-self:start;
  }
}

.ng-v2 .ng-sss-group__meta{ margin:0; }
/* (0,3,0) doubled — ng-shared §11. The theme ships
   `body .content-wrapper h2:not(:first-child){margin-top:50px}` at (0,2,2)
   and loads after us, so a single-class heading rule here would render a
   50px gap where 12px is authored. Every page-level heading class needs
   this; see the index at the end of this file. */
.ng-v2 .ng-sss-group__title.ng-sss-group__title{
  margin:12px 0 0;
  font-size:30px; line-height:1.16;
  letter-spacing:-0.02em;
  color:var(--ng-ink);
  text-wrap:balance;
}
.ng-v2 .ng-sss-group__lede{
  margin:12px 0 0;
  font-size:15px; line-height:1.6;
  color:var(--ng-muted);              /* 5.42:1 on mist */
  max-width:40ch;
}

/* The plate: raised role, holding text, on the sunken band. Rows are
   separated by hairlines rather than gaps so the plate reads as one object;
   overflow:clip keeps the first and last row's hover tint inside the
   radius. */
.ng-v2 .ng-sss-group__plate{
  background:var(--ng-surface);
  border:1px solid var(--ng-hairline);
  border-radius:var(--ng-radius);
  box-shadow:var(--ng-shadow-card);
  overflow:clip;
}


/* ==========================================================================
   4. THE DISCLOSURE ROW

   <details>/<summary>, native, no script. See 30-sorular.html for why that
   choice is not negotiable on a site running optm-js_defer=2.
   ========================================================================== */
.ng-v2 .ng-sss-q{ border-top:1px solid var(--ng-hairline); }
.ng-v2 .ng-sss-q:first-child{ border-top:0; }

/* Three separate marker suppressions, because the browsers disagree about
   which one they honour: Safari and older Chrome use the -webkit
   pseudo-element, Firefox and current Chrome use ::marker, and
   `display:flex` on the summary removes list-item behaviour in the rest.
   Removing the default triangle is not cosmetic — it points sideways when
   closed, which reads as "goes somewhere else" rather than "opens here",
   and it cannot be positioned to the right where a 90ch row needs it. */
.ng-v2 .ng-sss-q__sum{
  display:flex; align-items:flex-start; gap:14px;
  list-style:none;
  padding:18px 22px;
  min-height:44px;                    /* 2.5.5 — the old rows were 320×26 */
  cursor:pointer;
  transition:background-color .14s cubic-bezier(.25,.46,.45,.94);
}
.ng-v2 .ng-sss-q__sum::-webkit-details-marker{ display:none; }
.ng-v2 .ng-sss-q__sum::marker{ content:''; }
@media (any-hover:hover){
  /* any-hover only: on touch the :hover tint sticks after the tap and leaves
     a row highlighted until the user taps somewhere else. */
  .ng-v2 .ng-sss-q__sum:hover{ background:var(--ng-accent-wash); }
}
/* The foundation's two-tone focus ring draws on :focus-visible; the ring is
   inset here because the row is flush with the plate's edge and a 3px
   outline with a 2px offset would be clipped by overflow:clip. */
.ng-v2 .ng-sss-q__sum:focus-visible{
  outline-offset:-4px;
  border-radius:var(--ng-radius-sm);
}

/* The number. Tabular figures so 01…11 keep one column width, and a fixed
   min-width so every question starts on the same x. 12px/0.1em is the
   tracked-label exception. */
.ng-v2 .ng-sss-q__num{
  flex:0 0 auto; min-width:22px;
  padding-top:3px;
  font-family:var(--ng-font-label); font-weight:600;
  font-size:12px; line-height:1.35; letter-spacing:.1em;
  font-variant-numeric:tabular-nums;
  text-transform:none;
  color:var(--ng-accent);
}

/* (0,3,0) doubled — see §3. This one matters more than most: an h3 inside a
   <summary> is never :first-child (the number span precedes it), so the
   theme's margin-top:50px applies with nothing to stop it and every question
   row would open a 50px hole above its own text. */
.ng-v2 .ng-sss-q__h.ng-sss-q__h{
  flex:1 1 auto; min-width:0;
  margin:0;
  font-family:var(--ng-font-display); font-weight:600;
  font-size:18px; line-height:1.4;
  letter-spacing:-0.01em;
  color:var(--ng-ink);
}

/* The indicator. A chevron that points DOWN when closed and up when open —
   down is "there is more below this line", which is what a disclosure does;
   the theme's original arrow pointed right, which is what a link does.
   It is aria-hidden: <details> already tells assistive technology whether it
   is expanded, and a second announcement of the same state is noise. */
.ng-v2 .ng-sss-q__ind{
  flex:0 0 auto;
  display:inline-flex; align-items:center; justify-content:center;
  width:26px; height:26px; margin-top:1px;
  border-radius:var(--ng-radius-pill);
  background:var(--ng-surface-sunken);
  color:var(--ng-ink);
  transition:transform .18s cubic-bezier(.25,.46,.45,.94),
             background-color .18s cubic-bezier(.25,.46,.45,.94);
}
.ng-v2 .ng-sss-q[open] .ng-sss-q__ind{
  transform:rotate(180deg);
  background:var(--ng-accent-wash);
  color:var(--ng-accent);
}
@media (prefers-reduced-motion:reduce){
  .ng-v2 .ng-sss-q__ind{ transition:none; }
}

/* The answer. Indented to the question's x by the number column's width plus
   its gap (22 + 14 = 36) so question and answer share a left edge. */
.ng-v2 .ng-sss-q__body{
  padding:0 22px 22px 58px;
  max-width:72ch;
}
.ng-v2 .ng-sss-q__body p{
  margin:0 0 14px;
  font-size:15px; line-height:1.65;
  color:var(--ng-muted);              /* 6.21:1 on white */
}
.ng-v2 .ng-sss-q__body > :last-child{ margin-bottom:0; }
/* A lead-in line that introduces the chips under it belongs to them, so it
   loses its own bottom margin and the chip row supplies the gap. */
.ng-v2 .ng-sss-q__body .ng-sss-lead{ margin-bottom:0; }
/* ng-shared gives .ng-actions a 28px top margin, which is right when it is a
   page's closing action row and far too much inside an answer. */
.ng-v2 .ng-sss-q__body .ng-actions{ margin-top:14px; }
.ng-v2 .ng-sss-q__body .ng-pills{ margin-top:0; margin-bottom:14px; }
.ng-v2 .ng-sss-q__body .ng-note{ margin-top:14px; }


/* ==========================================================================
   5. THE FOUR THINGS SHOWN RATHER THAN DESCRIBED

   Each of these replaces a paragraph that was listing something. None of
   them adds an item the client did not write.
   ========================================================================== */

/* ---- source manifest ----------------------------------------------------
   The homepage's data-and-method panel (sections/8-data-method.html) already
   establishes this idiom on this site: institutions set as TEXT — acronym in
   the label face, full name under it — rather than as logo rasters, because
   there is no licence to reproduce the TÜİK, EPDK or GİB marks and a wall of
   borrowed logos reads as an endorsement nobody gave.
   Mist plate: it is chrome sitting on the white plate, which is the same
   two-surface rule .ng-pills follows. */
.ng-v2 .ng-sss-src{
  list-style:none; margin:0 0 14px; padding:16px;
  background:var(--ng-surface-sunken);
  border-radius:var(--ng-radius-sm);
  display:grid; grid-template-columns:minmax(0,1fr); gap:14px 20px;
}
@media (min-width:520px){
  .ng-v2 .ng-sss-src{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
.ng-v2 .ng-sss-src__item{ min-width:0; margin:0; padding:0; }
.ng-v2 .ng-sss-src__code{
  display:block;
  font-family:var(--ng-font-label); font-weight:600;
  font-size:12px; line-height:1.3; letter-spacing:.1em;
  text-transform:none;   /* "GİB", "BELEDİYE": uppercase mapping would eat
                            the İ and print "GIB" / "BELEDIYE" */
  color:var(--ng-accent);
}
.ng-v2 .ng-sss-src__name{
  display:block; margin-top:3px;
  font-size:14px; line-height:1.45;
  color:var(--ng-ink);                /* 13.04:1 on mist */
}

/* ---- update cadence -----------------------------------------------------
   Two rows because the client named two examples, and the .ng-note under it
   says exactly that. Presenting two examples as a complete update schedule
   would be publishing a commitment the company has not made. */
.ng-v2 .ng-sss-cad{ margin:0 0 4px; padding:0; }
.ng-v2 .ng-sss-cad__row{
  display:flex; flex-wrap:wrap; align-items:baseline;
  justify-content:space-between; gap:4px 16px;
  padding:11px 0;
  border-bottom:1px solid var(--ng-hairline);
}
.ng-v2 .ng-sss-cad__row:first-child{ border-top:1px solid var(--ng-hairline); }
.ng-v2 .ng-sss-cad__k{
  margin:0;
  font-size:15px; line-height:1.4;
  color:var(--ng-ink);
}
.ng-v2 .ng-sss-cad__v{
  margin:0;                           /* dd's UA margin-inline-start */
  font-family:var(--ng-font-display); font-weight:600;
  font-size:14px; line-height:1.4;
  color:var(--ng-accent);             /* 5.64:1 on white — under 24px, so the
                                         display magenta is not allowed here */
}

/* ---- the one number -----------------------------------------------------
   1–3 iş günü is the only figure on the page and it is the client's own
   stated standard, so it is set as a figure rather than buried mid-sentence.
   --ng-accent-display is legal here and ONLY here on this page: the value
   renders at 30px, over the 24px floor the token is reserved for (4.18:1 on
   white clears the 3.0 large-text bar and would fail the 4.5 body bar). */
.ng-v2 .ng-sss-fig{
  display:inline-flex; flex-direction:column; gap:7px;
  margin:0 0 14px; padding:14px 18px;
  background:var(--ng-accent-wash);
  border-radius:var(--ng-radius-sm);
}
/* line-height 1.12, not 1.05, and a 7px gap under it. Measured off
   /root/ng-shots/xo-1440-2.png: at 1.05 the descender of the g in "günü"
   closed to within ~2px of the STANDART KURULUM label, and the English
   string ("1–3 business days") has no descender at all — so the Turkish
   page would have looked cramped where the English one looked fine, which
   is the failure mode this whole project keeps finding. */
.ng-v2 .ng-sss-fig__v{
  font-family:var(--ng-font-display); font-weight:700;
  font-size:30px; line-height:1.12;
  letter-spacing:-0.02em;
  color:var(--ng-accent-display);
}
.ng-v2 .ng-sss-fig__l{
  font-family:var(--ng-font-label); font-weight:600;
  font-size:12px; line-height:1.35; letter-spacing:.1em;
  text-transform:none;                /* "STANDART KURULUM", pre-uppercased */
  color:var(--ng-accent);
}

/* ---- bulut / kurum içi --------------------------------------------------
   The source answer states two options and one advantage each in a single
   sentence. Two columns is what that sentence is: the reader is choosing,
   and a comparison is easier to make side by side than to unpick from a
   clause. Both labels and both descriptions are the client's own words. */
.ng-v2 .ng-sss-two{
  list-style:none; margin:0 0 14px; padding:0;
  display:grid; grid-template-columns:minmax(0,1fr); gap:12px;
}
@media (min-width:520px){
  .ng-v2 .ng-sss-two{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
.ng-v2 .ng-sss-two__col{
  min-width:0; margin:0;
  padding:14px 16px;
  background:var(--ng-surface-sunken);
  border-radius:var(--ng-radius-sm);
}
.ng-v2 .ng-sss-two__k{
  display:block;
  font-family:var(--ng-font-label); font-weight:600;
  font-size:12px; line-height:1.3; letter-spacing:.1em;
  text-transform:none;   /* "KURUM İÇİ" — uppercase mapping prints "KURUM ICI" */
  color:var(--ng-accent);
}
.ng-v2 .ng-sss-two__v{
  display:block; margin-top:6px;
  font-size:14px; line-height:1.5;
  color:var(--ng-ink);
}


/* ==========================================================================
   6. MOBILE — the reading floor and the 44px minimum

   ng-shared §12 already handles .ng-lede, .ng-card__body, .ng-pills,
   .ng-note, .ng-btn--pill, .ng-crumbs__link and .ng-cta__tel. Only this
   page's own components are here.
   ========================================================================== */
@media (max-width:767px){
  /* 16px reading floor. Everything below is a sentence a visitor reads, not
     a label they glance at, so none of them takes the tracked exception. */
  .ng-v2 .ng-sss-q__body p{ font-size:16px; line-height:1.6; }
  .ng-v2 .ng-sss-group__lede{ font-size:16px; max-width:none; }
  .ng-v2 .ng-sss-quick__v,
  .ng-v2 .ng-sss-src__name,
  .ng-v2 .ng-sss-cad__k,
  .ng-v2 .ng-sss-cad__v,
  .ng-v2 .ng-sss-two__v{ font-size:16px; }

  /* The question itself stays 17px rather than dropping — it is the thing
     being scanned, and eleven of them are the page's navigation. */
  .ng-v2 .ng-sss-q__h.ng-sss-q__h{ font-size:17px; line-height:1.35; }
  .ng-v2 .ng-sss-group__title.ng-sss-group__title{ font-size:26px; }

  /* Tighter gutters, and the answer loses the 58px indent: at 390 a 36px
     indent plus 22px padding leaves a 274px measure, which is 30 characters
     of Turkish. The number column is a desktop affordance and there is no
     room to pay for it here. */
  .ng-v2 .ng-sss-q__sum{ padding:16px; gap:12px; }
  .ng-v2 .ng-sss-q__body{ padding:0 16px 20px; max-width:none; }

  .ng-v2 .ng-sss-quick{ padding:22px 18px; }
  .ng-v2 .ng-sss-src{ padding:14px; }

  /* The masthead jump chips are the page's index and each is a real anchor,
     so each is a tap target. ng-shared §12 gives .ng-btn--pill
     min-height:44px; min-width is added for the same reason ng-shared adds
     it to a crumb — 2.5.5 is a 44×44 box and a short label is narrower than
     that on its own. */
  .ng-v2 .ng-sss-mh__jump .ng-btn{ min-width:44px; }
  .ng-v2 .ng-sss-links .ng-btn{ min-width:44px; }
}

/* Between 768 and 959 the group is still one column, so the rail's lede
   would run the full container width. Cap it at the reading measure. */
@media (min-width:768px) and (max-width:959px){
  .ng-v2 .ng-sss-group__lede{ max-width:60ch; }
}


/* ==========================================================================
   7. HEADING-MARGIN DEFENCE — the page-level index

   ng-shared.css §11 protects .ng-masthead__title, .ng-section-head__title,
   .ng-card__title, .ng-cta__title and .ng-prose__h with the doubled-class
   idiom, which is what beats the theme's (0,2,2)
   `body .content-wrapper h?:not(:first-child){margin-top:50px}`.

   This page adds two heading classes and both are doubled above:

       .ng-sss-group__title   §3   (three h2s, one per group)
       .ng-sss-q__h           §4   (eleven h3s, one per question)

   The second is the load-bearing one. It sits inside a <summary> after a
   number span, so it is never :first-child and the theme rule applies to all
   eleven with nothing to stop it — 550px of holes inside the disclosure
   rows, invisible to every DOM assertion and visible only in a screenshot.

   Final outline, one h1 and nothing skipped:
     h1  Sıkça sorulan sorular
     h2  Önce iki temel soru        → h3 ×2 (the two open cards)
     h2  Yapay Zekâ & Veri Altyapısı → h3 ×4
     h2  Raporlama & Analiz          → h3 ×3
     h2  Kurulum & Entegrasyon       → h3 ×4
     h2  Sorunuz listede yoksa bize sorun
   ========================================================================== */