/* Solutions PageFamily — premium UI (BuildSpec 35, patron 2026-05-02 end-to-end premium directive)
   Authority: docs/execution/ui-uplift/handoff/auto-generated/35-Solutions-Premium-UI-BuildSpec.md
   Token discipline: zero raw hex/rgb; use the TFG token lane only.
   Sentinel scope LOCKED — Defense cluster uses --tfg-accent-cool per AGENTS.md §1.3.
   Reduced-motion + forced-colors fallback per docs/standards/AccessibilityStandards.md. */

/* ── Token-sweep 2026-06-11 (Adım-2 sonu) BELGELİ İSTİSNALAR (Kart #002 deseni) ──
   Bu dosyadaki şu ham değer kümeleri bilinçli tasarım sabitleridir; tokena bağlanmaz:
   · atmosfer/cam katmanı opacity serileri (0.46-0.9) · clamp() responsive font ölçüleri
   · birebir token karşılığı olmayan line-height değerleri
   · isolation:isolate altındaki LOKAL z-index katmanları (0/1/3 — global --tfg-z-* ile
     çakışmaz; z-index:3 incelendi: izole hero bağlamında lokal katman)
   · letter-spacing:0 reset'leri (kanonik sıfır)
   Kayıt: docs/execution/ui-uplift/UiWave2TokenSweepRecord.md */

@layer sections {
    [data-tfg="on"] .solutions-page-wrapper {
        background: transparent;
        color: var(--tfg-text-primary);
        display: grid;
        gap: var(--tfg-space-0);
        padding-block-end: var(--tfg-space-0);
    }

    [data-tfg="on"] .solutions-content-stack {
        inline-size: 100%;
        max-inline-size: 100%;
        min-width: 0;
    }

    [data-tfg="on"] .solutions-content-stack > :where(header, section, .tfg-section) {
        max-inline-size: 100%;
        min-width: 0;
        margin-block: var(--tfg-space-0);
    }

    [data-tfg="on"] .solutions-content-stack > :is(.sector-cluster-bridge-section, .cta-section).tfg-section {
        padding-block: var(--tfg-space-0);
    }

    /* ============================================================
       HERO — atmospheric depth + halo glow + eyebrow accent
       ============================================================ */

    [data-tfg="on"] .solutions-hero {
        position: relative;
        isolation: isolate;
        overflow: visible;
    }

    [data-tfg="on"] .solutions-hero::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 0;
        background:
            radial-gradient(circle at 50% 35%, var(--tfg-glow-warm-soft, transparent), transparent 48%),
            radial-gradient(circle at 88% 18%, var(--tfg-glow-cool-faint, transparent), transparent 38%);
        pointer-events: none;
        opacity: var(--tfg-hero-overlay-opacity, 0.85);
    }

    /* .solutions-hero__shell mirrors the sub-page hero standard (.content-page__hero-inner--with-aside,
       RouteCore.css): same column ratio, vertically-centred copy (grows both ways, not top-pinned),
       fluid frame padding — so the index hero reads identically to the detail heroes. Patron 2026-06-20:
       frame too big / copy top-pinned / title looked weak; title+desc font size was already identical,
       the oversized frame + top-pinning caused the "weak" perception. */
    [data-tfg="on"] .solutions-hero__shell {
        position: relative;
        z-index: 1;
        display: grid;
        grid-template-columns: minmax(0, 1.08fr) minmax(var(--tfg-grid-card-min), 0.92fr);
        align-items: center;
        gap: clamp(var(--tfg-space-5), 4vw, var(--tfg-space-9));
        padding: clamp(var(--tfg-space-5), 4vw, var(--tfg-space-9));
    }

    [data-tfg="on"] .solutions-hero__copy,
    [data-tfg="on"] .solutions-hero__decision-copy,
    [data-tfg="on"] .solutions-hero__decision-steps {
        min-width: 0;
    }

    [data-tfg="on"] .solutions-hero__copy {
        display: flex;
        flex-direction: column;
        gap: var(--tfg-space-5);
    }

    [data-tfg="on"] .solutions-hero .hero-title,
    [data-tfg="on"] .solutions-hero .hero-desc {
        margin: var(--tfg-space-0);
    }

    [data-tfg="on"] .solutions-hero .hero-title {
        max-width: min(100%, var(--tfg-page-hero-title-max-width));
    }

    [data-tfg="on"] .solutions-hero .hero-desc {
        max-width: min(100%, var(--tfg-page-hero-desc-max-width));
    }

    [data-tfg="on"] .solutions-hero-actions {
        margin-block-start: var(--tfg-space-5);
    }

    [data-tfg="on"] .solutions-hero__aside {
        display: grid;
        place-items: center;
        min-width: 0;
    }

    [data-tfg="on"] .solutions-hero__decision-panel {
        position: relative;
        isolation: isolate;
        display: grid;
        grid-template-areas: "visual";
        align-items: stretch;
        inline-size: min(100%, var(--tfg-hero-infographic-size));
        max-inline-size: var(--tfg-hero-infographic-size);
        aspect-ratio: 1 / 1;
        overflow: hidden;
        padding: var(--tfg-border-hairline);
        border: var(--tfg-panel-border);
        border-radius: var(--tfg-radius-lg);
    }

    @supports ((backdrop-filter: blur(1rem)) or (-webkit-backdrop-filter: blur(1rem))) {
        [data-tfg="on"] .solutions-hero__decision-panel {
            -webkit-backdrop-filter: var(--tfg-glass-card-blur);
            backdrop-filter: var(--tfg-glass-card-blur);
        }
    }

    [data-tfg="on"] .solutions-hero__decision-panel > * {
        position: relative;
    }

    [data-tfg="on"] .solutions-hero__decision-image {
        display: block;
    }

    [data-tfg="on"] .solutions-hero__decision-map {
        position: relative;
        grid-area: visual;
        z-index: 1;
        min-block-size: 0;
        block-size: 100%;
        border: var(--tfg-border-hairline) solid var(--tfg-panel-border-color);
        border-radius: var(--tfg-radius-lg);
        background:
            radial-gradient(circle at 50% 48%, var(--tfg-accent-glow) 0%, transparent var(--tfg-grid-stat-min)),
            radial-gradient(circle at 50% 48%, var(--tfg-rim-light-gradient) 0%, transparent var(--tfg-grid-card-min)),
            var(--tfg-panel-background-heavy);
        box-shadow:
            inset 0 0 0 var(--tfg-border-hairline) var(--tfg-rim-light-gradient),
            var(--tfg-rim-light);
        overflow: hidden;
    }

    [data-tfg="on"] .solutions-hero__map-ring,
    [data-tfg="on"] .solutions-hero__map-axis,
    [data-tfg="on"] .solutions-hero__map-core,
    [data-tfg="on"] .solutions-hero__map-node {
        position: absolute;
        pointer-events: none;
    }

    [data-tfg="on"] .solutions-hero__map-ring {
        inset: var(--tfg-space-6);
        border: var(--tfg-border-hairline) solid var(--tfg-accent-rim);
        border-radius: var(--tfg-radius-full);
        opacity: 0.52;
    }

    [data-tfg="on"] .solutions-hero__map-ring--inner {
        inset: calc(var(--tfg-space-8) * 1.55);
        opacity: 0.72;
    }

    [data-tfg="on"] .solutions-hero__map-axis {
        background: linear-gradient(90deg, transparent, var(--tfg-accent-rim), transparent);
        opacity: 0.48;
    }

    [data-tfg="on"] .solutions-hero__map-axis--horizontal {
        inset-block-start: 50%;
        inset-inline: var(--tfg-space-7);
        block-size: var(--tfg-border-hairline);
    }

    [data-tfg="on"] .solutions-hero__map-axis--vertical {
        inset-block: var(--tfg-space-5);
        inset-inline-start: 50%;
        inline-size: var(--tfg-border-hairline);
        background: linear-gradient(180deg, transparent, var(--tfg-accent-rim), transparent);
    }

    [data-tfg="on"] .solutions-hero__map-core {
        inset-block-start: 50%;
        inset-inline-start: 50%;
        inline-size: clamp(3.4rem, 7vw, 5rem);
        aspect-ratio: 1;
        border: var(--tfg-border-hairline) solid var(--tfg-accent-rim);
        border-radius: var(--tfg-radius-full);
        background:
            radial-gradient(circle at 50% 50%, var(--tfg-accent-glow) 0%, transparent 58%),
            var(--tfg-panel-background-strong);
        box-shadow: var(--tfg-warm-glow), var(--tfg-rim-light);
        transform: translate(-50%, -50%);
    }

    [data-tfg="on"] .solutions-hero__map-node {
        display: block;
        inline-size: clamp(4.8rem, 9vw, 6.8rem);
        aspect-ratio: 1.2;
        border: var(--tfg-panel-border);
        border-radius: var(--tfg-radius-lg);
        background:
            linear-gradient(135deg, var(--tfg-rim-light-gradient), transparent 42%),
            var(--tfg-panel-background);
        box-shadow: var(--tfg-rim-light), var(--tfg-rim-shadow);
    }

    [data-tfg="on"] .solutions-hero__map-node > span {
        position: absolute;
        inset: 50% auto auto 50%;
        inline-size: var(--tfg-space-4);
        aspect-ratio: 1;
        border-radius: var(--tfg-radius-full);
        background: var(--tfg-accent-warm);
        box-shadow: 0 0 var(--tfg-len-rem-1-4) var(--tfg-accent-glow);
        transform: translate(-50%, -50%);
    }

    [data-tfg="on"] .solutions-hero__map-node[data-cluster="foundation"] {
        inset-block-start: 12%;
        inset-inline-start: 9%;
        background: var(--tfg-success-soft, var(--tfg-panel-background-soft));
    }

    [data-tfg="on"] .solutions-hero__map-node[data-cluster="defense"] {
        inset-block-start: 11%;
        inset-inline-end: 10%;
        background: var(--tfg-accent-cool-soft, var(--tfg-panel-background-soft));
    }

    [data-tfg="on"] .solutions-hero__map-node[data-cluster="governance"] {
        inset-block-end: 13%;
        inset-inline-start: 12%;
        background: var(--tfg-text-muted-soft, var(--tfg-panel-background-soft));
    }

    [data-tfg="on"] .solutions-hero__map-node[data-cluster="build"] {
        inset-block-end: 12%;
        inset-inline-end: 11%;
        background: var(--tfg-accent-warm-soft, var(--tfg-panel-background-soft));
    }

    [data-tfg="on"] .solutions-hero__decision-copy {
        display: grid;
        gap: var(--tfg-space-2);
        z-index: 3;
    }

    [data-tfg="on"] .solutions-hero__decision-kicker {
        font-size: var(--tfg-font-size-xs);
        font-weight: var(--tfg-font-weight-medium);
        color: var(--tfg-text-secondary);
        letter-spacing: 0;
        text-transform: uppercase;
    }

    [data-tfg="on"] .solutions-hero__decision-copy strong {
        color: var(--tfg-text-headline);
        font-size: var(--tfg-font-size-2xl, var(--tfg-font-size-xl));
        line-height: var(--tfg-line-height-tight);
    }

    [data-tfg="on"] .solutions-hero__decision-copy p {
        margin: 0;
        color: var(--tfg-text-secondary);
        line-height: var(--tfg-line-height-body);
    }

    [data-tfg="on"] .solutions-hero__decision-steps {
        display: flex;
        flex-wrap: wrap;
        gap: var(--tfg-space-2);
        z-index: 3;
    }

    [data-tfg="on"] .solutions-hero__decision-steps span {
        display: inline-flex;
        align-items: center;
        min-block-size: var(--tfg-chip-frame-fit-min-height, var(--tfg-space-8));
        padding: var(--tfg-chip-frame-fit-padding-block, var(--tfg-space-2)) var(--tfg-chip-frame-fit-padding-inline, var(--tfg-space-3));
        border: var(--tfg-panel-border);
        border-radius: var(--tfg-radius-pill);
        background: var(--tfg-panel-background);
        color: var(--tfg-text-primary);
        font-size: var(--tfg-font-size-sm);
        font-weight: var(--tfg-font-weight-medium);
        line-height: var(--tfg-line-height-tight);
    }

    [data-tfg="on"] .solutions-hero-badge.tfg-chip {
        align-self: flex-start;
        inline-size: fit-content;
        transition: transform var(--tfg-motion-duration-md, 220ms) var(--tfg-motion-ease-out, ease-out);
    }

    [data-tfg="on"] .solutions-hero-badge.tfg-chip:hover {
        transform: translateY(var(--tfg-nav-hover-lift));
    }

    /* ============================================================
       DISCOVERY SECTION — segmented + premium card grid
       ============================================================ */

    [data-tfg="on"] .solutions-discovery {
        position: relative;
        display: grid;
        gap: clamp(var(--tfg-space-5), 3vw, var(--tfg-space-7));
        padding: clamp(var(--tfg-space-5), 3vw, var(--tfg-space-7));
        overflow: hidden;
    }

    [data-tfg="on"] .solutions-discovery::after {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 0;
        pointer-events: none;
        background: linear-gradient(180deg, var(--tfg-panel-highlight, transparent), transparent 24%);
    }

    [data-tfg="on"] .solutions-discovery__header,
    [data-tfg="on"] .solutions-card-grid {
        position: relative;
        z-index: 1;
    }

    [data-tfg="on"] .solutions-discovery__header {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(var(--tfg-grid-card-min), var(--tfg-grid-col-31));
        gap: clamp(var(--tfg-space-5), 3vw, var(--tfg-space-8));
        align-items: end;
    }

    [data-tfg="on"] .solutions-discovery__copy {
        display: grid;
        gap: var(--tfg-space-4);
        min-width: 0;
        max-inline-size: min(100%, var(--tfg-measure-wide));
    }

    [data-tfg="on"] .solutions-discovery__title-frame {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        gap: var(--tfg-space-4);
        align-items: center;
        inline-size: min(100%, var(--tfg-measure-rem-md));
        min-width: 0;
        padding: var(--tfg-space-3);
        border: var(--tfg-panel-border);
        border-radius: var(--tfg-radius-pill);
        background: var(--tfg-panel-background);
        box-shadow: var(--tfg-rim-light), var(--tfg-rim-shadow);
    }

    [data-tfg="on"] .solutions-discovery__title-icon.tfg-icon-badge {
        align-self: center;
    }

    [data-tfg="on"] .solutions-discovery__title {
        min-width: 0;
        margin: var(--tfg-space-0);
        color: var(--tfg-text-headline);
        font-family: var(--tfg-font-display);
        font-size: var(--tfg-font-role-section-title);
        font-weight: var(--tfg-font-weight-bold);
        letter-spacing: 0;
        line-height: var(--tfg-line-height-title);
        text-wrap: balance;
    }

    [data-tfg="on"] .solutions-discovery__lead,
    [data-tfg="on"] .solutions-discovery__lede {
        max-width: min(100%, var(--tfg-measure-wide));
        margin: var(--tfg-space-0);
        color: var(--tfg-text-secondary);
        font-size: var(--tfg-font-role-body);
        line-height: var(--tfg-line-height-body);
        text-wrap: var(--tfg-text-wrap-body);
    }

    [data-tfg="on"] .solutions-discovery__controls {
        position: relative;
        isolation: isolate;
        display: grid;
        gap: var(--tfg-space-4);
        align-content: end;
        justify-items: end;
        justify-self: end;
        inline-size: min(100%, var(--tfg-measure-rem-sm));
        min-width: 0;
        padding: var(--tfg-space-4);
        border: var(--tfg-panel-border-strong);
        border-radius: var(--tfg-radius-lg);
        background:
            radial-gradient(circle at 82% 0%, var(--tfg-accent-soft), transparent calc(var(--tfg-space-24) * 2)),
            var(--tfg-panel-background-heavy);
        box-shadow: var(--tfg-panel-shadow-deep), var(--tfg-rim-light), var(--tfg-rim-shadow);
    }

    @supports ((backdrop-filter: blur(1rem)) or (-webkit-backdrop-filter: blur(1rem))) {
        [data-tfg="on"] .solutions-discovery__controls {
            -webkit-backdrop-filter: var(--tfg-panel-blur-heavy);
            backdrop-filter: var(--tfg-panel-blur-heavy);
        }
    }

    [data-tfg="on"] .solutions-discovery__label,
    [data-tfg="on"] .solutions-discovery__count {
        margin: var(--tfg-space-0);
        color: var(--tfg-text-primary);
        font-size: var(--tfg-font-size-sm);
        font-weight: var(--tfg-font-weight-bold);
        line-height: var(--tfg-line-height-tight);
        letter-spacing: 0;
    }

    [data-tfg="on"] .solutions-discovery__label {
        color: var(--tfg-text-headline);
        font-family: var(--tfg-font-display);
        font-size: var(--tfg-font-size-body);
        letter-spacing: var(--tfg-letter-spacing);
        text-align: end;
        text-transform: uppercase;
    }

    [data-tfg="on"] .solutions-discovery__segmented.tfg-segmented {
        display: flex;
        flex-wrap: wrap;
        inline-size: 100%;
        padding: var(--tfg-space-2);
        border: var(--tfg-panel-border-strong);
        background: var(--tfg-panel-background-heavy);
        box-shadow: var(--tfg-rim-light), var(--tfg-rim-shadow);
    }

    [data-tfg="on"] .solutions-discovery__segmented .tfg-segmented__item {
        flex: 1 1 var(--tfg-size-rem-10);
        justify-content: center;
        min-width: 0;
        color: var(--tfg-text-secondary);
        font-size: var(--tfg-font-size-body);
        font-weight: var(--tfg-font-weight-semibold);
    }

    [data-tfg="on"] .solutions-discovery__segmented .tfg-segmented__item.is-active {
        border-color: var(--tfg-accent-rim);
        background: var(--tfg-panel-background-strong);
        color: var(--tfg-text-headline);
        box-shadow: var(--tfg-warm-glow), var(--tfg-rim-light);
    }

    [data-tfg="on"] .solutions-discovery__segmented .tfg-icon {
        color: currentcolor;
    }

    [data-tfg="on"] .solutions-discovery__segmented .tfg-segmented__label {
        min-width: 0;
        overflow-wrap: anywhere;
        text-align: center;
    }

    [data-tfg="on"] .solutions-discovery__count {
        display: flex;
        gap: var(--tfg-space-2);
        align-items: center;
        justify-content: flex-end;
        color: var(--tfg-text-primary);
        font-size: var(--tfg-font-size-body);
    }

    [data-tfg="on"] .solutions-discovery__count::before {
        content: "";
        display: inline-block;
        inline-size: var(--tfg-space-2);
        aspect-ratio: 1;
        border-radius: var(--tfg-radius-full);
        background: var(--tfg-accent-warm);
        box-shadow: 0 0 var(--tfg-space-4) var(--tfg-accent-glow);
    }

    [data-tfg="on"] .solutions-card-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: var(--tfg-geometry-grid-gap);
        align-items: stretch;
    }

    /* ============================================================
       CARD — premium hover halo + scale + drop-shadow cluster
       ============================================================ */

    [data-tfg="on"] .solutions-card,
    [data-tfg="on"] .solutions-stat,
    [data-tfg="on"] .solution-signal-card {
        border: var(--tfg-panel-border);
        border-radius: var(--tfg-radius-lg);
        background: var(--tfg-panel-background-soft);
        color: var(--tfg-text-primary);
    }

    [data-tfg="on"] .solutions-card {
        position: relative;
        isolation: isolate;
        display: flex;
        flex-direction: column;
        gap: var(--tfg-space-4);
        min-block-size: 100%;
        overflow: hidden;
        color: var(--tfg-text-primary);
        text-decoration: none;
        cursor: pointer;
        transition:
            transform var(--tfg-motion-duration-md, 220ms) var(--tfg-motion-ease-out, ease-out),
            box-shadow var(--tfg-motion-duration-md, 220ms) var(--tfg-motion-ease-out, ease-out),
            border-color var(--tfg-motion-duration-md, 220ms) var(--tfg-motion-ease-out, ease-out);
    }

    [data-tfg="on"] .solutions-card::before {
        content: "";
        position: absolute;
        inset: 0;
        z-index: 0;
        pointer-events: none;
        background: linear-gradient(180deg, var(--tfg-panel-highlight, transparent), transparent 30%);
    }

    [data-tfg="on"] .solutions-card::after {
        content: "";
        position: absolute;
        inset: calc(var(--tfg-border-hairline) * -1);
        z-index: 0;
        pointer-events: none;
        border-radius: inherit;
        opacity: 0;
        background: radial-gradient(circle at 50% 0%, var(--tfg-glow-warm-soft, transparent), transparent 60%);
        transition: opacity var(--tfg-motion-duration-md, 220ms) var(--tfg-motion-ease-out, ease-out);
    }

    [data-tfg="on"] .solutions-card > * {
        position: relative;
        z-index: 1;
    }

    [data-tfg="on"] .solutions-card__header {
        display: grid;
        gap: var(--tfg-space-3);
        align-items: start;
    }

    [data-tfg="on"] .solutions-card__category-frame {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        gap: var(--tfg-space-3);
        align-items: center;
        inline-size: 100%;
        min-width: 0;
        padding: var(--tfg-space-2);
        border: var(--tfg-panel-border);
        border-radius: var(--tfg-radius-pill);
        background: var(--tfg-panel-background);
        box-shadow: var(--tfg-rim-light), var(--tfg-rim-shadow);
    }

    [data-tfg="on"] .solutions-card__category-icon.tfg-icon-badge {
        align-self: center;
    }

    [data-tfg="on"] .solutions-card__title--framed {
        align-self: center;
        min-width: 0;
        margin: var(--tfg-space-0);
        color: var(--tfg-text-headline);
        font-size: var(--tfg-font-size-body);
        font-weight: var(--tfg-font-weight-bold);
        letter-spacing: 0;
        line-height: var(--tfg-line-height-tight);
        text-wrap: balance;
    }

    [data-tfg="on"] .solutions-card__header-copy {
        display: grid;
        gap: var(--tfg-space-2);
        min-width: 0;
    }

    [data-tfg="on"] .solutions-card__title,
    [data-tfg="on"] .solutions-card__headline,
    [data-tfg="on"] .solutions-card__description {
        margin: 0;
    }

    [data-tfg="on"] .solutions-card__meta-block {
        display: grid;
        gap: var(--tfg-space-2);
    }

    [data-tfg="on"] .solutions-card__meta-label {
        color: var(--tfg-text-secondary);
        font-size: var(--tfg-font-size-xs);
        font-weight: var(--tfg-font-weight-medium);
        letter-spacing: 0;
        text-transform: uppercase;
    }

    [data-tfg="on"] .solutions-card__chips,
    [data-tfg="on"] .solutions-card__pillars {
        display: flex;
        flex-wrap: wrap;
        gap: var(--tfg-space-2);
        min-width: 0;
    }

    [data-tfg="on"] .solutions-card__chips .tfg-chip,
    [data-tfg="on"] .solutions-card__pillars .tfg-chip {
        align-items: center;
        justify-content: center;
        min-block-size: auto;
        padding: var(--tfg-space-2) var(--tfg-space-3);
        line-height: var(--tfg-line-height-tight);
        letter-spacing: var(--tfg-chip-heading-tracking);
        text-align: center;
        text-wrap: balance;
        overflow-wrap: normal;
        word-break: normal;
        -webkit-hyphens: none;
        hyphens: none;
    }

    [data-tfg="on"] .solutions-card__footer {
        display: flex;
        margin-block-start: auto;
    }

    [data-tfg="on"] .solutions-card__link {
        display: inline-flex;
        align-items: center;
        gap: var(--tfg-space-2);
        min-block-size: var(--tfg-control-min-height, var(--tfg-len-rem-2-75));
        color: var(--tfg-accent-warm-strong, var(--tfg-text-primary));
        font-weight: var(--tfg-font-weight-medium);
        text-decoration: none;
        transition: gap var(--tfg-motion-duration-md, 220ms) var(--tfg-motion-ease-out, ease-out);
    }

    [data-tfg="on"] .solutions-card:hover,
    [data-tfg="on"] .solutions-card:focus-within {
        transform: translateY(calc(var(--tfg-border-hairline) * -2));
        border-color: var(--tfg-panel-border-strong, var(--tfg-panel-border));
        box-shadow: var(--tfg-shadow-card-hover, var(--tfg-shadow-md));
    }

    /* Touch devices have no real hover: kill the lift so a tap doesn't leave a stuck
       transformed card (responsive floor; mirrors the reduced-motion reset). */
    @media (pointer: coarse) {
        [data-tfg="on"] .solutions-card:hover {
            transform: none;
        }
    }

    [data-tfg="on"] .solutions-card:hover::after,
    [data-tfg="on"] .solutions-card:focus-within::after {
        opacity: 1;
    }

    [data-tfg="on"] .solutions-card:hover .solutions-card__link {
        gap: var(--tfg-space-3);
    }

    /* ============================================================
       HERO STATS — metric frame
       ============================================================ */

    [data-tfg="on"] .solutions-hero__stats.tfg-metric-frame {
        border: var(--tfg-metric-frame-border);
        background: var(--tfg-metric-frame-background);
        box-shadow: var(--tfg-metric-frame-shadow);
    }

    [data-tfg="on"] .solutions-stat.tfg-metric-card {
        border: var(--tfg-metric-card-border);
        background: var(--tfg-metric-card-background);
        box-shadow: var(--tfg-metric-card-shadow);
    }

    [data-tfg="on"] .solutions-hero__stats {
        --tfg-solutions-stat-label-font-size: var(--tfg-font-size-stat-label);
        --tfg-solutions-stat-label-font-size-compact: var(--tfg-font-size-stat-label-compact);
        --tfg-solutions-stat-label-tracking: var(--tfg-letter-spacing-wide);

        display: grid;
        grid-template-columns: repeat(4, minmax(0, 1fr));
        gap: var(--tfg-space-3);
        width: 100%;
        padding: var(--tfg-space-4);
        margin-block-start: var(--tfg-space-7);
    }

    [data-tfg="on"] .solutions-hero__stats .solutions-stat {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        gap: var(--tfg-space-1);
        min-width: 0;
        min-block-size: var(--tfg-size-rem-7);
        padding: var(--tfg-space-3) var(--tfg-space-4);
        border-radius: var(--tfg-radius-md);
        text-align: center;
    }

    [data-tfg="on"] .solutions-stat__value {
        font-family: var(--tfg-font-family-display);
        font-size: var(--tfg-font-size-h3);
        font-weight: var(--tfg-font-weight-semibold);
        letter-spacing: 0;
        color: var(--tfg-text-headline);
    }

    [data-tfg="on"] .solutions-stat__label {
        inline-size: 100%;
        color: var(--tfg-text-muted);
        font-size: var(--tfg-solutions-stat-label-font-size);
        font-weight: var(--tfg-font-weight-medium);
        letter-spacing: var(--tfg-solutions-stat-label-tracking);
        line-height: var(--tfg-line-height-tight);
        text-transform: uppercase;
        text-wrap: balance;
        overflow-wrap: normal;
        word-break: normal;
        -webkit-hyphens: none;
        hyphens: none;
    }

    /* ============================================================
       SECTOR CLUSTER BRIDGE — 14 sectoral × 4 cluster heat-map
       ============================================================ */

    [data-tfg="on"] .sector-cluster-bridge {
        display: grid;
        gap: var(--tfg-space-4);
        padding: var(--tfg-space-6);
        overflow-x: auto;
        border: var(--tfg-panel-border);
        border-radius: var(--tfg-radius-xl, var(--tfg-radius-lg));
        background: var(--tfg-panel-background-soft);
    }

    [data-tfg="on"] .sector-cluster-bridge__header {
        display: grid;
        gap: var(--tfg-space-2);
    }

    [data-tfg="on"] .sector-cluster-bridge__title {
        font-size: var(--tfg-font-size-3xl, var(--tfg-font-size-xl));
        font-weight: var(--tfg-font-weight-headline);
        color: var(--tfg-text-primary);
        margin: 0;
    }

    [data-tfg="on"] .sector-cluster-bridge__lede {
        color: var(--tfg-text-secondary);
        max-inline-size: var(--tfg-measure-narrow);
    }

    [data-tfg="on"] .sector-cluster-bridge__matrix {
        inline-size: 100%;
        min-inline-size: var(--tfg-measure-rem-xl);
        table-layout: fixed;
        border-collapse: separate;
        border-spacing: var(--tfg-space-2);
    }

    [data-tfg="on"] .sector-cluster-bridge__col-header,
    [data-tfg="on"] .sector-cluster-bridge__row-header {
        padding: var(--tfg-space-3);
        font-size: var(--tfg-font-size-sm);
        font-weight: var(--tfg-font-weight-medium);
        color: var(--tfg-text-secondary);
        letter-spacing: 0;
        text-transform: uppercase;
        vertical-align: middle;
    }

    [data-tfg="on"] .sector-cluster-bridge__row-header {
        inline-size: calc(var(--tfg-control-min-height) * 6.5);
        font-size: var(--tfg-font-size-base);
        font-weight: var(--tfg-font-weight-medium);
        color: var(--tfg-text-primary);
        text-transform: none;
        letter-spacing: 0;
        text-align: end;
        text-wrap: balance;
    }

    [data-tfg="on"] .sector-cluster-bridge__col-header:first-child {
        inline-size: calc(var(--tfg-control-min-height) * 6.5);
    }

    [data-tfg="on"] .sector-cluster-bridge__col-header[data-cluster] {
        text-align: center;
    }

    [data-tfg="on"] .sector-cluster-bridge__cell {
        display: table-cell;
        vertical-align: middle;
        padding: var(--tfg-space-3);
        border-radius: var(--tfg-radius-md, var(--tfg-radius-lg));
        font-size: var(--tfg-font-size-xs);
        font-weight: var(--tfg-font-weight-medium);
        text-transform: uppercase;
        letter-spacing: 0;
        line-height: var(--tfg-line-height-tight);
        text-align: center;
        color: var(--tfg-text-secondary);
        background: var(--tfg-panel-background);
        border: var(--tfg-panel-border);
        transition: transform var(--tfg-motion-duration-md, 220ms) var(--tfg-motion-ease-out, ease-out);
    }

    [data-tfg="on"] .sector-cluster-bridge__cell:hover {
        transform: scale(1.04);
    }

    /* Cluster accent — token discipline; sentinel scope LOCKED → defense uses accent-cool */
    [data-tfg="on"] .sector-cluster-bridge__cell[data-cluster="foundation"][data-intensity="critical"],
    [data-tfg="on"] .sector-cluster-bridge__cell[data-cluster="foundation"][data-intensity="high"] {
        background: var(--tfg-success-soft, var(--tfg-panel-background-soft));
        color: var(--tfg-success-strong, var(--tfg-text-primary));
        border-color: var(--tfg-success-border, var(--tfg-panel-border));
    }

    [data-tfg="on"] .sector-cluster-bridge__cell[data-cluster="defense"][data-intensity="critical"],
    [data-tfg="on"] .sector-cluster-bridge__cell[data-cluster="defense"][data-intensity="high"] {
        background: var(--tfg-accent-cool-soft, var(--tfg-panel-background-soft));
        color: var(--tfg-accent-cool-strong, var(--tfg-text-primary));
        border-color: var(--tfg-accent-cool-border, var(--tfg-panel-border));
    }

    [data-tfg="on"] .sector-cluster-bridge__cell[data-cluster="governance"][data-intensity="critical"],
    [data-tfg="on"] .sector-cluster-bridge__cell[data-cluster="governance"][data-intensity="high"] {
        background: var(--tfg-text-muted-soft, var(--tfg-panel-background-soft));
        color: var(--tfg-text-primary);
        border-color: var(--tfg-panel-border-strong, var(--tfg-panel-border));
    }

    [data-tfg="on"] .sector-cluster-bridge__cell[data-cluster="build"][data-intensity="critical"],
    [data-tfg="on"] .sector-cluster-bridge__cell[data-cluster="build"][data-intensity="high"] {
        background: var(--tfg-accent-warm-soft, var(--tfg-panel-background-soft));
        color: var(--tfg-accent-warm-strong, var(--tfg-text-primary));
        border-color: var(--tfg-accent-warm-border, var(--tfg-panel-border));
    }

    [data-tfg="on"] .sector-cluster-bridge__cell[data-intensity="critical"] {
        font-weight: var(--tfg-font-weight-headline);
    }

    /* Cluster colour-key legend — connects the column codenames + heat colours to plain meaning
       (Patron 2026-06-20: "bu bölüm ne işe yarıyor anlamadım"). Swatches mirror the cell tints. */
    [data-tfg="on"] .sector-cluster-bridge__legend {
        display: flex;
        flex-wrap: wrap;
        gap: var(--tfg-space-2) var(--tfg-space-4);
        margin: var(--tfg-space-0);
        padding: var(--tfg-space-0);
        list-style: none;
    }

    [data-tfg="on"] .sector-cluster-bridge__legend-item {
        display: inline-flex;
        align-items: center;
        gap: var(--tfg-space-2);
        font-size: var(--tfg-font-size-sm);
        color: var(--tfg-text-secondary);
    }

    [data-tfg="on"] .sector-cluster-bridge__legend-swatch {
        inline-size: var(--tfg-space-3);
        block-size: var(--tfg-space-3);
        flex-shrink: 0;
        border-radius: var(--tfg-radius-sm, var(--tfg-radius-md));
        border: var(--tfg-panel-border);
        background: var(--tfg-panel-background);
    }

    [data-tfg="on"] .sector-cluster-bridge__legend-item[data-cluster="foundation"] .sector-cluster-bridge__legend-swatch {
        background: var(--tfg-success-soft, var(--tfg-panel-background-soft));
        border-color: var(--tfg-success-border, var(--tfg-panel-border));
    }

    [data-tfg="on"] .sector-cluster-bridge__legend-item[data-cluster="defense"] .sector-cluster-bridge__legend-swatch {
        background: var(--tfg-accent-cool-soft, var(--tfg-panel-background-soft));
        border-color: var(--tfg-accent-cool-border, var(--tfg-panel-border));
    }

    [data-tfg="on"] .sector-cluster-bridge__legend-item[data-cluster="governance"] .sector-cluster-bridge__legend-swatch {
        background: var(--tfg-text-muted-soft, var(--tfg-panel-background-soft));
        border-color: var(--tfg-panel-border-strong, var(--tfg-panel-border));
    }

    [data-tfg="on"] .sector-cluster-bridge__legend-item[data-cluster="build"] .sector-cluster-bridge__legend-swatch {
        background: var(--tfg-accent-warm-soft, var(--tfg-panel-background-soft));
        border-color: var(--tfg-accent-warm-border, var(--tfg-panel-border));
    }

    /* Row header → sector page (makes the map an actionable finder, not a static chart) */
    [data-tfg="on"] .sector-cluster-bridge__row-link {
        color: inherit;
        text-decoration: none;
        transition: color var(--tfg-motion-duration-md, 220ms) var(--tfg-motion-ease-out, ease-out);
    }

    [data-tfg="on"] .sector-cluster-bridge__row-link:hover,
    [data-tfg="on"] .sector-cluster-bridge__row-link:focus-visible {
        color: var(--tfg-accent-warm-strong, var(--tfg-text-primary));
        text-decoration: underline;
        text-underline-offset: var(--tfg-space-1);
    }

    @media (max-width: 47.99rem), (pointer: coarse) {
        [data-tfg="on"] .solutions-discovery__segmented .tfg-segmented__item,
        [data-tfg="on"] .solutions-card__link {
            min-block-size: var(--tfg-touch-min-height, var(--tfg-space-12));
        }
    }

    /* ============================================================
       DETAIL PAGE — section rhythm + glass inner highlight
       ============================================================ */

    [data-tfg="on"] .content-page__layout:has(.solution-sidebar) {
        display: grid;
        grid-template-columns: minmax(var(--tfg-grid-col-14), var(--tfg-grid-card-min)) minmax(0, 1fr);
        gap: var(--tfg-space-7);
        align-items: start;
    }

    [data-tfg="on"] .content-page__layout:has(.solution-sidebar) .content-page__sidebar,
    [data-tfg="on"] .content-page__layout:has(.solution-sidebar) .content-page__main {
        min-width: 0;
    }

    [data-tfg="on"] .content-page__layout:has(.solution-sidebar) .content-page__sidebar {
        position: sticky;
        top: var(--tfg-space-6);
    }

    [data-tfg="on"] .content-page__layout:has(.solution-sidebar) .content-page__sidebar-inner,
    [data-tfg="on"] .solution-sidebar {
        display: grid;
        gap: var(--tfg-space-4);
    }

    [data-tfg="on"] .solution-sidebar__panel {
        display: grid;
        gap: var(--tfg-space-3);
        padding: var(--tfg-space-4);
    }

    [data-tfg="on"] .solution-sidebar__title {
        color: var(--tfg-text-headline);
        font-size: var(--tfg-font-size-sm);
        font-weight: var(--tfg-font-weight-headline);
    }

    [data-tfg="on"] .solution-sidebar__list {
        display: grid;
        gap: var(--tfg-space-3);
        margin: 0;
        padding: 0;
        list-style: none;
    }

    [data-tfg="on"] .solution-sidebar__item,
    [data-tfg="on"] .solution-sidebar__link {
        min-width: 0;
    }

    [data-tfg="on"] .solution-sidebar__item {
        display: grid;
        gap: var(--tfg-space-1);
    }

    [data-tfg="on"] .solution-sidebar__link {
        display: inline-flex;
        align-items: center;
        min-block-size: var(--tfg-control-min-height);
        padding: var(--tfg-space-2) var(--tfg-space-3);
        margin-inline: calc(var(--tfg-space-3) * -1);
        border-radius: var(--tfg-radius-pill);
        color: var(--tfg-text-primary);
        font-weight: var(--tfg-font-weight-medium);
        text-decoration: none;
    }

    [data-tfg="on"] .solution-sidebar__hint,
    [data-tfg="on"] .solution-sidebar__body {
        color: var(--tfg-text-secondary);
        font-size: var(--tfg-font-size-sm);
        line-height: var(--tfg-line-height-body);
    }


    /* ============================================================
       RESPONSIVE
       ============================================================ */

    @media (max-width: 64rem) {
        [data-tfg="on"] .solutions-discovery__header {
            grid-template-columns: 1fr;
            align-items: start;
        }

        [data-tfg="on"] .solutions-discovery__controls {
            justify-items: start;
            justify-self: stretch;
            inline-size: 100%;
        }

        [data-tfg="on"] .solutions-card-grid {
            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        [data-tfg="on"] .solutions-hero__stats {
            --tfg-solutions-stat-label-font-size: var(--tfg-solutions-stat-label-font-size-compact);

            grid-template-columns: repeat(2, minmax(0, 1fr));
        }

        [data-tfg="on"] .solutions-stat__label {
            font-size: var(--tfg-solutions-stat-label-font-size);
            letter-spacing: var(--tfg-solutions-stat-label-tracking);
        }
    }

    @media (max-width: 48rem) {
        [data-tfg="on"] .solutions-hero__shell,
        [data-tfg="on"] .content-page__layout:has(.solution-sidebar) {
            grid-template-columns: 1fr;
        }

        [data-tfg="on"] .solution-sidebar__link {
            min-block-size: var(--tfg-touch-min-height);
        }

        [data-tfg="on"] .solutions-hero__shell {
            gap: var(--tfg-space-6);
            padding: var(--tfg-space-6) var(--tfg-space-4);
        }

        [data-tfg="on"] .solutions-discovery {
            gap: var(--tfg-space-5);
            padding: var(--tfg-space-4);
        }

        [data-tfg="on"] .solutions-card-grid {
            grid-template-columns: 1fr;
        }

        [data-tfg="on"] .solutions-discovery__controls {
            padding: var(--tfg-space-3);
        }

        [data-tfg="on"] .solutions-discovery__label {
            justify-self: stretch;
            display: flex;
            align-items: center;
            justify-content: center;
            min-block-size: calc(var(--tfg-control-min-height) + var(--tfg-space-1));
            padding: var(--tfg-space-2) var(--tfg-space-3);
            border: var(--tfg-panel-border);
            border-radius: var(--tfg-radius-pill);
            background: var(--tfg-panel-background-strong);
            box-shadow: var(--tfg-rim-light);
            text-align: center;
        }

        [data-tfg="on"] .solutions-discovery__segmented.tfg-segmented {
            display: grid;
            grid-template-columns: 1fr;
            gap: var(--tfg-space-2);
            padding: var(--tfg-space-2);
            border-radius: calc(var(--tfg-radius-xl) + var(--tfg-space-2));
            background:
                linear-gradient(180deg, var(--tfg-panel-background-strong), var(--tfg-panel-background-heavy)),
                var(--tfg-panel-background-heavy);
        }

        [data-tfg="on"] .solutions-discovery__segmented .tfg-segmented__item {
            inline-size: 100%;
            min-block-size: calc(var(--tfg-control-min-height) + var(--tfg-space-4));
            padding: var(--tfg-space-3) var(--tfg-space-4);
        }

        [data-tfg="on"] .solutions-discovery__segmented .tfg-segmented__item.is-active {
            box-shadow: var(--tfg-warm-glow), var(--tfg-rim-light), var(--tfg-rim-shadow);
        }

        [data-tfg="on"] .solutions-discovery__count {
            justify-content: center;
            inline-size: 100%;
            min-block-size: var(--tfg-control-min-height);
            padding: var(--tfg-space-2) var(--tfg-space-3);
            border: var(--tfg-panel-border);
            border-radius: var(--tfg-radius-pill);
            background: var(--tfg-panel-background-soft);
            text-align: center;
            text-wrap: balance;
        }

        [data-tfg="on"] .content-page__layout:has(.solution-sidebar) .content-page__sidebar {
            position: static;
        }

        [data-tfg="on"] .solutions-hero__stats {
            grid-template-columns: repeat(2, minmax(0, 1fr));
            gap: var(--tfg-space-3);
            margin-block-start: var(--tfg-space-3);
        }

        [data-tfg="on"] .solutions-hero__stats .solutions-stat {
            min-block-size: var(--tfg-len-rem-5-75);
            padding: var(--tfg-space-3);
        }

        [data-tfg="on"] .solutions-stat__label {
            font-size: var(--tfg-solutions-stat-label-font-size);
            letter-spacing: var(--tfg-solutions-stat-label-tracking);
        }

        [data-tfg="on"] .solutions-hero__decision-map {
            min-block-size: 0;
        }

        [data-tfg="on"] .solutions-hero__map-node {
            inline-size: clamp(3.8rem, 18vw, 5rem);
        }

        [data-tfg="on"] .sector-cluster-bridge {
            overflow-x: visible;
            padding: var(--tfg-space-4);
        }

        [data-tfg="on"] .sector-cluster-bridge__title {
            font-size: var(--tfg-font-size-2xl, var(--tfg-font-size-xl));
        }

        [data-tfg="on"] .sector-cluster-bridge__lede {
            max-inline-size: 100%;
            margin: var(--tfg-space-0);
        }

        [data-tfg="on"] .sector-cluster-bridge__matrix {
            display: block;
            min-inline-size: 0;
            inline-size: 100%;
            border-spacing: var(--tfg-space-0);
        }

        [data-tfg="on"] .sector-cluster-bridge__matrix thead {
            display: none;
        }

        [data-tfg="on"] .sector-cluster-bridge__matrix tbody {
            display: grid;
            gap: var(--tfg-space-3);
        }

        [data-tfg="on"] .sector-cluster-bridge__matrix tr {
            display: grid;
            gap: var(--tfg-space-2);
            min-width: 0;
            padding: var(--tfg-space-3);
            border: var(--tfg-panel-border);
            border-radius: var(--tfg-radius-lg);
            background: var(--tfg-panel-background);
            box-shadow: var(--tfg-rim-light), var(--tfg-rim-shadow);
        }

        [data-tfg="on"] .sector-cluster-bridge__row-header {
            display: block;
            inline-size: auto;
            padding: var(--tfg-space-1) var(--tfg-space-1) var(--tfg-space-2);
            color: var(--tfg-text-headline);
            font-weight: var(--tfg-font-weight-bold);
            text-align: start;
        }

        [data-tfg="on"] .sector-cluster-bridge__cell {
            display: grid;
            grid-template-columns: minmax(0, 1fr) auto;
            gap: var(--tfg-space-3);
            align-items: center;
            inline-size: 100%;
            min-width: 0;
            min-block-size: var(--tfg-touch-min-height);
            padding: var(--tfg-space-3);
            text-align: end;
        }

        [data-tfg="on"] .sector-cluster-bridge__cell::before {
            content: attr(data-cluster-label);
            min-width: 0;
            overflow-wrap: anywhere;
            color: var(--tfg-text-secondary);
            font-size: var(--tfg-font-size-xs);
            font-weight: var(--tfg-font-weight-medium);
            letter-spacing: 0;
            line-height: var(--tfg-line-height-tight);
            text-align: start;
            text-transform: uppercase;
        }
    }

    @media (max-width: 30rem) {
        [data-tfg="on"] .solutions-discovery {
            padding: var(--tfg-space-3);
        }

        [data-tfg="on"] .solutions-discovery__controls {
            gap: var(--tfg-space-3);
            padding: var(--tfg-space-3);
        }

        [data-tfg="on"] .solutions-discovery__label {
            font-size: var(--tfg-font-size-sm);
        }

        [data-tfg="on"] .solutions-discovery__segmented .tfg-segmented__item {
            min-block-size: calc(var(--tfg-control-min-height) + var(--tfg-space-2));
        }

        [data-tfg="on"] .solutions-hero__stats {
            gap: var(--tfg-space-2);
        }

        [data-tfg="on"] .solutions-hero__stats .solutions-stat {
            padding: var(--tfg-space-2);
        }

        [data-tfg="on"] .solutions-card__chips .tfg-chip,
        [data-tfg="on"] .solutions-card__pillars .tfg-chip {
            inline-size: 100%;
            padding-inline: var(--tfg-space-2);
            font-size: var(--tfg-font-size-sm);
            letter-spacing: 0;
        }

        [data-tfg="on"] .sector-cluster-bridge {
            padding: var(--tfg-space-3);
        }

        [data-tfg="on"] .sector-cluster-bridge__matrix tr {
            padding: var(--tfg-space-2);
        }

        [data-tfg="on"] .sector-cluster-bridge__cell {
            grid-template-columns: 1fr;
            gap: var(--tfg-space-1);
            text-align: start;
        }
    }

    /* ============================================================
       REDUCED MOTION + FORCED COLORS
       ============================================================ */

    @media (prefers-reduced-motion: reduce) {
        [data-tfg="on"] .solutions-card,
        [data-tfg="on"] .solutions-card::after,
        [data-tfg="on"] .solutions-hero-badge.tfg-chip,
        [data-tfg="on"] .sector-cluster-bridge__cell,
        [data-tfg="on"] .solution-signal-card {
            transition: none;
        }

        [data-tfg="on"] .solutions-card:hover,
        [data-tfg="on"] .solutions-card:focus-within {
            transform: none;
        }

        [data-tfg="on"] .sector-cluster-bridge__cell:hover {
            transform: none;
        }
    }

    @media (forced-colors: active) {
        [data-tfg="on"] .solutions-hero::before,
        [data-tfg="on"] .solutions-hero__decision-panel::before,
        [data-tfg="on"] .solutions-hero__decision-panel::after,
        [data-tfg="on"] .solutions-discovery::after,
        [data-tfg="on"] .solutions-card::before,
        [data-tfg="on"] .solutions-card::after {
            display: none;
        }

        [data-tfg="on"] .sector-cluster-bridge__cell {
            border: var(--tfg-border-hairline) solid CanvasText;
        }
    }
}

@layer utilities {
    [data-tfg="on"] .solutions-hero__stats .solutions-stat .solutions-stat__label,
    [data-tfg="on"] .solutions-card__chips .tfg-chip,
    [data-tfg="on"] .solutions-card__pillars .tfg-chip,
    [data-tfg="on"] .solutions-card__chips .tfg-chip > :not(.badge-dot, .tfg-chip__icon, .tfg-heading-icon),
    [data-tfg="on"] .solutions-card__pillars .tfg-chip > :not(.badge-dot, .tfg-chip__icon, .tfg-heading-icon) {
        overflow-wrap: normal;
        word-break: normal;
        -webkit-hyphens: none;
        hyphens: none;
    }
}

@layer sections {
    /* ================================================================
       Premium uplift (Patron 2026-06-12 onayı; karşılaştırma kartı A1-A4 + B1-B3):
       services leaf'in premium cam dili solutions detayına taşındı.
       Chrome reçeteleri MEVCUT tokenlardan; yeni token yok.
       ================================================================ */

    /* Premium kabuk/başlık/eyebrow chrome'u artık paylaşılan primitive'lerde:
       Sections/PremiumShell.css (tfg-premium-shell / tfg-section-head /
       tfg-framed-heading--eyebrow / tfg-grid-balanced) — Patron 2026-06-12
       tokenizasyon direktifi. Bu dosyada yalnız aileye özgü desenler kalır. */

    /* ════════════════════════════════════════════════════════════════
       SOLUTION DETAIL — temiz yeniden yazım (Patron 2026-06-12:
       "UI'ı baştan sona tekrar yaz, yamalı olmasın, tokenize olmayan kalmasın").
       Kabuk/başlık/eyebrow/denge chrome'u Sections/PremiumShell.css
       primitive'lerinden; burada YALNIZ detay sayfasına özgü yerleşim.
       Tüm boyut/ritim değerleri token (Spacing 2026-06-12 bloğu).
       Belgeli istisnalar dosya-başı bloğa tabidir (aspect-ratio sabitleri,
       akışkan clamp uçları, opaklık serileri, kanonik letter-spacing:0,
       gradient yüzdeleri, transition token-fallback literal'leri).
       ════════════════════════════════════════════════════════════════ */

    /* ── 1. Sayfa kökü + hero kopya alanı ───────────────────────────── */
    [data-tfg="on"] .solution-detail-page {
        background: transparent;
        color: var(--tfg-text-primary);
    }

    [data-tfg="on"] .content-page.solution-detail-page .content-page__hero-inner {
        display: grid;
        overflow: hidden;
        padding: clamp(var(--tfg-space-5), 4vw, var(--tfg-space-9));
    }

    [data-tfg="on"] .content-page.solution-detail-page .content-page__hero .tfg-section-header {
        display: grid;
        gap: var(--tfg-space-4);
        justify-items: start;
        min-width: 0;
    }

    [data-tfg="on"] .content-page.solution-detail-page .content-page__hero .tfg-section-header__leading {
        inline-size: auto;
    }

    [data-tfg="on"] .content-page.solution-detail-page .content-page__hero .tfg-section-header__eyebrow {
        inline-size: fit-content;
    }

    /* Rezerv değişkenleri CLS önler: SSR->interaktif geçişte hero yüksekliği oynamaz. */
    [data-tfg="on"] .content-page.solution-detail-page .content-page__hero .tfg-section-header__title {
        max-inline-size: min(100%, var(--tfg-measure-title-tight));
        min-block-size: var(--tfg-solution-hero-title-reserve, auto);
        margin: var(--tfg-space-0);
    }

    [data-tfg="on"] .content-page.solution-detail-page .content-page__hero .tfg-section-header__description {
        max-inline-size: min(100%, var(--tfg-measure-wide));
        min-block-size: var(--tfg-solution-hero-description-reserve, auto);
        margin: var(--tfg-space-0);
        line-height: var(--tfg-line-height-snug);
    }

    [data-tfg="on"] .content-page.solution-detail-page .content-page__hero .tfg-section-header__actions {
        display: grid;
        gap: var(--tfg-space-0);
        align-items: start;
        justify-content: start;
        inline-size: 100%;
        min-block-size: var(--tfg-solution-hero-action-stack-reserve, auto);
    }

    /* ── 2. Hero aksiyonları: tek CTA çifti + nitel brief ───────────── */
    [data-tfg="on"] .solution-hero-action-stack {
        display: grid;
        gap: var(--tfg-space-4);
        inline-size: min(100%, var(--tfg-hero-action-stack-width));
        min-block-size: var(--tfg-solution-hero-action-stack-reserve, auto);
        min-width: 0;
    }

    [data-tfg="on"] .solution-hero-cta-row {
        display: flex;
        flex-wrap: wrap;
        gap: var(--tfg-space-3);
        align-items: center;
        min-width: 0;
    }

    [data-tfg="on"] .solution-hero-primary-cta,
    [data-tfg="on"] .solution-hero-related-cta {
        min-inline-size: min(100%, var(--tfg-hero-cta-min-width));
        min-block-size: var(--tfg-touch-min-height);
    }

    [data-tfg="on"] .solution-hero-related-cta {
        border-color: var(--tfg-surface-border-strong, var(--tfg-surface-border));
        background: var(--tfg-panel-background-soft);
        color: var(--tfg-text-headline);
    }

    [data-tfg="on"] .solution-hero-related-cta .btn-icon {
        color: var(--tfg-text-secondary);
    }

    [data-tfg="on"] .solution-hero-brief {
        position: relative;
        isolation: isolate;
        overflow: hidden;
        display: grid;
        inline-size: 100%;
        min-width: 0;
        padding: var(--tfg-space-4);
        border: var(--tfg-metric-frame-border);
        border-radius: var(--tfg-metric-frame-radius);
        background: var(--tfg-metric-frame-background);
        color: var(--tfg-text-primary);
        box-shadow: var(--tfg-metric-frame-shadow);
    }

    [data-tfg="on"] .solution-hero-brief::before {
        position: absolute;
        z-index: 0;
        inset-block-start: var(--tfg-space-0);
        inset-inline: var(--tfg-space-8);
        block-size: var(--tfg-border-hairline);
        border-radius: var(--tfg-radius-pill);
        background: var(--tfg-metric-frame-top-rim);
        content: "";
        opacity: 0.9;
        pointer-events: none;
    }

    [data-tfg="on"] .solution-hero-brief > * {
        position: relative;
        z-index: 1;
    }

    @supports ((-webkit-backdrop-filter: blur(1rem)) or (backdrop-filter: blur(1rem))) {
        [data-tfg="on"] .solution-hero-brief {
            -webkit-backdrop-filter: var(--tfg-metric-frame-blur);
            backdrop-filter: var(--tfg-metric-frame-blur);
        }
    }

    [data-tfg="on"] .solution-hero-brief__metrics {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: var(--tfg-space-3);
    }

    [data-tfg="on"] .solution-hero-brief__metric {
        position: relative;
        isolation: isolate;
        overflow: hidden;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: var(--tfg-space-3);
        min-width: 0;
        min-block-size: var(--tfg-metric-cell-min-height);
        padding: var(--tfg-space-4) var(--tfg-space-5);
        border: var(--tfg-metric-card-border);
        border-radius: var(--tfg-radius-lg);
        background:
            linear-gradient(135deg, var(--tfg-rim-light-gradient), transparent 42%),
            var(--tfg-metric-card-background);
        color: var(--tfg-text-secondary);
        line-height: var(--tfg-line-height-tight);
        text-align: center;
        box-shadow: var(--tfg-metric-card-shadow);
    }

    [data-tfg="on"] .solution-hero-brief__metric::before {
        position: absolute;
        z-index: 0;
        inset-block-start: var(--tfg-space-0);
        inset-inline: var(--tfg-space-4);
        block-size: var(--tfg-border-hairline);
        border-radius: var(--tfg-radius-pill);
        background: var(--tfg-metric-card-hover-rim);
        content: "";
        opacity: 0.46;
        pointer-events: none;
    }

    [data-tfg="on"] .solution-hero-brief__metric > * {
        position: relative;
        z-index: 1;
    }

    [data-tfg="on"] .solution-hero-brief__metric-value {
        font-family: var(--tfg-font-family-display);
        color: var(--tfg-text-headline);
        font-size: var(--tfg-font-size-h3);
        font-weight: var(--tfg-font-weight-semibold);
        letter-spacing: 0;
        line-height: var(--tfg-line-height-tight);
    }

    [data-tfg="on"] .solution-hero-brief__metric-label {
        max-inline-size: var(--tfg-measure-metric-label);
        color: var(--tfg-text-muted);
        font-size: var(--tfg-font-size-caption);
        font-weight: var(--tfg-font-weight-medium);
        letter-spacing: var(--tfg-tracking-eyebrow);
        line-height: var(--tfg-line-height-tight);
        text-transform: uppercase;
        text-wrap: balance;
        overflow-wrap: normal;
        word-break: normal;
        -webkit-hyphens: none;
        hyphens: none;
    }

    /* ── 3. Hero infografik çerçevesi ───────────────────────────────── */
    [data-tfg="on"] .solution-hero-visual {
        display: grid;
        inline-size: min(100%, var(--tfg-hero-visual-size));
        min-width: 0;
    }

    [data-tfg="on"] .solution-hero-visual__frame {
        position: relative;
        display: grid;
        inline-size: 100%;
        max-inline-size: var(--tfg-hero-visual-size);
        aspect-ratio: 1 / 1;
        border: var(--tfg-panel-border);
        border-radius: var(--tfg-radius-lg);
        background:
            radial-gradient(ellipse 70% 72% at 50% 42%, var(--tfg-accent-soft) 0%, transparent 66%),
            var(--tfg-panel-background, var(--tfg-panel-background-soft));
        box-shadow: var(--tfg-shadow-panel);
    }

    [data-tfg="on"] .solution-hero-visual__frame picture {
        display: block;
        inline-size: 100%;
        block-size: 100%;
    }

    [data-tfg="on"] .solution-hero-visual__image {
        display: block;
        width: 100%;
        height: 100%;
        border-radius: inherit;
        object-fit: contain;
    }

    /* ── 4. Yerleşim: kenar çubuğu + bölüm ritmi ────────────────────── */
    [data-tfg="on"] .content-page__layout:has(.solution-sidebar) {
        display: grid;
        grid-template-columns: minmax(0, 0.3fr) minmax(0, 0.7fr);
        gap: var(--tfg-space-6);
        align-items: start;
    }

    [data-tfg="on"] .content-page__layout:has(.solution-sidebar) .content-page__sidebar,
    [data-tfg="on"] .content-page__layout:has(.solution-sidebar) .content-page__main {
        min-width: 0;
    }

    [data-tfg="on"] .content-page__layout:has(.solution-sidebar) .content-page__sidebar {
        position: sticky;
        inset-block-start: calc(var(--tfg-nav-control-size) + var(--tfg-space-6));
    }

    [data-tfg="on"] .content-page__layout:has(.solution-sidebar) .content-page__sidebar-inner,
    [data-tfg="on"] .solution-sidebar {
        display: grid;
        gap: var(--tfg-space-4);
    }

    /* Kabuk + dolgu tfg-premium-shell--aside varyantından; başlık framed-eyebrow chip. */
    [data-tfg="on"] .solution-sidebar__panel {
        justify-items: start;
    }

    [data-tfg="on"] .solution-sidebar__panel--contact {
        border-color: var(--tfg-accent-ring, var(--tfg-accent-warm));
    }

    /* TOC: çok-kolonlu sarmal yerine tek kolon tam-genişlik satırlar. */
    [data-tfg="on"] .solution-sidebar .tfg-anchor-nav {
        inline-size: 100%;
    }

    [data-tfg="on"] .solution-sidebar .tfg-anchor-nav__list {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: var(--tfg-space-1);
    }

    [data-tfg="on"] .solution-sidebar .tfg-anchor-nav__link {
        display: flex;
        align-items: center;
        gap: var(--tfg-space-2);
        inline-size: 100%;
        min-width: 0;
        padding: var(--tfg-space-2) var(--tfg-space-3);
        border-radius: var(--tfg-radius-pill);
    }

    [data-tfg="on"] .solution-sidebar__list {
        display: grid;
        gap: var(--tfg-space-3);
        margin: var(--tfg-space-0);
        padding: var(--tfg-space-0);
        list-style: none;
        inline-size: 100%;
    }

    [data-tfg="on"] .solution-sidebar__item,
    [data-tfg="on"] .solution-sidebar__link {
        min-width: 0;
    }

    [data-tfg="on"] .solution-sidebar__item {
        display: grid;
        gap: var(--tfg-space-1);
        inline-size: 100%;
    }

    [data-tfg="on"] .solution-sidebar__item + .solution-sidebar__item {
        border-block-start: var(--tfg-border-hairline) solid var(--tfg-surface-border);
        padding-block-start: var(--tfg-space-3);
    }

    [data-tfg="on"] .solution-sidebar__link {
        color: var(--tfg-text-primary);
        font-weight: var(--tfg-font-weight-semibold);
        text-decoration: none;
        overflow-wrap: anywhere;
    }

    [data-tfg="on"] .solution-sidebar__link:hover,
    [data-tfg="on"] .solution-sidebar__link:focus-visible {
        color: var(--tfg-accent-warm-bright);
    }

    [data-tfg="on"] .solution-sidebar__hint,
    [data-tfg="on"] .solution-sidebar__body {
        color: var(--tfg-text-secondary);
        font-size: var(--tfg-font-size-body-sm);
        line-height: var(--tfg-line-height-body);
    }

    /* Section rhythm (Patron 2026-06-19): the inter-section gap was uneven on /sectors/* because the
       old rule only spaced adjacent .solution-section pairs — boundaries with the overview panel,
       AI-summary, sector-bridge, and CTA sections were ungoverned. All top-level sections are direct
       children of .content-page__main, so an owl selector gives every boundary ONE canonical,
       responsive gap (--tfg-geometry-page-section-gap = 40px desktop, 32px mobile via the breakpoint
       redefinition in Tokens/Spacing.css). Enforced mechanically by SectionSpacingGate. */
    [data-tfg="on"] .content-page.solution-detail-page .content-page__main > * + * {
        margin-block-start: var(--tfg-geometry-page-section-gap);
    }

    /* ── 5. Overview / Trust / CTA panelleri (kabuk: tfg-premium-shell) ─ */
    [data-tfg="on"] .solution-overview-panel,
    [data-tfg="on"] .solution-cta-panel {
        gap: var(--tfg-space-5);
        padding: var(--tfg-space-6);
    }

    [data-tfg="on"] .solution-cta-panel.tfg-terminal-cta__shell {
        gap: var(--tfg-space-8);
    }

    [data-tfg="on"] .solution-overview-panel__meta {
        display: flex;
        flex-wrap: wrap;
        gap: var(--tfg-space-2);
        align-items: center;
    }

    [data-tfg="on"] .solution-overview-panel__label {
        color: var(--tfg-text-secondary);
        font-size: var(--tfg-font-size-xs);
        font-weight: var(--tfg-font-weight-medium);
        letter-spacing: 0;
        text-transform: uppercase;
    }

    [data-tfg="on"] .solution-overview-panel__title,
    [data-tfg="on"] .solution-overview-panel__body {
        margin: var(--tfg-space-0);
    }

    [data-tfg="on"] .solution-overview-panel__why {
        display: grid;
        gap: var(--tfg-space-2);
        justify-items: start;
    }

    [data-tfg="on"] .solution-overview-panel__why-label {
        color: var(--tfg-accent-warm-bright);
        font-size: var(--tfg-font-size-caption);
        font-weight: var(--tfg-font-weight-semibold);
        letter-spacing: var(--tfg-letter-spacing-wide);
        text-transform: uppercase;
    }

    [data-tfg="on"] .solution-overview-panel__chips {
        display: flex;
        flex-wrap: wrap;
        gap: var(--tfg-space-2);
        align-items: center;
    }

    /* ── 5b. Çözüm Kapsamı kartları (Patron 2026-06-19, Microsoft outcome-bloğu deseni) ──
       Kitleyi etiketlemeden outcome-çerçeveli başlık + gövde. Sektör-genel: veri JSON'dan;
       şablon tüm sektörlere uyar. Token-only; acil-durum tonu ve accent-gold KULLANILMAZ (§1.3). */
    [data-tfg="on"] .solution-scope-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--tfg-grid-card-min)), 1fr));
        gap: var(--tfg-space-4);
        align-items: stretch;
    }

    [data-tfg="on"] .solution-scope-card {
        display: grid;
        gap: var(--tfg-space-3);
        align-content: start;
        padding: var(--tfg-space-4);
        border: var(--tfg-glass-card-border);
        border-radius: var(--tfg-radius-lg);
        background: var(--tfg-glass-card-background);
        box-shadow: var(--tfg-rim-light);
    }

    [data-tfg="on"] .solution-scope-card__head {
        display: flex;
        flex-wrap: wrap;
        gap: var(--tfg-space-2);
        align-items: baseline;
        justify-content: space-between;
    }

    [data-tfg="on"] .solution-scope-card__title {
        margin: var(--tfg-space-0);
    }

    [data-tfg="on"] .solution-scope-card__body {
        margin: var(--tfg-space-0);
        color: var(--tfg-text-secondary);
    }

    /* A4 kanıt-durumu rozeti — palet tonları (info/success/note/warn); acil-durum tonu ASLA. */
    [data-tfg="on"] .solution-proof-state {
        display: inline-flex;
        align-items: center;
        padding-block: calc(var(--tfg-space-1) / 2);
        padding-inline: var(--tfg-space-2);
        border: var(--tfg-border-hairline) solid var(--tfg-info);
        border-radius: var(--tfg-radius-pill);
        background: var(--tfg-info-soft);
        color: var(--tfg-info);
        font-size: var(--tfg-font-size-caption);
        font-weight: var(--tfg-font-weight-semibold);
        letter-spacing: var(--tfg-letter-spacing-wide);
        text-transform: uppercase;
        white-space: nowrap;
    }

    [data-tfg="on"] .solution-proof-state--contract {
        border-color: var(--tfg-success);
        background: var(--tfg-success-soft);
        color: var(--tfg-success);
    }

    [data-tfg="on"] .solution-proof-state--evidence {
        border-color: var(--tfg-note);
        background: var(--tfg-note-soft);
        color: var(--tfg-note);
    }

    [data-tfg="on"] .solution-proof-state--owner {
        border-color: var(--tfg-warn);
        background: var(--tfg-warn-soft);
        color: var(--tfg-warn);
    }

    /* Derinlik blokları (Patron 2026-06-19, Gemini Google-AI second-eye önerisi b) — token-only. */
    [data-tfg="on"] .solution-deepdive-list {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--tfg-grid-card-min)), 1fr));
        gap: var(--tfg-space-4);
        align-items: stretch;
    }

    [data-tfg="on"] .solution-deepdive-item {
        display: grid;
        gap: var(--tfg-space-2);
        align-content: start;
        padding: var(--tfg-space-4);
        border: var(--tfg-glass-card-border);
        border-radius: var(--tfg-radius-lg);
        background: var(--tfg-glass-card-background);
        box-shadow: var(--tfg-rim-light);
    }

    [data-tfg="on"] .solution-deepdive-item__title,
    [data-tfg="on"] .solution-deepdive-item__body {
        margin: var(--tfg-space-0);
    }

    [data-tfg="on"] .solution-deepdive-item__body {
        color: var(--tfg-text-secondary);
    }

    /* ── 6. İçerik kartları: gridler + kart anatomisi ───────────────── */
    [data-tfg="on"] .solution-signal-grid,
    [data-tfg="on"] .solution-context-grid,
    [data-tfg="on"] .solution-pillar-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--tfg-grid-card-min)), 1fr));
        gap: var(--tfg-space-4);
        align-items: stretch;
    }

    [data-tfg="on"] .solution-signal-card,
    [data-tfg="on"] .solution-context-card,
    [data-tfg="on"] .solution-pillar-card {
        display: grid;
        grid-template-rows: 1fr auto;
        gap: var(--tfg-space-3);
        align-content: stretch;
        padding: var(--tfg-space-4);
        border: var(--tfg-glass-card-border);
        background: var(--tfg-glass-card-background);
        transition:
            transform var(--tfg-motion-duration-md, 220ms) var(--tfg-motion-ease-out, ease-out),
            border-color var(--tfg-motion-duration-md, 220ms) var(--tfg-motion-ease-out, ease-out),
            box-shadow var(--tfg-motion-duration-md, 220ms) var(--tfg-motion-ease-out, ease-out);
    }

    [data-tfg="on"] .solution-signal-card p,
    [data-tfg="on"] .solution-context-card p,
    [data-tfg="on"] .solution-pillar-card p {
        margin: var(--tfg-space-0);
    }

    /* Tek satırlık sinyal kartı = kompakt yatay satır (ikon | metin). */
    [data-tfg="on"] .solution-signal-card {
        grid-template-columns: auto minmax(0, 1fr);
        align-items: center;
        min-height: 0;
    }

    [data-tfg="on"] .solution-signal-card--success {
        border-inline-start: calc(var(--tfg-border-hairline) * 3) solid var(--tfg-success-border);
    }

    [data-tfg="on"] .solution-pillar-card__header {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        gap: var(--tfg-space-3);
        align-items: start;
    }

    [data-tfg="on"] .solution-pillar-card .tfg-btn {
        align-self: end;
        margin-block-start: auto;
    }

    [data-tfg="on"] .solution-signal-card:hover,
    [data-tfg="on"] .solution-signal-card:focus-within,
    [data-tfg="on"] .solution-context-card:hover,
    [data-tfg="on"] .solution-context-card:focus-within,
    [data-tfg="on"] .solution-pillar-card:hover,
    [data-tfg="on"] .solution-pillar-card:focus-within {
        transform: translateY(calc(var(--tfg-border-hairline) * -2));
        border-color: var(--tfg-panel-border-strong, var(--tfg-panel-border));
        box-shadow: var(--tfg-shadow-card-hover, var(--tfg-shadow-md));
    }

    /* ── 6b. Birleşik dikdörtgen ikon-kutu rayı (Patron 2026-06-19: useCases/deepDive/
       pillars tek desende; approach-step yatay kutu dili + içeriğe uygun ikon, kırpma yok). ── */
    [data-tfg="on"] .solution-rail {
        display: grid;
        grid-template-columns: 1fr;
        gap: var(--tfg-space-4);
        inline-size: 100%;
        margin: var(--tfg-space-0);
        padding: var(--tfg-space-0);
        list-style: none;
    }

    [data-tfg="on"] .solution-rail-item {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        gap: var(--tfg-space-4);
        align-items: start;
        padding: var(--tfg-space-4) var(--tfg-space-5);
        border: var(--tfg-glass-card-border);
        border-radius: var(--tfg-radius-lg);
        background: var(--tfg-panel-background-soft);
        transition:
            transform var(--tfg-motion-duration-md, 220ms) var(--tfg-motion-ease-out, ease-out),
            border-color var(--tfg-motion-duration-md, 220ms) var(--tfg-motion-ease-out, ease-out),
            box-shadow var(--tfg-motion-duration-md, 220ms) var(--tfg-motion-ease-out, ease-out);
    }

    [data-tfg="on"] .solution-rail-item:hover,
    [data-tfg="on"] .solution-rail-item:focus-within {
        transform: translateY(calc(var(--tfg-border-hairline) * -2));
        border-color: var(--tfg-panel-border-strong, var(--tfg-panel-border));
        box-shadow: var(--tfg-shadow-card-hover, var(--tfg-shadow-md));
    }

    [data-tfg="on"] .solution-rail-item__body {
        display: grid;
        gap: var(--tfg-space-2);
        align-content: start;
        min-inline-size: 0;
    }

    [data-tfg="on"] .solution-rail-item__title {
        margin: var(--tfg-space-0);
    }

    [data-tfg="on"] .solution-rail-item__copy {
        margin: var(--tfg-space-0);
        color: var(--tfg-text-secondary);
        line-height: var(--tfg-line-height-body);
    }

    [data-tfg="on"] .solution-rail-item .tfg-btn {
        justify-self: start;
        margin-block-start: var(--tfg-space-2);
    }

    /* Aksiyon butonlu ray (pillars): ikon | içerik | buton-sağ, dikey ortalı.
       Patron 2026-06-19: geniş dikdörtgen kartta buton sağda durur (aksiyon-satırı deseni). */
    [data-tfg="on"] .solution-rail-item--action {
        grid-template-columns: auto minmax(0, 1fr) auto;
        align-items: center;
    }

    [data-tfg="on"] .solution-rail-item--action .tfg-btn {
        place-self: center end;
        margin-block-start: var(--tfg-space-0);
        white-space: nowrap;
    }

    @media (max-width: 48rem) {
        [data-tfg="on"] .solution-rail-item--action {
            grid-template-columns: auto minmax(0, 1fr);
            align-items: start;
        }

        [data-tfg="on"] .solution-rail-item--action .tfg-btn {
            grid-column: 1 / -1;
            justify-self: start;
            margin-block-start: var(--tfg-space-2);
        }
    }

    /* Dokunmatik cihazda (telefon/tablet) hover-kaldırma efektini kapat — touch'ta
       hover sticky kalır, kötü görünür (Patron 2026-06-19 responsive disiplini). */
    @media (pointer: coarse) {
        [data-tfg="on"] .solution-scope-card:hover,
        [data-tfg="on"] .solution-signal-card:hover,
        [data-tfg="on"] .solution-related-card:hover,
        [data-tfg="on"] .solution-rail-item:hover {
            transform: none;
        }
    }

    /* ── 6a. Kanıt destesi tablosu (C1 2026-06-12; services-group-sla deseni) ── */
    [data-tfg="on"] .solution-proof-table-frame {
        overflow-x: auto;
        border: var(--tfg-glass-card-border);
        border-radius: var(--tfg-radius-lg);
        background: var(--tfg-glass-card-background);
        box-shadow: var(--tfg-rim-light);
    }

    [data-tfg="on"] .solution-proof-table {
        width: 100%;
        min-width: min(var(--tfg-measure-rem-xl), 100%);
        border-collapse: collapse;
    }

    [data-tfg="on"] .solution-proof-table th,
    [data-tfg="on"] .solution-proof-table td {
        padding: var(--tfg-space-3);
        border-block-start: var(--tfg-panel-border);
        text-align: start;
        vertical-align: top;
    }

    [data-tfg="on"] .solution-proof-table thead th {
        border-block-start: 0;
        color: var(--tfg-text-headline);
        font-size: var(--tfg-font-size-caption);
        font-weight: var(--tfg-font-weight-semibold);
        letter-spacing: var(--tfg-letter-spacing-wide, 0.04em);
        line-height: var(--tfg-line-height-tight);
    }

    [data-tfg="on"] .solution-proof-stage {
        color: var(--tfg-accent-warm-bright);
        font-weight: var(--tfg-font-weight-semibold);
    }

    [data-tfg="on"] .solution-proof-cadence,
    [data-tfg="on"] .solution-proof-evidence {
        color: var(--tfg-text-secondary);
        line-height: var(--tfg-line-height-relaxed);
    }

    /* ── 7. Yaklaşım adımları (altın indeks; kabuk doluluğu) ────────── */
    [data-tfg="on"] .solution-approach-steps {
        display: grid;
        gap: var(--tfg-space-4);
        inline-size: 100%;
        margin: var(--tfg-space-0);
        padding: var(--tfg-space-0);
        list-style: none;
    }

    [data-tfg="on"] .solution-approach-step {
        display: grid;
        grid-template-columns: auto minmax(0, 1fr);
        gap: var(--tfg-space-4);
        align-items: start;
        padding: var(--tfg-space-4) var(--tfg-space-5);
        border: var(--tfg-glass-card-border);
        border-radius: var(--tfg-radius-lg);
        background: var(--tfg-panel-background-soft);
    }

    [data-tfg="on"] .solution-approach-step__index {
        color: var(--tfg-accent-warm-bright);
        font-family: var(--tfg-font-display);
        font-size: var(--tfg-font-size-title-sm);
        font-weight: var(--tfg-font-weight-semibold);
        line-height: var(--tfg-line-height-tight);
    }

    [data-tfg="on"] .solution-approach-step p {
        margin: var(--tfg-space-0);
        color: var(--tfg-text-secondary);
        line-height: var(--tfg-line-height-body);
    }

    /* ── 8. Benzer-çözüm rayı ───────────────────────────────────────── */
    [data-tfg="on"] .solution-related-grid {
        display: grid;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--tfg-grid-rail-min)), 1fr));
        gap: var(--tfg-space-4);
        align-items: stretch;
    }

    [data-tfg="on"] .solution-related-card {
        display: flex;
        flex-direction: column;
        gap: var(--tfg-space-3);
        min-width: 0;
        padding: var(--tfg-space-5);
        border: var(--tfg-glass-card-border);
        border-radius: var(--tfg-radius-lg);
        background: var(--tfg-glass-card-background);
        box-shadow: var(--tfg-rim-light), var(--tfg-rim-shadow);
        transition:
            transform var(--tfg-duration-fast) var(--tfg-ease-standard),
            border-color var(--tfg-duration-fast) var(--tfg-ease-standard),
            box-shadow var(--tfg-duration-fast) var(--tfg-ease-standard);
    }

    [data-tfg="on"] .solution-related-card:hover,
    [data-tfg="on"] .solution-related-card:focus-within {
        transform: translateY(calc(var(--tfg-border-hairline) * -2));
        border-color: var(--tfg-panel-border-strong, var(--tfg-panel-border));
        box-shadow: var(--tfg-shadow-card-hover, var(--tfg-shadow-md));
    }

    [data-tfg="on"] .solution-related-card__top {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: var(--tfg-space-2);
    }

    [data-tfg="on"] .solution-related-card__arrow {
        color: var(--tfg-accent-warm-bright);
        transition: transform var(--tfg-duration-fast) var(--tfg-ease-standard);
    }

    [data-tfg="on"] .solution-related-card:hover .solution-related-card__arrow {
        transform: translate(calc(var(--tfg-border-hairline) * 2), calc(var(--tfg-border-hairline) * -2));
    }

    [data-tfg="on"] .solution-related-card h3 {
        margin: var(--tfg-space-0);
        color: var(--tfg-text-headline);
        font-weight: var(--tfg-font-weight-semibold);
    }

    [data-tfg="on"] .solution-related-card p {
        margin: var(--tfg-space-0);
        color: var(--tfg-text-secondary);
        line-height: var(--tfg-line-height-body);
    }

    [data-tfg="on"] .solution-related-card .tfg-btn {
        margin-block-start: auto;
    }

    /* ── 10. Kart hover halosu ──────────────────────────────────────── */
    [data-tfg="on"] .solution-signal-card,
    [data-tfg="on"] .solution-context-card,
    [data-tfg="on"] .solution-pillar-card,
    [data-tfg="on"] .solution-related-card {
        position: relative;
    }

    [data-tfg="on"] .solution-signal-card::after,
    [data-tfg="on"] .solution-context-card::after,
    [data-tfg="on"] .solution-pillar-card::after,
    [data-tfg="on"] .solution-related-card::after {
        content: "";
        position: absolute;
        inset: calc(var(--tfg-border-hairline) * -1);
        z-index: 0;
        pointer-events: none;
        border-radius: inherit;
        opacity: 0;
        background: radial-gradient(circle at 50% 0%, var(--tfg-glow-warm-soft, transparent), transparent 60%);
        transition: opacity var(--tfg-duration-fast) var(--tfg-ease-standard);
    }

    [data-tfg="on"] .solution-signal-card:hover::after,
    [data-tfg="on"] .solution-signal-card:focus-within::after,
    [data-tfg="on"] .solution-context-card:hover::after,
    [data-tfg="on"] .solution-context-card:focus-within::after,
    [data-tfg="on"] .solution-pillar-card:hover::after,
    [data-tfg="on"] .solution-pillar-card:focus-within::after,
    [data-tfg="on"] .solution-related-card:hover::after,
    [data-tfg="on"] .solution-related-card:focus-within::after {
        opacity: 1;
    }

    /* ── 11. Duyarlı düzen ──────────────────────────────────────────── */
    @media (max-width: 64rem) {
        /* Mobil/tablet hero tek sütuna iner. CLS-rezervleri masaüstü-yükseklik
           ölçeğinde (özellikle actions = 26.25rem ≈ 420px, brief-metrikli NON-lean
           layout için hesaplanmış); lean hero'da (2 buton ≈ 7rem) ~280px ölü
           boşluk yaratıyordu. Tek-sütun akışta yükseklik içerikten gelmeli → auto.
           (Patron 2026-06-19 mobil hero düzeltmesi: yazı↔CTA aşırı boşluk.) */
        [data-tfg="on"] .solution-detail-page,
        [data-tfg="on"] .content-page.solution-detail-page {
            --tfg-solution-hero-action-stack-reserve: auto;
            --tfg-solution-hero-description-reserve: auto;
            --tfg-solution-hero-title-reserve: auto;
        }

        [data-tfg="on"] .content-page.solution-detail-page .content-page__hero .tfg-section-header__actions,
        [data-tfg="on"] .content-page__layout:has(.solution-sidebar) {
            grid-template-columns: 1fr;
        }

        [data-tfg="on"] .content-page__layout:has(.solution-sidebar) .content-page__sidebar {
            position: static;
        }

        [data-tfg="on"] .solution-hero-action-stack,
        [data-tfg="on"] .solution-hero-visual {
            inline-size: 100%;
        }

        /* Tek-sütun hero: infografik çerçeveyi sayfaya ortala. RouteCore mobil
           blokta aside'ı justify-items:start yapıyor (sola yaslı); solution-detail
           için ortala. (Patron 2026-06-19: "resim sayfaya ortalanmıyor".) */
        [data-tfg="on"] .content-page.solution-detail-page .content-page__hero-aside,
        [data-tfg="on"] .solution-hero-visual {
            justify-items: center;
        }

        [data-tfg="on"] .solution-hero-cta-row {
            display: grid;
            grid-template-columns: 1fr;
        }

        [data-tfg="on"] .solution-hero-primary-cta,
        [data-tfg="on"] .solution-hero-related-cta {
            inline-size: 100%;
            min-inline-size: 0;
            min-block-size: var(--tfg-touch-min-height);
        }

        [data-tfg="on"] .solution-hero-visual__frame {
            max-inline-size: min(100%, var(--tfg-hero-visual-size-compact));
        }
    }

    @media (max-width: 48rem) {
        [data-tfg="on"] .solution-hero-brief {
            padding: var(--tfg-space-3);
        }

        [data-tfg="on"] .solution-hero-brief__metrics {
            grid-template-columns: 1fr;
            gap: var(--tfg-space-2);
        }

        [data-tfg="on"] .solution-hero-brief__metric {
            gap: var(--tfg-space-1);
            min-block-size: var(--tfg-metric-cell-min-height-compact);
            padding: var(--tfg-space-3);
        }

        [data-tfg="on"] .solution-hero-brief__metric-value {
            font-size: var(--tfg-font-size-2xl, var(--tfg-font-size-xl));
        }

        [data-tfg="on"] .solution-hero-brief__metric-label {
            font-size: var(--tfg-font-size-xs);
            letter-spacing: var(--tfg-chip-heading-tracking);
        }

        [data-tfg="on"] .solution-overview-panel,
        [data-tfg="on"] .solution-cta-panel {
            padding: var(--tfg-space-4);
        }
    }

    /* Phone-only (≤30rem): proof-deck table → stacked labeled rows (Patron 2026-06-19:
       "içerik tam görünmüyor"). A 3-column data table can't compress below ~377px, so
       on phones the overflow-x:auto frame clipped the Evidence column. ≥30rem keeps the
       elegant 3-column table (it fits). data-label (already on each <td>) carries the
       header per cell; thead is sr-only, not display:none, so column headers stay in
       the a11y tree. */
    @media (max-width: 30rem) {
        [data-tfg="on"] .solution-proof-table-frame {
            overflow-x: visible;
        }

        [data-tfg="on"] .solution-proof-table {
            min-width: 0;
        }

        [data-tfg="on"] .solution-proof-table thead {
            /* sr-only (px-free: 0 + clip keeps the column headers in the a11y tree). */
            position: absolute;
            inline-size: 0;
            block-size: 0;
            overflow: hidden;
            clip-path: inset(50%);
            white-space: nowrap;
        }

        [data-tfg="on"] .solution-proof-table tr {
            display: grid;
            gap: var(--tfg-space-1);
            padding-block: var(--tfg-space-3);
        }

        [data-tfg="on"] .solution-proof-table tr + tr {
            border-block-start: var(--tfg-panel-border);
        }

        [data-tfg="on"] .solution-proof-table th,
        [data-tfg="on"] .solution-proof-table td {
            padding-inline: var(--tfg-space-0);
            padding-block: var(--tfg-space-1);
            border-block-start: 0;
        }

        [data-tfg="on"] .solution-proof-cadence::before,
        [data-tfg="on"] .solution-proof-evidence::before {
            content: attr(data-label);
            display: block;
            color: var(--tfg-text-headline);
            font-size: var(--tfg-font-size-caption);
            font-weight: var(--tfg-font-weight-semibold);
            letter-spacing: var(--tfg-letter-spacing-wide, 0.04em);
        }
    }

}

/* Katman dışı bilinçli: programatik H1 odağında global focus reset'ini ezer. */
[data-tfg="on"] .content-page.solution-detail-page .content-page__hero .tfg-section-header__title:focus-visible {
    outline: 0;
    outline-offset: 0;
}