/*
 * Fiberport Paket 02.12 — Bilgi Merkezi yazı detay sayfası
 * Scope: yalnız .fp-article-detail
 */

.fp-article-detail {
    --article-navy:#0b2239;
    --article-blue:#075f96;
    --article-cyan:#37a7df;
    --article-ink:#172839;
    --article-text:#52677a;
    --article-muted:#718292;
    --article-line:#d5e0e7;
    --article-soft:#f3f7f9;
    --article-white:#fff;
    color:var(--article-ink);
    background:#fff;
}

.fp-article-detail *,
.fp-article-detail *::before,
.fp-article-detail *::after {
    box-sizing:border-box;
}

.fp-article-hero {
    padding:30px 0 74px;
    background:#f4f7f9;
    border-bottom:1px solid var(--article-line);
}

.fp-article-breadcrumbs {
    margin-bottom:48px;
}

.fp-article-breadcrumbs ol {
    color:#6d7f8f;
}

.fp-article-breadcrumbs a {
    color:#536a7d;
}

.fp-article-breadcrumbs a:hover,
.fp-article-breadcrumbs a:focus-visible {
    color:var(--article-blue);
}

.fp-article-hero-grid {
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(300px,.43fr);
    gap:clamp(48px,8vw,106px);
    align-items:center;
}

.fp-article-kicker {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    align-items:center;
    margin-bottom:20px;
    color:var(--article-muted);
    font-size:.74rem;
    font-weight:800;
    letter-spacing:.07em;
    text-transform:uppercase;
}

.fp-article-kicker a {
    color:var(--article-blue);
    text-decoration:none;
}

.fp-article-kicker a:hover,
.fp-article-kicker a:focus-visible {
    text-decoration:underline;
    text-underline-offset:4px;
}

.fp-article-hero h1 {
    max-width:850px;
    margin:0;
    color:var(--article-navy);
    font-family:"Segoe UI","Helvetica Neue",Arial,sans-serif;
    font-size:clamp(2.45rem,5vw,4.85rem);
    font-weight:650;
    letter-spacing:-.04em;
    line-height:1.04;
}

.fp-article-deck {
    max-width:760px;
    margin:24px 0 0;
    color:var(--article-text);
    font-size:clamp(1rem,1.35vw,1.2rem);
    line-height:1.66;
}

.fp-article-meta {
    display:flex;
    flex-wrap:wrap;
    gap:0;
    margin:31px 0 0;
    padding:0;
    border-top:1px solid #cdd9e1;
    border-bottom:1px solid #cdd9e1;
}

.fp-article-meta > div {
    min-width:150px;
    padding:14px 22px 14px 0;
    margin-right:22px;
}

.fp-article-meta dt {
    margin:0 0 5px;
    color:var(--article-muted);
    font-size:.67rem;
    font-weight:800;
    letter-spacing:.06em;
    text-transform:uppercase;
}

.fp-article-meta dd {
    margin:0;
    color:var(--article-navy);
    font-size:.84rem;
    font-weight:700;
}

.fp-article-hero-media {
    min-width:0;
}

.fp-article-cover {
    display:block;
    width:100%;
    height:auto;
    max-height:470px;
    object-fit:cover;
    border:1px solid var(--article-line);
}

.fp-article-identity {
    position:relative;
    display:flex;
    min-height:370px;
    flex-direction:column;
    justify-content:flex-end;
    overflow:hidden;
    padding:34px;
    color:#fff;
    background:var(--article-navy);
    border-left:5px solid var(--article-cyan);
}

.fp-article-identity::before,
.fp-article-identity::after {
    position:absolute;
    content:"";
    border:1px solid rgba(255,255,255,.16);
    border-radius:50%;
}

.fp-article-identity::before {
    width:280px;
    height:280px;
    top:-96px;
    right:-80px;
}

.fp-article-identity::after {
    width:180px;
    height:180px;
    top:-46px;
    right:-30px;
}

.fp-article-identity span {
    position:relative;
    z-index:1;
    margin-bottom:16px;
    color:#a8dcf7;
    font-size:.7rem;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.fp-article-identity strong {
    position:relative;
    z-index:1;
    max-width:330px;
    font-size:clamp(1.6rem,3vw,2.65rem);
    font-weight:620;
    letter-spacing:-.025em;
    line-height:1.12;
}

.fp-article-identity i {
    position:absolute;
    left:34px;
    top:34px;
    width:56px;
    height:4px;
    background:var(--article-cyan);
}

.fp-article-layout {
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(260px,320px);
    gap:clamp(54px,8vw,112px);
    align-items:start;
    padding-top:clamp(64px,8vw,106px);
    padding-bottom:clamp(72px,9vw,122px);
}

.fp-article-main {
    min-width:0;
}

.fp-article-reading-line {
    display:flex;
    gap:14px;
    align-items:center;
    margin-bottom:30px;
    color:var(--article-blue);
    font-size:.7rem;
    font-weight:800;
    letter-spacing:.08em;
    text-transform:uppercase;
}

.fp-article-reading-line i {
    display:block;
    width:100%;
    height:1px;
    background:var(--article-line);
}

.fp-article-prose {
    max-width:780px;
    color:#344b5f;
    font-size:1.03rem;
    line-height:1.82;
}

.fp-article-prose > :first-child {
    margin-top:0;
}

.fp-article-prose > p:first-child {
    color:var(--article-ink);
    font-size:1.15rem;
    line-height:1.75;
}

.fp-article-prose h2 {
    scroll-margin-top:150px;
    margin:58px 0 19px;
    padding-top:4px;
    color:var(--article-navy);
    font-family:"Segoe UI","Helvetica Neue",Arial,sans-serif;
    font-size:clamp(1.55rem,2.45vw,2.25rem);
    font-weight:650;
    letter-spacing:-.025em;
    line-height:1.2;
}

.fp-article-prose h2::before {
    display:block;
    width:34px;
    height:3px;
    margin-bottom:17px;
    content:"";
    background:var(--article-blue);
}

.fp-article-prose h3 {
    scroll-margin-top:150px;
    margin:34px 0 13px;
    color:var(--article-navy);
    font-size:1.18rem;
    line-height:1.35;
}

.fp-article-prose p {
    margin:0 0 21px;
}

.fp-article-prose a,
.fp-article-prose a:visited {
    color:var(--article-blue);
    font-weight:650;
    text-decoration:underline;
    text-decoration-thickness:1px;
    text-underline-offset:3px;
}

.fp-article-prose a:hover,
.fp-article-prose a:focus-visible {
    color:var(--article-navy);
    text-decoration-thickness:2px;
}

.fp-article-prose ul,
.fp-article-prose ol {
    margin:22px 0 30px;
    padding:0;
    list-style:none;
    counter-reset:article-list;
}

.fp-article-prose li {
    position:relative;
    margin:0;
    padding:13px 0 13px 35px;
    border-bottom:1px solid #e0e7ec;
    line-height:1.62;
}

.fp-article-prose ul li::before {
    position:absolute;
    left:5px;
    top:24px;
    width:8px;
    height:8px;
    content:"";
    background:var(--article-blue);
    border-radius:50%;
}

.fp-article-prose ol li {
    counter-increment:article-list;
}

.fp-article-prose ol li::before {
    position:absolute;
    left:0;
    top:15px;
    content:counter(article-list,decimal-leading-zero);
    color:var(--article-blue);
    font-size:.68rem;
    font-weight:800;
    letter-spacing:.04em;
}

.fp-article-prose blockquote {
    margin:38px 0;
    padding:25px 28px;
    color:#294459;
    background:var(--article-soft);
    border:0;
    border-left:4px solid var(--article-blue);
}

.fp-article-prose blockquote p {
    margin:0;
    font-size:.94rem;
    line-height:1.7;
}

.fp-article-prose table {
    display:block;
    width:100%;
    margin:32px 0;
    overflow-x:auto;
    border-collapse:collapse;
}

.fp-article-prose th,
.fp-article-prose td {
    min-width:150px;
    padding:13px 15px;
    text-align:left;
    border:1px solid var(--article-line);
}

.fp-article-prose th {
    color:#fff;
    background:var(--article-navy);
}

.fp-article-prose .seo-inline-cta {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:24px;
    align-items:center;
    margin:44px 0 8px;
    padding:26px 28px;
    color:#fff;
    background:var(--article-navy);
    border-left:4px solid var(--article-cyan);
}

.fp-article-prose .seo-inline-cta strong {
    font-size:1rem;
    line-height:1.55;
}

.fp-article-prose .seo-inline-cta a,
.fp-article-prose .seo-inline-cta a:visited {
    display:inline-flex;
    min-height:42px;
    align-items:center;
    justify-content:center;
    padding:0 15px;
    color:var(--article-navy);
    background:#fff;
    border:1px solid #fff;
    border-radius:4px;
    font-size:.78rem;
    font-weight:800;
    text-decoration:none;
    white-space:nowrap;
}

.fp-article-prose .seo-inline-cta a:hover,
.fp-article-prose .seo-inline-cta a:focus-visible {
    color:#fff;
    background:var(--article-blue);
    border-color:var(--article-blue);
}

.fp-article-sidebar {
    position:sticky;
    top:132px;
    display:grid;
    gap:20px;
}

.fp-article-toc,
.fp-article-info {
    padding:26px;
    background:#fff;
    border:1px solid var(--article-line);
}

.fp-article-toc {
    border-top:4px solid var(--article-blue);
}

.fp-article-toc > span,
.fp-article-info > span {
    display:block;
    margin-bottom:10px;
    color:var(--article-blue);
    font-size:.67rem;
    font-weight:800;
    letter-spacing:.07em;
    text-transform:uppercase;
}

.fp-article-toc h2 {
    margin:0 0 17px;
    color:var(--article-navy);
    font-size:1rem;
}

.fp-article-toc ol {
    margin:0;
    padding:0;
    list-style:none;
}

.fp-article-toc li {
    border-top:1px solid #e1e8ed;
}

.fp-article-toc li.toc-level-3 {
    padding-left:14px;
}

.fp-article-toc a {
    display:block;
    padding:10px 0;
    color:#53697b;
    font-size:.78rem;
    line-height:1.4;
    text-decoration:none;
}

.fp-article-toc a:hover,
.fp-article-toc a:focus-visible,
.fp-article-toc a.is-active {
    color:var(--article-blue);
}

.fp-article-info {
    background:var(--article-soft);
}

.fp-article-info dl {
    margin:0;
}

.fp-article-info dl > div {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:16px;
    padding:11px 0;
    border-bottom:1px solid var(--article-line);
}

.fp-article-info dt {
    color:var(--article-muted);
    font-size:.72rem;
}

.fp-article-info dd {
    margin:0;
    color:var(--article-navy);
    font-size:.75rem;
    font-weight:700;
    text-align:right;
}

.fp-article-info-links {
    display:flex;
    flex-wrap:wrap;
    gap:7px;
    margin-top:20px;
}

.fp-article-info-links strong {
    width:100%;
    color:var(--article-muted);
    font-size:.69rem;
    text-transform:uppercase;
}

.fp-article-info-links a {
    padding:6px 8px;
    color:var(--article-blue);
    background:#fff;
    border:1px solid var(--article-line);
    border-radius:3px;
    font-size:.69rem;
    font-weight:700;
    text-decoration:none;
}

.fp-article-back {
    display:inline-flex;
    align-items:center;
    gap:8px;
    margin-top:20px;
    color:var(--article-navy);
    font-size:.76rem;
    font-weight:800;
    text-decoration:none;
}

.fp-article-back:hover,
.fp-article-back:focus-visible {
    color:var(--article-blue);
}

.fp-article-inline-icon {
    width:16px;
    height:16px;
}

.fp-article-tags {
    display:grid;
    grid-template-columns:auto minmax(0,1fr);
    gap:18px;
    align-items:start;
    margin-top:52px;
    padding-top:22px;
    border-top:1px solid var(--article-line);
}

.fp-article-tags > strong {
    color:var(--article-muted);
    font-size:.7rem;
    letter-spacing:.05em;
    text-transform:uppercase;
}

.fp-article-tags > div {
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}

.fp-article-tags a {
    color:var(--article-blue);
    font-size:.75rem;
    font-weight:700;
    text-decoration:none;
}

.fp-article-tags a:hover,
.fp-article-tags a:focus-visible {
    text-decoration:underline;
    text-underline-offset:3px;
}

.fp-article-related {
    margin-top:76px;
}

.fp-article-related header {
    max-width:760px;
    margin-bottom:28px;
}

.fp-article-eyebrow {
    display:inline-flex;
    align-items:center;
    gap:9px;
    margin-bottom:14px;
    color:var(--article-blue);
    font-size:.7rem;
    font-weight:800;
    letter-spacing:.07em;
    text-transform:uppercase;
}

.fp-article-eyebrow::before {
    width:22px;
    height:2px;
    content:"";
    background:currentColor;
}

.fp-article-related header h2 {
    margin:0;
    color:var(--article-navy);
    font-size:clamp(1.7rem,2.8vw,2.55rem);
    font-weight:650;
    letter-spacing:-.025em;
    line-height:1.14;
}

.fp-article-related ol {
    margin:0;
    padding:0;
    border-top:2px solid var(--article-navy);
    list-style:none;
}

.fp-article-related li {
    display:grid;
    grid-template-columns:46px minmax(0,1fr);
    gap:20px;
    padding:27px 0;
    border-bottom:1px solid var(--article-line);
}

.fp-article-related li:has(.fp-article-related-media) {
    grid-template-columns:46px minmax(130px,190px) minmax(0,1fr);
}

.fp-article-related-number {
    color:var(--article-blue);
    font-size:.7rem;
    font-weight:800;
    letter-spacing:.06em;
}

.fp-article-related-media {
    display:block;
    overflow:hidden;
    background:var(--article-soft);
}

.fp-article-related-image {
    display:block;
    width:100%;
    height:100%;
    min-height:118px;
    object-fit:cover;
}

.fp-article-related-copy small {
    color:var(--article-blue);
    font-size:.66rem;
    font-weight:800;
    letter-spacing:.06em;
    text-transform:uppercase;
}

.fp-article-related-copy h3 {
    margin:8px 0 0;
    font-size:1.15rem;
    line-height:1.35;
}

.fp-article-related-copy h3 a {
    color:var(--article-navy);
    text-decoration:none;
}

.fp-article-related-copy h3 a:hover,
.fp-article-related-copy h3 a:focus-visible {
    color:var(--article-blue);
}

.fp-article-related-copy p {
    margin:11px 0 15px;
    color:var(--article-text);
    font-size:.86rem;
    line-height:1.58;
}

.fp-article-related-action {
    display:inline-flex;
    align-items:center;
    gap:7px;
    color:var(--article-blue);
    font-size:.74rem;
    font-weight:800;
    text-decoration:none;
}

.fp-article-footer {
    padding:clamp(68px,8vw,104px) 0;
    background:#f4f7f9;
    border-top:1px solid var(--article-line);
}

.fp-article-footer-inner {
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    gap:48px;
    align-items:center;
    padding:clamp(34px,5vw,56px);
    color:#fff;
    background:var(--article-navy);
    border-left:5px solid var(--article-cyan);
}

.fp-article-footer-inner > div:first-child > span {
    display:block;
    margin-bottom:12px;
    color:#a8dcf7;
    font-size:.7rem;
    font-weight:800;
    letter-spacing:.07em;
    text-transform:uppercase;
}

.fp-article-footer h2 {
    max-width:790px;
    margin:0;
    color:#fff;
    font-size:clamp(1.75rem,3vw,2.8rem);
    font-weight:650;
    letter-spacing:-.025em;
    line-height:1.12;
}

.fp-article-footer p {
    max-width:720px;
    margin:14px 0 0;
    color:rgba(255,255,255,.74);
    line-height:1.6;
}

.fp-article-footer-actions {
    display:flex;
    flex-direction:column;
    gap:10px;
}

.fp-article-footer-actions a {
    display:inline-flex;
    min-width:190px;
    min-height:44px;
    align-items:center;
    justify-content:center;
    padding:0 17px;
    border-radius:4px;
    font-size:.78rem;
    font-weight:800;
    text-decoration:none;
}

.fp-article-footer-actions a:first-child,
.fp-article-footer-actions a:first-child:visited {
    color:var(--article-navy);
    background:#fff;
    border:1px solid #fff;
}

.fp-article-footer-actions a:last-child,
.fp-article-footer-actions a:last-child:visited {
    color:#fff;
    background:transparent;
    border:1px solid rgba(255,255,255,.55);
}

.fp-article-footer-actions a:hover,
.fp-article-footer-actions a:focus-visible {
    color:#fff;
    background:var(--article-blue);
    border-color:var(--article-blue);
}

@media (max-width:1000px) {
    .fp-article-hero-grid,
    .fp-article-layout {
        grid-template-columns:1fr;
    }

    .fp-article-hero-media {
        max-width:620px;
    }

    .fp-article-layout {
        gap:56px;
    }

    .fp-article-sidebar {
        position:static;
        grid-template-columns:repeat(2,minmax(0,1fr));
        order:-1;
    }

    .fp-article-prose {
        max-width:none;
    }
}

@media (max-width:760px) {
    .fp-article-hero {
        padding:22px 0 52px;
    }

    .fp-article-breadcrumbs {
        margin-bottom:34px;
    }

    .fp-article-hero h1 {
        font-size:clamp(2.05rem,11vw,3.3rem);
    }

    .fp-article-deck {
        font-size:1rem;
    }

    .fp-article-meta {
        display:grid;
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .fp-article-meta > div {
        min-width:0;
        margin:0;
        padding:13px 10px 13px 0;
    }

    .fp-article-identity {
        min-height:280px;
        padding:26px;
    }

    .fp-article-layout {
        width:min(100% - 32px,1160px);
        padding-top:52px;
        padding-bottom:70px;
    }

    .fp-article-sidebar {
        grid-template-columns:1fr;
        order:-1;
    }

    .fp-article-toc {
        order:-1;
    }

    .fp-article-info {
        display:none;
    }

    .fp-article-prose {
        font-size:.98rem;
        line-height:1.76;
    }

    .fp-article-prose > p:first-child {
        font-size:1.07rem;
    }

    .fp-article-prose h2 {
        margin-top:48px;
        font-size:1.65rem;
    }

    .fp-article-prose .seo-inline-cta {
        grid-template-columns:1fr;
        padding:23px;
    }

    .fp-article-prose .seo-inline-cta a {
        width:100%;
        white-space:normal;
        text-align:center;
    }

    .fp-article-tags {
        grid-template-columns:1fr;
        gap:10px;
    }

    .fp-article-related {
        margin-top:58px;
    }

    .fp-article-related li,
    .fp-article-related li:has(.fp-article-related-media) {
        grid-template-columns:34px minmax(0,1fr);
    }

    .fp-article-related-media {
        display:none;
    }

    .fp-article-footer-inner {
        grid-template-columns:1fr;
        padding:30px 24px;
    }

    .fp-article-footer-actions a {
        width:100%;
        min-width:0;
    }
}