/* ==========================================================================
   NEXT GEO — /urunler/whatsapp-lokasyon-raporu/ and /en/products/whatsapp-
   location-report/. One authored sheet for the pair; ng-page-apply.php copies it
   to the English slug with --css-from, so the two languages cannot drift.

   Loaded after ng-foundation / ng-components / ng-mobile / ng-shared, scoped to
   .ng-v2. Tokens only, no literal colours, no !important.

   HEADINGS ARE WRITTEN AT (0,3,0), doubled. Neuros ships
   `body .content-wrapper h?:not(:first-child){margin-top:50px}` at (0,2,2),
   which beats a plain `.ng-v2 .ng-x` (0,2,0). It has cost this build twice
   already — fourteen headings on the homepage, and every step number on the
   WhatsApp band, each opening a 50px hole nobody authored.
   ========================================================================== */

/* --- 10 · the C-FIGURE opening ------------------------------------------- */
/* The figure sits ABOVE the h1 at full container width — that is what makes the
   archetype C rather than A. It is a heading index, not a sample output, so it
   carries no ÖRNEK chip and needs no "temsilîdir" caption. */
.ng-v2 .ng-walpfig{ margin:22px 0 34px; }

.ng-v2 .ng-walpfig__frame{
  padding:26px 26px 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-walpfig__kick{ margin:0 0 18px; }

/* Six cells: 2 up on a phone, 3 up from 720, 6 across only at desktop. Six in a
   row at 900px would set each label to ~9 characters and wrap all of them. */
.ng-v2 .ng-walpfig__grid{
  display:grid; grid-template-columns:repeat(2,minmax(0,1fr));
  gap:18px 20px; margin:0; padding:0; list-style:none;
}
@media (min-width:720px){ .ng-v2 .ng-walpfig__grid{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (min-width:1080px){ .ng-v2 .ng-walpfig__grid{ grid-template-columns:repeat(6,minmax(0,1fr)); gap:20px 16px; } }

.ng-v2 .ng-walpfig__cell{
  display:flex; flex-direction:column; gap:7px;
  padding-top:12px;
  border-top:2px solid var(--ng-accent-display);
}
.ng-v2 .ng-walpfig__n{
  font-family:var(--ng-font-label); font-weight:500;
  font-size:11px; line-height:1; letter-spacing:.1em;
  color:var(--ng-accent-display);
  text-transform:none;          /* authored pre-uppercased; i -> I, never İ */
}
.ng-v2 .ng-walpfig__k{
  font-family:var(--ng-font-display); font-weight:600;
  font-size:14.5px; line-height:1.3; letter-spacing:-0.008em;
  color:var(--ng-ink);
  text-wrap:balance;
}
.ng-v2 .ng-walpfig__cap{
  margin:14px 0 0;
  font-size:13px; line-height:1.55; color:var(--ng-muted);
}
.ng-v2 .ng-walp__note{ margin:18px 0 0; max-width:62ch; }

/* THE HAIRLINE IS THE COMPOSITION. Everything above it is the artefact,
   everything below it is the page. Without it the h1 read as a caption
   belonging to the summary card — next-geo-tailor.css records exactly the same
   finding, and the first draft of this page reproduced the fault: the eyebrow
   pill sat 25px under the figcaption and the two blocks fused.

   THE THREE VALUES BELOW ARE COPIED, NOT CHOSEN. bankacilik, perakende and
   next-geo-tailor already share them; a C-FIGURE masthead that renders at a
   fourth size on a fourth page is not a shared archetype. The headline comes
   DOWN here rather than up — ARCHETYPES.md: the artefact is the first screen
   and the h1 is "subordinate beneath it, at normal size".

   ⚠ THIS IS THE FOURTH PRIVATE COPY of .ng-masthead--fig. perakende.css says
   the third was the signal to promote these declarations into ng-shared §15,
   and next-geo-tailor.css deferred it because another agent held that file.
   Deferred again here, deliberately: promoting it is a one-file lift plus a
   re-apply and re-verification of three existing pairs, and doing that as a
   side effect of adding an unrelated page is how shared stylesheets break.
   Recorded, not silently repeated. */
.ng-v2 .ng-masthead--fig .ng-masthead__copy{
  margin-top:34px;
  padding-top:30px;
  border-top:1px solid var(--ng-hairline);
}
.ng-v2 .ng-masthead--fig .ng-masthead__title.ng-masthead__title{
  font-size:clamp(1.95rem, 4.2vw, 2.9rem);
  line-height:1.1;
  letter-spacing:-0.026em;
  max-width:22ch;
}
.ng-v2 .ng-masthead--fig .ng-masthead__lede{ max-width:62ch; }

/* --- 20 · the three capability rows -------------------------------------- */
/* Layout comes from ng-shared §17a (.ng-figband--split / --flip). Only the copy
   inside .ng-figband__text is styled here, which is the established division:
   shared owns the band, the page owns its voice. */
.ng-v2 .ng-walp-new .ng-figband{ margin-top:44px; }
.ng-v2 .ng-walp__figmeta{ margin:0 0 12px; }
.ng-v2 .ng-walp__figh.ng-walp__figh{
  margin:0 0 12px;
  font-family:var(--ng-font-display); font-weight:600;
  font-size:clamp(19px,2.3vw,25px); line-height:1.2; letter-spacing:-0.016em;
  color:var(--ng-ink);
  text-wrap:balance;
}
.ng-v2 .ng-walp__figp{
  margin:0 0 12px; max-width:54ch;
  font-size:15.5px; line-height:1.62; color:var(--ng-muted);
}
.ng-v2 .ng-walp__figp:last-child{ margin-bottom:0; }

/* --- 30 · the indigo flow band ------------------------------------------- */
/* NO COLOUR IS WRITTEN HERE. `is-dark` on the section flips --ng-ground,
   --ng-ink, --ng-muted, --ng-surface and the accent tier in ng-foundation §3.
   Anything hand-coloured here would survive that flip and be wrong. */
.ng-v2 .ng-walp-flow__steps{
  display:grid; gap:26px 24px;
  margin:34px 0 0; padding:0; list-style:none;
}
@media (min-width:640px){ .ng-v2 .ng-walp-flow__steps{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:1080px){ .ng-v2 .ng-walp-flow__steps{ grid-template-columns:repeat(5,minmax(0,1fr)); gap:24px 18px; } }
.ng-v2 .ng-walp-flow__note{
  margin:30px 0 0; max-width:70ch;
}
.ng-v2 .ng-walp-flow__link{
  color:var(--ng-accent-display); text-decoration:none;
  border-bottom:1px solid transparent;
}
.ng-v2 .ng-walp-flow__link:hover{ border-bottom-color:currentColor; }

/* --- 40 · who it is for, and the questions ------------------------------- */
.ng-v2 .ng-walp-who__grid{
  display:grid; grid-template-columns:1fr; gap:34px;
}
@media (min-width:900px){
  .ng-v2 .ng-walp-who__grid{ grid-template-columns:minmax(0,1fr) minmax(0,1.05fr); gap:clamp(40px,5vw,72px); align-items:start; }
}
.ng-v2 .ng-walp-who__title.ng-walp-who__title{
  margin:12px 0 14px;
  font-family:var(--ng-font-display); font-weight:600;
  font-size:clamp(23px,3vw,32px); line-height:1.16; letter-spacing:-0.02em;
  color:var(--ng-ink);
  text-wrap:balance;
}
.ng-v2 .ng-walp-who__lede{
  margin:0 0 20px; max-width:46ch;
  font-size:15.5px; line-height:1.62; color:var(--ng-muted);
}
.ng-v2 .ng-walp-who__list{ margin:0; }

/* The questions are set as questions: hanging quote rule on the inline-start
   edge, so they read as things somebody asked rather than as feature bullets. */
.ng-v2 .ng-walp-q__label{ margin:0 0 16px; }
.ng-v2 .ng-walp-q{ margin:0; padding:0; list-style:none; }
.ng-v2 .ng-walp-q__item{
  margin:0 0 12px; padding:11px 16px;
  background:var(--ng-surface);
  border-inline-start:2px solid var(--ng-accent-display);
  border-radius:0 var(--ng-radius-sm) var(--ng-radius-sm) 0;
  font-family:var(--ng-font-display); font-weight:500;
  font-size:15.5px; line-height:1.45; letter-spacing:-0.008em;
  color:var(--ng-ink);
}
.ng-v2 .ng-walp-q__item:last-of-type{ margin-bottom:0; }
.ng-v2 .ng-walp-q__note{ margin:16px 0 0; max-width:52ch; }

/* --- 50 · closing -------------------------------------------------------- */
/* Mist, not indigo: the dark band already fell in section 30. */
.ng-v2 .ng-walp-cta__inner{ max-width:64ch; }
.ng-v2 .ng-walp-cta__title.ng-walp-cta__title{
  margin:12px 0 14px;
  font-family:var(--ng-font-display); font-weight:600;
  font-size:clamp(24px,3.4vw,36px); line-height:1.14; letter-spacing:-0.02em;
  color:var(--ng-ink);
  text-wrap:balance;
}
.ng-v2 .ng-walp-cta__lede{ margin:0 0 24px; }
.ng-v2 .ng-walp-cta__actions{ margin:0; }