/* CadetPro Forum — "Cockpit / Aviation Editorial" redesign.
   Tüm sınıflar .cpf altında scope'lu ve cpf- ön ekli → platform CSS'iyle çakışmaz.
   Renkler markayla uyumlu (navy #0E2145 / blue #0170FF / green #3FCD82 / amber #F4A93C). */
.cpf{
  --ink:#0A1730; --navy:#0E2145; --navy-2:#13294f; --navy-line:rgba(255,255,255,.10);
  --blue:#0170FF; --blue-soft:#2E8BFF;
  --green:#3FCD82; --green-deep:#2BB069;
  --amber:#F4A93C;
  --paper:#F4F7FC; --paper-2:#EAF0FA; --card:#FFFFFF;
  --ink-text:#101D38; --muted:#5E6E89; --muted-2:#8A99B5; --hair:#E6ECF6;
  --fdisplay:'Space Grotesk',system-ui,sans-serif;
  --fbody:'Plus Jakarta Sans',system-ui,sans-serif;
  --ease:cubic-bezier(.4,0,.2,1);
  --shadow-sm:0 2px 8px rgba(16,29,56,.06);
  --shadow:0 18px 50px -24px rgba(16,29,56,.35);
  --r:18px; --r-lg:28px; --r-xl:36px;
  font-family:var(--fbody);color:var(--ink-text);background:var(--paper);line-height:1.6;
}
.cpf *{box-sizing:border-box}
.cpf h1,.cpf h2,.cpf h3,.cpf h4{font-family:var(--fdisplay);margin:0;line-height:1.08;letter-spacing:-.02em}
.cpf a{text-decoration:none;color:inherit}
.cpf img,.cpf svg{display:block;max-width:100%}
.cpf-wrap{max-width:1200px;margin:0 auto;padding:0 24px}
.cpf-eyebrow{font-family:var(--fdisplay);font-size:13px;font-weight:600;letter-spacing:.16em;text-transform:uppercase}

/* ===== HERO ===== */
.cpf-hero{position:relative;background:radial-gradient(120% 120% at 80% -10%,#16305f 0%,var(--navy) 42%,var(--ink) 100%);color:#fff;overflow:hidden;padding:72px 0 0}
.cpf-hero__grid{position:absolute;inset:0;background-image:linear-gradient(var(--navy-line) 1px,transparent 1px),linear-gradient(90deg,var(--navy-line) 1px,transparent 1px);background-size:54px 54px;-webkit-mask-image:radial-gradient(120% 90% at 70% 0%,#000 35%,transparent 78%);mask-image:radial-gradient(120% 90% at 70% 0%,#000 35%,transparent 78%);opacity:.7}
.cpf-glow{position:absolute;border-radius:50%;filter:blur(120px);z-index:0}
.cpf-glow.g1{top:-160px;right:-80px;width:560px;height:560px;background:rgba(1,112,255,.30)}
.cpf-glow.g2{bottom:-260px;left:-120px;width:520px;height:520px;background:rgba(63,205,130,.16)}
.cpf-horizon{position:absolute;left:0;right:0;bottom:60px;height:1px;background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent)}
.cpf-hero .cpf-grid2{position:relative;z-index:2;display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center;padding-bottom:96px}
.cpf-hbadge{display:inline-flex;align-items:center;gap:9px;border:1px solid rgba(63,205,130,.4);background:rgba(63,205,130,.10);color:#bdf3d4;padding:8px 15px;border-radius:999px;font-size:12.5px;font-weight:600;letter-spacing:.04em}
.cpf-hbadge .b{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px rgba(63,205,130,.25)}
.cpf-hero h1{font-size:clamp(38px,5.4vw,66px);font-weight:700;margin:22px 0 0}
.cpf-hero h1 .ln{display:block}
.cpf-hero h1 .grad{background:linear-gradient(100deg,#fff 0%,#8FC2FF 55%,var(--green) 120%);-webkit-background-clip:text;background-clip:text;color:transparent}
.cpf-lede{margin:20px 0 0;font-size:18px;line-height:1.6;color:#c2cee6;max-width:32em}
.cpf-search{margin-top:26px;display:flex;align-items:center;gap:8px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.16);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:16px;padding:8px 8px 8px 18px;max-width:540px}
.cpf-search svg{flex:0 0 auto;opacity:.7}
.cpf-search input{flex:1;background:transparent;border:0;outline:0;color:#fff;font-family:var(--fbody);font-size:15.5px;padding:10px 4px;min-width:0}
.cpf-search input::placeholder{color:#9fb0cf}
.cpf-search .go{background:var(--green);color:#06301c;font-weight:700;border:0;border-radius:11px;padding:12px 20px;font-size:14.5px;font-family:var(--fbody);cursor:pointer;transition:.25s var(--ease);white-space:nowrap}
.cpf-search .go:hover{background:#53dd93;transform:translateY(-1px)}
.cpf-hcta{margin-top:18px;display:flex;flex-wrap:wrap;gap:14px;align-items:center}
.cpf-btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--fbody);font-weight:600;font-size:15px;border-radius:13px;padding:14px 24px;cursor:pointer;transition:.28s var(--ease);border:1px solid transparent}
.cpf-btn--primary{background:var(--blue);color:#fff;box-shadow:0 16px 34px -14px rgba(1,112,255,.7)}
.cpf-btn--primary:hover{transform:translateY(-2px);box-shadow:0 22px 44px -14px rgba(1,112,255,.8);color:#fff}
.cpf-btn--ghost{background:transparent;border-color:rgba(255,255,255,.2);color:#dce6f7}
.cpf-btn--ghost:hover{background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.4);color:#fff}
.cpf-htrust{margin-top:30px;display:flex;align-items:center;gap:16px;color:#9fb0cf;font-size:13.5px}
.cpf-avstack{display:flex}
.cpf-avstack .a{width:38px;height:38px;border-radius:50%;border:2px solid var(--navy);margin-left:-12px;overflow:hidden}
.cpf-avstack .a:first-child{margin-left:0}
.cpf-avstack .a img{width:100%;height:100%;object-fit:cover}

/* instrument panel */
.cpf-panel{position:relative;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.02));border:1px solid rgba(255,255,255,.14);border-radius:26px;padding:22px;box-shadow:0 50px 100px -50px rgba(0,0,0,.7)}
.cpf-panel__head{display:flex;align-items:center;justify-content:space-between;color:#9fb0cf;font-size:12px;font-family:var(--fdisplay);letter-spacing:.12em;text-transform:uppercase}
.cpf-panel__head .live{display:inline-flex;align-items:center;gap:7px;color:var(--green)}
.cpf-panel__head .live b{width:7px;height:7px;border-radius:50%;background:var(--green);animation:cpfblink 2s var(--ease) infinite}
@keyframes cpfblink{0%,100%{opacity:1}50%{opacity:.35}}
.cpf-dials{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.cpf-dial{background:rgba(8,18,40,.55);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:16px}
.cpf-dial .k{font-family:var(--fdisplay);font-weight:700;font-size:30px;color:#fff;letter-spacing:-.02em}
.cpf-dial .l{font-size:12.5px;color:#9fb0cf;margin-top:3px}
.cpf-dial .spark{height:30px;margin-top:10px;display:flex;align-items:flex-end;gap:3px}
.cpf-dial .spark i{flex:1;background:linear-gradient(180deg,var(--blue-soft),rgba(46,139,255,.15));border-radius:2px;opacity:.85}
.cpf-feed{margin-top:14px;background:rgba(8,18,40,.5);border:1px solid rgba(255,255,255,.08);border-radius:16px;padding:6px}
.cpf-feedrow{display:flex;align-items:center;gap:11px;padding:9px 10px;border-radius:11px}
.cpf-feedrow+.cpf-feedrow{border-top:1px solid rgba(255,255,255,.06)}
.cpf-feedrow .ic{width:34px;height:34px;border-radius:9px;background:#fff;padding:4px;flex:0 0 auto}
.cpf-feedrow .tx{min-width:0}
.cpf-feedrow .tx b{display:block;color:#eaf1ff;font-size:13.5px;font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cpf-feedrow .tx span{color:#8497b8;font-size:12px}

/* ===== BOARD MARQUEE ===== */
.cpf-board{position:relative;z-index:3;background:var(--navy);border-top:1px solid var(--navy-line);border-bottom:1px solid var(--navy-line);overflow:hidden}
.cpf-board__track{display:flex;gap:40px;align-items:center;white-space:nowrap;padding:16px 0;animation:cpfscroll 40s linear infinite;width:max-content}
.cpf-board a{color:#cdd9ef;font-family:var(--fdisplay);font-weight:600;font-size:17px;display:inline-flex;align-items:center;gap:40px}
.cpf-board a:hover{color:var(--green)}
.cpf-board .sep{color:var(--amber);opacity:.8}
@keyframes cpfscroll{to{transform:translateX(-50%)}}

/* ===== STATS STRIP ===== */
.cpf-strip{margin-top:34px;background:var(--card);border:1px solid var(--hair);border-radius:var(--r-lg);box-shadow:var(--shadow-sm);display:grid;grid-template-columns:1.2fr 2fr;gap:8px;overflow:hidden}
.cpf-strip__users{padding:22px 24px;border-right:1px solid var(--hair)}
.cpf-strip__users .lbl{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:13px;font-weight:500}
.cpf-strip__users .row{display:flex;align-items:center;gap:10px;margin-top:14px}
.cpf-strip__users .a{width:42px;height:42px;border-radius:50%;overflow:hidden;border:2px solid #fff;box-shadow:var(--shadow-sm)}
.cpf-strip__users .a img{width:100%;height:100%;object-fit:cover}
.cpf-strip__nums{display:grid;grid-template-columns:repeat(4,1fr)}
.cpf-strip__nums .n{padding:22px 18px;text-align:center;border-left:1px solid var(--hair);display:flex;flex-direction:column;justify-content:center}
.cpf-strip__nums .n:first-child{border-left:0}
.cpf-strip__nums .n b{font-family:var(--fdisplay);font-weight:700;font-size:26px;color:var(--navy);letter-spacing:-.02em}
.cpf-strip__nums .n span{font-size:12.5px;color:var(--muted);margin-top:2px}
@media(max-width:760px){.cpf-strip{grid-template-columns:1fr}.cpf-strip__users{border-right:0;border-bottom:1px solid var(--hair)}.cpf-strip__nums{grid-template-columns:1fr 1fr}.cpf-strip__nums .n:nth-child(3){border-left:0}.cpf-strip__nums .n:nth-child(n+3){border-top:1px solid var(--hair)}}

/* ===== SECTION SHELL ===== */
.cpf-sec{padding:90px 0}
.cpf-sec--paper{background:var(--paper)}
.cpf-sec--white{background:#fff}
.cpf-sechead{max-width:700px}
.cpf-sechead.center{margin:0 auto;text-align:center}
.cpf-sechead .cpf-eyebrow{color:var(--blue)}
.cpf-sechead h2{font-size:clamp(27px,3.3vw,42px);font-weight:700;margin:12px 0 0;color:var(--ink-text)}
.cpf-sechead p{margin:14px 0 0;font-size:17px;color:var(--muted)}

/* ===== CATEGORY DIRECTORY ===== */
.cpf-cats{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin-top:46px}
.cpf-cat{position:relative;background:var(--card);border:1px solid var(--hair);border-radius:var(--r-lg);padding:26px;transition:.35s var(--ease);overflow:hidden}
.cpf-cat::before{content:"";position:absolute;inset:0;background:radial-gradient(120% 80% at 100% 0%,rgba(1,112,255,.06),transparent 60%);opacity:0;transition:.35s var(--ease)}
.cpf-cat:hover{transform:translateY(-4px);border-color:#cfe0f6;box-shadow:var(--shadow)}
.cpf-cat:hover::before{opacity:1}
.cpf-cat__top{display:flex;align-items:center;gap:16px;position:relative}
.cpf-cat__icon{width:62px;height:62px;border-radius:18px;background:var(--paper-2);padding:9px;flex:0 0 auto;object-fit:contain}
.cpf-cat__title{font-family:var(--fdisplay);font-weight:700;font-size:21px;color:var(--ink-text)}
.cpf-cat__desc{color:var(--muted);font-size:14.5px;margin-top:4px}
.cpf-cat__subs{margin-top:20px;display:flex;flex-direction:column;gap:2px;position:relative}
.cpf-sub{display:flex;align-items:center;gap:13px;padding:12px;border-radius:14px;transition:.2s var(--ease)}
.cpf-sub:hover{background:var(--paper)}
.cpf-sub__ic{width:38px;height:38px;border-radius:11px;background:var(--paper-2);padding:6px;flex:0 0 auto;object-fit:contain}
.cpf-sub__main{flex:1;min-width:0}
.cpf-sub__main b{font-weight:600;font-size:15px;color:var(--ink-text);display:block}
.cpf-sub__main span{font-size:12.5px;color:var(--muted-2);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cpf-sub__stat{display:flex;gap:16px;flex:0 0 auto}
.cpf-sub__stat div{text-align:center}
.cpf-sub__stat b{font-family:var(--fdisplay);font-weight:700;font-size:15px;color:var(--navy);display:block;line-height:1}
.cpf-sub__stat span{font-size:10.5px;color:var(--muted-2);text-transform:uppercase;letter-spacing:.05em}
.cpf-sub__go{width:30px;height:30px;border-radius:50%;border:1px solid var(--hair);display:flex;align-items:center;justify-content:center;color:var(--blue);flex:0 0 auto;transition:.2s var(--ease)}
.cpf-sub:hover .cpf-sub__go{background:var(--blue);color:#fff;border-color:var(--blue)}
@media(max-width:560px){.cpf-sub__stat{display:none}}

/* ===== FEATURED ===== */
.cpf-feat{display:grid;grid-template-columns:1.4fr 1fr;gap:22px;margin-top:46px;align-items:stretch}
.cpf-feat__big{position:relative;border-radius:var(--r-xl);overflow:hidden;color:#fff;background:linear-gradient(180deg,#16305f,var(--navy));border:1px solid var(--navy-line);padding:34px;display:flex;flex-direction:column;justify-content:space-between;min-height:360px}
.cpf-feat__big .grid{position:absolute;inset:0;background-image:linear-gradient(var(--navy-line) 1px,transparent 1px),linear-gradient(90deg,var(--navy-line) 1px,transparent 1px);background-size:42px 42px;opacity:.5;-webkit-mask-image:radial-gradient(120% 100% at 100% 0,#000,transparent 70%);mask-image:radial-gradient(120% 100% at 100% 0,#000,transparent 70%)}
.cpf-feat__big .tag{position:relative;align-self:flex-start;display:inline-flex;align-items:center;gap:8px;background:rgba(244,169,60,.16);border:1px solid rgba(244,169,60,.4);color:#ffd79a;padding:7px 14px;border-radius:999px;font-size:12px;font-weight:600;letter-spacing:.04em}
.cpf-feat__big h3{position:relative;font-size:26px;font-weight:700;margin:18px 0 0;max-width:14em;color:#fff}
.cpf-feat__big p{position:relative;color:#bccbe6;font-size:15px;margin:14px 0 0;max-width:34em}
.cpf-feat__big .meta{position:relative;display:flex;align-items:center;gap:14px;margin-top:24px}
.cpf-feat__big .ic{width:54px;height:54px;border-radius:15px;background:#fff;padding:8px;flex:0 0 auto}
.cpf-feat__big .av{display:flex;margin-bottom:8px}
.cpf-feat__big .av .a{width:30px;height:30px;border-radius:50%;border:2px solid var(--navy);margin-left:-9px;overflow:hidden}
.cpf-feat__big .av .a:first-child{margin-left:0}
.cpf-feat__big .av .a img{width:100%;height:100%;object-fit:cover}
.cpf-feat__col{display:flex;flex-direction:column;gap:22px}
.cpf-fcard{flex:1;background:var(--card);border:1px solid var(--hair);border-radius:var(--r-lg);padding:22px;transition:.3s var(--ease);display:flex;gap:16px;align-items:flex-start}
.cpf-fcard:hover{transform:translateY(-3px);box-shadow:var(--shadow);border-color:#cfe0f6}
.cpf-fcard .ic{width:50px;height:50px;border-radius:14px;background:var(--paper-2);padding:8px;flex:0 0 auto;object-fit:contain}
.cpf-fcard h4{font-family:var(--fdisplay);font-weight:600;font-size:16px;color:var(--ink-text);line-height:1.28}
.cpf-fcard p{color:var(--muted);font-size:13.5px;margin:7px 0 0}
.cpf-fcard .row{display:flex;align-items:center;gap:12px;margin-top:13px;color:var(--muted-2);font-size:12.5px;font-weight:500}
.cpf-chip{display:inline-flex;align-items:center;gap:6px;color:var(--green-deep);background:rgba(63,205,130,.12);padding:3px 9px;border-radius:999px;font-weight:600}

/* ===== RECOMMENDED RAILS ===== */
.cpf-rails{display:grid;grid-template-columns:repeat(4,1fr);gap:20px;margin-top:46px}
.cpf-rail{background:var(--card);border:1px solid var(--hair);border-radius:var(--r-lg);padding:22px;transition:.3s var(--ease)}
.cpf-rail:hover{box-shadow:var(--shadow);transform:translateY(-3px)}
.cpf-rail__ic{width:58px;height:58px;border-radius:16px;background:var(--paper-2);padding:9px;margin-bottom:14px;object-fit:contain}
.cpf-rail h4{font-family:var(--fdisplay);font-weight:700;font-size:17px;color:var(--ink-text)}
.cpf-rail .sub{font-size:13px;color:var(--muted);margin-top:5px;display:block}
.cpf-rail ul{list-style:none;margin:16px 0 0;padding:14px 0 0;border-top:1px solid var(--hair);display:flex;flex-direction:column;gap:11px}
.cpf-rail li a{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--ink-text);font-weight:500;transition:.2s var(--ease)}
.cpf-rail li a:hover{color:var(--blue)}
.cpf-rail li .dot{width:20px;height:20px;border-radius:50%;border:1px solid var(--hair);display:flex;align-items:center;justify-content:center;color:var(--blue);flex:0 0 auto;font-size:11px}
@media(max-width:980px){.cpf-rails{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.cpf-rails{grid-template-columns:1fr}}

/* ===== FAQ ===== */
.cpf-faqwrap{max-width:840px;margin:42px auto 0}
.cpf-faq{background:var(--card);border:1px solid var(--hair);border-radius:var(--r);margin-bottom:12px;overflow:hidden;transition:.25s var(--ease)}
.cpf-faq[open]{border-color:#cfe0f6;box-shadow:var(--shadow-sm)}
.cpf-faq summary{list-style:none;cursor:pointer;padding:20px 22px;display:flex;align-items:center;justify-content:space-between;gap:16px;font-family:var(--fdisplay);font-weight:600;font-size:16.5px;color:var(--ink-text)}
.cpf-faq summary::-webkit-details-marker{display:none}
.cpf-faq summary .x{width:30px;height:30px;border-radius:9px;background:var(--paper-2);display:flex;align-items:center;justify-content:center;color:var(--blue);flex:0 0 auto;transition:.3s var(--ease);font-size:18px;line-height:1}
.cpf-faq[open] summary .x{transform:rotate(45deg);background:var(--blue);color:#fff}
.cpf-faq .body{padding:0 22px 22px;color:var(--muted);font-size:15px}

/* ===== FINAL CTA ===== */
.cpf-finalcta{position:relative;overflow:hidden;background:radial-gradient(120% 130% at 15% 0%,#16305f,var(--navy) 50%,var(--ink));color:#fff;border-radius:var(--r-xl);padding:64px 56px;display:grid;grid-template-columns:1.3fr .7fr;gap:30px;align-items:center}
.cpf-finalcta .grid{position:absolute;inset:0;background-image:linear-gradient(var(--navy-line) 1px,transparent 1px),linear-gradient(90deg,var(--navy-line) 1px,transparent 1px);background-size:48px 48px;opacity:.6;-webkit-mask-image:radial-gradient(120% 100% at 0 0,#000,transparent 72%);mask-image:radial-gradient(120% 100% at 0 0,#000,transparent 72%)}
.cpf-finalcta .glow{position:absolute;width:480px;height:480px;border-radius:50%;filter:blur(120px);background:rgba(63,205,130,.18);right:-120px;bottom:-200px}
.cpf-finalcta__c{position:relative}
.cpf-finalcta .cpf-eyebrow{color:var(--green)}
.cpf-finalcta h2{position:relative;font-size:clamp(28px,3.6vw,46px);font-weight:700;margin:12px 0 0;color:#fff}
.cpf-finalcta p{position:relative;color:#c2cee6;font-size:17px;margin:16px 0 0;max-width:30em}
.cpf-finalcta__a{position:relative;display:flex;flex-direction:column;gap:14px}
.cpf-btn--xl{padding:18px 30px;font-size:16.5px;border-radius:15px;justify-content:center}
.cpf-btn--green{background:var(--green);color:#06301c;box-shadow:0 18px 40px -16px rgba(63,205,130,.7)}
.cpf-btn--green:hover{background:#53dd93;transform:translateY(-2px);color:#06301c}
.cpf-btn--outline{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.22);color:#fff}
.cpf-btn--outline:hover{background:rgba(255,255,255,.12);color:#fff}

/* ===== reveal ===== */
.cpf-reveal{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
.cpf-reveal.in{opacity:1;transform:none}
.cpf [data-cpf-stagger]>*{opacity:0;transform:translateY(20px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.cpf [data-cpf-stagger].in>*{opacity:1;transform:none}
.cpf-load{opacity:0;transform:translateY(22px);animation:cpfin .8s var(--ease) forwards}
@keyframes cpfin{to{opacity:1;transform:none}}

@media(max-width:980px){
  .cpf-hero .cpf-grid2{grid-template-columns:1fr;padding-bottom:72px}
  .cpf-panel{display:none}
  .cpf-cats{grid-template-columns:1fr}
  .cpf-feat{grid-template-columns:1fr}
  .cpf-finalcta{grid-template-columns:1fr;padding:48px 30px;border-radius:var(--r-lg)}
}
@media(prefers-reduced-motion:reduce){
  .cpf *{animation:none!important;transition:none!important}
  .cpf-reveal,.cpf [data-cpf-stagger]>*{opacity:1;transform:none}
  .cpf-board__track{animation:none}
  .cpf-load{opacity:1;transform:none;animation:none}
}

/* =====================================================================
   TOPIC CARD (cpft-) — SELF-CONTAINED: works on any page that loads this
   CSS, regardless of a .cpf wrapper (used on topics list, search, profile).
   ===================================================================== */
.cpft-card{--blue:#0170FF;--navy:#101D38;--muted:#5E6E89;--muted-2:#8A99B5;--hair:#E6ECF6;--paper:#F4F7FC;--paper-2:#EAF0FA;--green-deep:#2BB069;
  position:relative;background:#fff;border:1px solid var(--hair);border-radius:22px;padding:14px;
  display:grid;grid-template-columns:1.55fr 1fr;gap:14px;transition:.3s cubic-bezier(.4,0,.2,1);
  font-family:'Plus Jakarta Sans',system-ui,sans-serif}
.cpft-card:hover{border-color:#cfe0f6;box-shadow:0 18px 50px -24px rgba(16,29,56,.32);transform:translateY(-3px)}
.cpft-card *{box-sizing:border-box}
.cpft-card__l{display:flex;gap:14px;min-width:0}
.cpft-card__media{width:104px;height:104px;flex:0 0 auto;border-radius:14px;background:var(--paper-2);display:flex;align-items:center;justify-content:center;overflow:hidden}
.cpft-card__media img{width:100%;height:100%;object-fit:cover}
.cpft-card__media .ico{width:58px;height:58px;padding:8px}
.cpft-card__body{min-width:0;display:flex;flex-direction:column}
.cpft-card__titlerow{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.cpft-card__title{font-family:'Space Grotesk',system-ui,sans-serif;font-weight:700;font-size:16.5px;line-height:1.25;color:var(--navy);letter-spacing:-.01em;margin:0}
.cpft-card:hover .cpft-card__title{color:var(--blue)}
.cpft-flags{display:flex;align-items:center;gap:8px;flex:0 0 auto}
.cpft-flags .icons{display:block}
.cpft-card__desc{color:var(--muted);font-size:13.5px;margin:8px 0 0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cpft-card__author{display:flex;align-items:center;gap:10px;margin-top:auto;padding-top:12px}
.cpft-card__author .av{width:38px;height:38px;border-radius:50%;overflow:hidden;flex:0 0 auto}
.cpft-card__author .av img{width:100%;height:100%;object-fit:cover}
.cpft-card__author b{font-family:'Space Grotesk',system-ui,sans-serif;font-weight:600;font-size:13.5px;color:var(--navy);display:block;line-height:1.2}
.cpft-card__author span{font-size:12px;color:var(--muted-2)}
.cpft-card__r{background:var(--paper);border-radius:16px;padding:14px;display:flex;flex-direction:column;gap:12px}
.cpft-stats{display:flex;gap:8px}
.cpft-stats .s{flex:1;text-align:center;background:#fff;border:1px solid var(--hair);border-radius:11px;padding:9px 4px}
.cpft-stats .s b{font-family:'Space Grotesk',system-ui,sans-serif;font-weight:700;font-size:16px;color:var(--navy);display:block;line-height:1}
.cpft-stats .s span{font-size:10.5px;color:var(--muted-2);text-transform:uppercase;letter-spacing:.04em;margin-top:3px;display:block}
.cpft-last{margin-top:auto;display:flex;align-items:center;gap:10px;background:#fff;border:1px solid var(--hair);border-radius:12px;padding:10px 12px}
.cpft-last .av{width:36px;height:36px;border-radius:50%;overflow:hidden;flex:0 0 auto}
.cpft-last .av img{width:100%;height:100%;object-fit:cover}
.cpft-last .ph{width:36px;height:36px;border-radius:50%;background:var(--paper-2);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.cpft-last .tx{min-width:0;flex:1}
.cpft-last .tx .lbl{font-size:10.5px;color:var(--muted-2);text-transform:uppercase;letter-spacing:.04em}
.cpft-last .tx b{font-family:'Space Grotesk',system-ui,sans-serif;font-weight:600;font-size:13px;color:var(--navy);display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cpft-last .tx span{font-size:11.5px;color:var(--muted-2)}
.cpft-last .go{color:var(--blue);flex:0 0 auto}
@media(max-width:1100px){.cpft-card{grid-template-columns:1fr}}
@media(max-width:520px){.cpft-card__l{flex-direction:column}.cpft-card__media{width:100%;height:150px}.cpft-stats{flex-wrap:wrap}}

/* =====================================================================
   TOPICS LIST PAGE  (.cpf scoped chrome)
   ===================================================================== */
.cpf-fhead{position:relative;overflow:hidden;background:radial-gradient(120% 140% at 85% -20%,#16305f,var(--navy) 55%,var(--ink));border-radius:var(--r-xl);padding:30px;color:#fff}
.cpf-fhead .grid{position:absolute;inset:0;background-image:linear-gradient(var(--navy-line) 1px,transparent 1px),linear-gradient(90deg,var(--navy-line) 1px,transparent 1px);background-size:46px 46px;opacity:.55;-webkit-mask-image:radial-gradient(120% 100% at 100% 0,#000,transparent 70%);mask-image:radial-gradient(120% 100% at 100% 0,#000,transparent 70%)}
.cpf-fhead .glow{position:absolute;width:380px;height:380px;border-radius:50%;filter:blur(120px);background:rgba(1,112,255,.25);right:-100px;top:-160px}
.cpf-bc{position:relative;display:flex;align-items:center;gap:8px;font-size:13px;color:#9fb0cf}
.cpf-bc a:hover{color:#fff}
.cpf-bc .sep{opacity:.5}
.cpf-fhead__top{position:relative;display:flex;align-items:flex-start;gap:18px;margin-top:18px}
.cpf-fhead__icon{width:72px;height:72px;border-radius:18px;background:#fff;padding:11px;flex:0 0 auto}
.cpf-fhead h1{font-size:clamp(24px,3vw,34px);font-weight:700;color:#fff;margin:2px 0 0}
.cpf-fhead p{color:#bccbe6;font-size:14.5px;margin:8px 0 0;max-width:44em}
.cpf-fhead__stats{position:relative;display:flex;gap:26px;margin-top:22px;flex-wrap:wrap}
.cpf-fhead__stats .st{display:flex;align-items:center;gap:8px;color:#c2cee6;font-size:13.5px}
.cpf-fhead__stats .st b{font-family:var(--fdisplay);font-weight:700;color:#fff;font-size:17px}
.cpf-fhead__bar{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:22px;padding-top:20px;border-top:1px solid var(--navy-line)}
.cpf-sorts{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.cpf-sorts a{font-size:13.5px;font-weight:600;color:#9fb0cf;padding:8px 14px;border-radius:999px;border:1px solid transparent;transition:.2s var(--ease)}
.cpf-sorts a:hover{color:#fff;background:rgba(255,255,255,.06)}
.cpf-sorts a.on{color:#fff;background:rgba(1,112,255,.22);border-color:rgba(1,112,255,.5)}
.cpf-fhead__act{display:flex;align-items:center;gap:12px}
.cpf-iconbtn{width:44px;height:44px;border-radius:12px;border:1px solid var(--navy-line);background:rgba(255,255,255,.05);display:flex;align-items:center;justify-content:center;color:#cdd9ef;cursor:pointer;transition:.2s var(--ease)}
.cpf-iconbtn:hover{background:rgba(255,255,255,.12);color:#fff}
.cpf-layout{display:grid;grid-template-columns:1fr 320px;gap:24px;margin-top:26px}
.cpf-loadmore{display:flex;justify-content:center;margin-top:20px}
.cpf-loadmore .btn{display:inline-flex;align-items:center;gap:8px;border:1px dashed #c7d3e6;border-radius:13px;background:#fff;color:var(--muted);padding:14px 26px;font-weight:600;font-size:14px;cursor:pointer;transition:.2s var(--ease)}
.cpf-loadmore .btn:hover{background:var(--paper);border-color:var(--blue);color:var(--blue)}
.cpf-side{display:flex;flex-direction:column;gap:20px}
.cpf-widget{background:#fff;border:1px solid var(--hair);border-radius:var(--r-lg);padding:20px}
.cpf-widget h3{font-family:var(--fdisplay);font-weight:700;font-size:15px;color:var(--ink-text);display:flex;align-items:center;gap:9px;padding-bottom:14px;border-bottom:1px solid var(--hair)}
.cpf-widget h3 .bar{width:4px;height:16px;border-radius:2px;background:var(--blue)}
.cpf-wrow{display:flex;align-items:center;gap:11px;padding:12px 0;border-bottom:1px solid var(--paper-2)}
.cpf-wrow:last-child{border-bottom:0;padding-bottom:0}
.cpf-wrow .mini{width:44px;height:44px;border-radius:11px;overflow:hidden;flex:0 0 auto;background:var(--paper-2);display:flex;align-items:center;justify-content:center}
.cpf-wrow .mini img{width:100%;height:100%;object-fit:cover}
.cpf-wrow .mini.rc{border-radius:50%}
.cpf-wrow .tx{min-width:0;flex:1}
.cpf-wrow .tx b{font-family:var(--fdisplay);font-weight:600;font-size:13.5px;color:var(--ink-text);display:block;line-height:1.3;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.cpf-wrow .tx span{font-size:11.5px;color:var(--muted-2)}
.cpf-wrow .tx .meta{display:flex;gap:12px;margin-top:3px}
@media(max-width:900px){.cpf-layout{grid-template-columns:1fr}.cpf-side{flex-direction:row;flex-wrap:wrap}.cpf-widget{flex:1;min-width:260px}}

/* =====================================================================
   POSTS (CONTENT) PAGE  (.cpf scoped)
   ===================================================================== */
.cpf-thead{position:relative;overflow:hidden;background:radial-gradient(120% 150% at 88% -30%,#16305f,var(--navy) 55%,var(--ink));border-radius:var(--r-xl);padding:30px;color:#fff;display:flex;align-items:flex-start;justify-content:space-between;gap:24px;flex-wrap:wrap}
.cpf-thead .grid{position:absolute;inset:0;background-image:linear-gradient(var(--navy-line) 1px,transparent 1px),linear-gradient(90deg,var(--navy-line) 1px,transparent 1px);background-size:46px 46px;opacity:.5;-webkit-mask-image:radial-gradient(120% 100% at 100% 0,#000,transparent 72%);mask-image:radial-gradient(120% 100% at 100% 0,#000,transparent 72%)}
.cpf-thead__l{position:relative;min-width:0;flex:1}
.cpf-thead h1{font-size:clamp(22px,2.8vw,32px);font-weight:700;color:#fff;margin:14px 0 0;max-width:20em}
.cpf-thead__author{display:flex;align-items:center;gap:11px;margin-top:18px}
.cpf-thead__author .av{width:42px;height:42px;border-radius:50%;overflow:hidden;flex:0 0 auto}
.cpf-thead__author .av img{width:100%;height:100%;object-fit:cover}
.cpf-thead__author b{font-family:var(--fdisplay);font-weight:600;font-size:14px;color:#fff;display:block}
.cpf-thead__author span{font-size:12px;color:#9fb0cf}
.cpf-thead__r{position:relative;display:flex;align-items:stretch;gap:14px}
.cpf-thead__meta{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;gap:14px}
.cpf-bookmark{width:42px;height:42px;border-radius:12px;border:1px solid var(--navy-line);background:rgba(255,255,255,.05);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:.2s var(--ease)}
.cpf-bookmark:hover{background:rgba(255,255,255,.12)}
.cpf-bookmark.text-primary{color:#7db4ff}
.cpf-thead__nums{display:flex;gap:18px}
.cpf-thead__nums .st{display:flex;align-items:center;gap:6px;font-size:13px;color:#c2cee6}
.cpf-thead__nums .st b{font-family:var(--fdisplay);font-weight:700;color:#fff;font-size:15px}
.cpf-thead__cover{width:88px;height:88px;border-radius:16px;overflow:hidden;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;flex:0 0 auto}
.cpf-thead__cover img{width:100%;height:100%;object-fit:cover}

/* post card */
.cpf-post{display:grid;grid-template-columns:230px 1fr;gap:0;background:#fff;border:1px solid var(--hair);border-radius:var(--r-lg);overflow:hidden;margin-top:22px}
.cpf-post--op{border-color:#cfe0f6;box-shadow:0 18px 50px -30px rgba(1,112,255,.4)}
.cpf-post__author{position:relative;background:var(--paper);padding:26px 20px;text-align:center;border-right:1px solid var(--hair)}
.cpf-post__pin{position:absolute;top:12px;right:12px;color:var(--amber)}
.cpf-post__ava{width:92px;height:92px;border-radius:50%;margin:0 auto;padding:5px;display:flex;align-items:center;justify-content:center}
.cpf-post__ava.op{background:linear-gradient(135deg,var(--blue),var(--green))}
.cpf-post__ava.reg{background:var(--paper-2)}
.cpf-post__ava .in{width:100%;height:100%;border-radius:50%;overflow:hidden;border:3px solid #fff}
.cpf-post__ava .in img{width:100%;height:100%;object-fit:cover}
.cpf-post__name{font-family:var(--fdisplay);font-weight:700;font-size:15px;color:var(--ink-text);margin-top:12px}
.cpf-post__role{display:inline-block;margin-top:8px;padding:4px 12px;border-radius:999px;font-size:11.5px;font-weight:600}
.cpf-post__role.op{background:rgba(1,112,255,.12);color:var(--blue)}
.cpf-post__role.reg{background:var(--paper-2);color:var(--muted)}
.cpf-post__badges{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:14px}
.cpf-post__badges img{width:30px;height:30px;border-radius:8px}
.cpf-post__ustats{margin-top:16px;padding-top:14px;border-top:1px solid var(--hair);text-align:left}
.cpf-post__ustats .r{display:flex;align-items:center;justify-content:space-between;font-size:12px;color:var(--muted);margin-top:8px}
.cpf-post__ustats .r b{font-family:var(--fdisplay);color:var(--ink-text);font-weight:600}
.cpf-post__main{padding:26px;display:flex;flex-direction:column;min-width:0}
.cpf-quote{display:flex;flex-direction:column;gap:8px;padding:14px;border:1px dashed #cdd9ee;border-radius:14px;background:var(--paper);margin-bottom:18px}
.cpf-quote .h{display:flex;align-items:center;gap:9px}
.cpf-quote .h .q{width:32px;height:32px;border-radius:9px;background:#fff;border:1px solid var(--hair);display:flex;align-items:center;justify-content:center;color:var(--blue)}
.cpf-quote .h .lbl{font-size:11px;color:var(--muted-2);text-transform:uppercase;letter-spacing:.04em}
.cpf-quote .h b{font-family:var(--fdisplay);font-weight:600;font-size:13px;color:var(--ink-text)}
.cpf-quote .body{color:var(--muted);font-size:13.5px}
.cpf-post__text{color:#2c3a55;font-size:15.5px;line-height:1.72}
.cpf-post__text p{margin:0 0 14px}
.cpf-post__text p:last-child{margin-bottom:0}
.cpf-post__text ul,.cpf-post__text ol{margin:0 0 14px;padding-left:22px}
.cpf-post__text li{margin:6px 0}
.cpf-post__text strong,.cpf-post__text b{color:var(--ink-text);font-weight:700}
.cpf-post__text a{color:var(--blue);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.cpf-post__text h1,.cpf-post__text h2,.cpf-post__text h3,.cpf-post__text h4{color:var(--ink-text);margin:18px 0 10px}
.cpf-attach{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.cpf-attach a{display:inline-flex;align-items:center;gap:7px;padding:9px 12px;border-radius:10px;background:var(--paper);border:1px solid var(--hair);font-size:12.5px;color:var(--muted);font-weight:500}
.cpf-attach a:hover{border-color:var(--blue);color:var(--blue)}
.cpf-post__foot{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:auto;padding-top:18px;border-top:1px solid var(--hair)}
.cpf-post__date{font-size:12.5px;color:var(--muted-2)}
.cpf-post__actions{display:flex;align-items:center;gap:6px}
.cpf-actbtn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:11px;background:transparent;border:1px solid transparent;color:var(--muted);cursor:pointer;transition:.2s var(--ease)}
.cpf-actbtn:hover{background:var(--paper);border-color:var(--hair);color:var(--ink-text)}
.cpf-actbtn.text-warning{color:var(--amber)}
.cpf-like{display:inline-flex;align-items:center;gap:7px;padding:8px 14px;border-radius:999px;background:var(--paper);border:1px solid var(--hair);margin-left:6px;font-size:13px;color:var(--muted);font-weight:600}
.cpf-like .js-like-count{font-family:var(--fdisplay);color:var(--ink-text)}
.cpf-like .liked,.cpf-like.liked{color:#E0483E}
@media(max-width:760px){.cpf-post{grid-template-columns:1fr}.cpf-post__author{border-right:0;border-bottom:1px solid var(--hair)}.cpf-post__ustats{display:none}}

/* reply form + states */
.cpf-reply{background:#fff;border:1px solid var(--hair);border-radius:var(--r-lg);padding:24px;margin-top:34px}
.cpf-reply__head{display:flex;align-items:center;gap:10px;font-family:var(--fdisplay);font-weight:700;font-size:16px;color:var(--ink-text);margin-bottom:18px}
.cpf-reply__head .bar{width:4px;height:18px;border-radius:2px;background:var(--green)}
.cpf-reply .replying{display:flex;align-items:center;justify-content:space-between;gap:12px;background:var(--paper);border:1px solid var(--hair);border-radius:14px;padding:14px;margin-bottom:18px}
.cpf-reply .replying .av{width:40px;height:40px;border-radius:50%;overflow:hidden;flex:0 0 auto}
.cpf-reply .replying .av img{width:100%;height:100%;object-fit:cover}
.cpf-reply__foot{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-top:18px;padding-top:18px;border-top:1px solid var(--hair)}
.cpf-reply__hint{display:flex;align-items:center;gap:12px}
.cpf-reply__hint .ic{width:46px;height:46px;border-radius:12px;background:var(--paper-2);display:flex;align-items:center;justify-content:center;color:var(--blue);flex:0 0 auto}
.cpf-reply__hint b{font-family:var(--fdisplay);font-size:14px;color:var(--ink-text)}
.cpf-reply__hint p{font-size:12.5px;color:var(--muted);margin:2px 0 0}
.cpf-submit{display:inline-flex;align-items:center;gap:8px;background:var(--blue);color:#fff;border:0;border-radius:13px;padding:14px 28px;font-family:var(--fbody);font-weight:600;font-size:15px;cursor:pointer;transition:.25s var(--ease)}
.cpf-submit:hover{transform:translateY(-2px);box-shadow:0 18px 36px -16px rgba(1,112,255,.7)}
.cpf-state{background:#fff;border:1px solid var(--hair);border-radius:var(--r-lg);padding:18px;margin-top:34px}
.cpf-state__in{display:flex;flex-direction:column;align-items:center;text-align:center;border:1px dashed #cdd9ee;border-radius:16px;padding:36px 24px}
.cpf-state__ic{width:60px;height:60px;border-radius:15px;display:flex;align-items:center;justify-content:center}
.cpf-state__ic.b{background:rgba(1,112,255,.12);color:var(--blue)}
.cpf-state__ic.d{background:rgba(224,72,62,.12);color:#E0483E}
.cpf-state h4{font-family:var(--fdisplay);font-size:17px;color:var(--ink-text);margin:14px 0 0}
.cpf-state p{font-size:14px;color:var(--muted);margin:6px 0 0}
.cpf-state a.lnk{display:inline-flex;align-items:center;gap:6px;margin-top:14px;color:var(--blue);font-weight:600}
.cpf-pagination{margin-top:22px}
.cpf-pagination .pagination{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;list-style:none;padding:0;margin:0}
.cpf-pagination .page-item .page-link{display:flex;align-items:center;justify-content:center;min-width:42px;height:42px;padding:0 12px;border-radius:11px;border:1px solid var(--hair);background:#fff;color:var(--ink-text);font-weight:600;font-family:var(--fdisplay)}
.cpf-pagination .page-item.active .page-link{background:var(--blue);border-color:var(--blue);color:#fff}
.cpf-pagination .page-item.disabled .page-link{opacity:.45}