/* =============================================
   SaudiJabo — CV / Portfolio পাতার স্টাইল
   শুধু /about-tarikul পাতায় লোড হয়। সব নিয়ম `.cv` এর ভিতরে
   রাখা, তাই সাইটের অন্য কোনো পাতায় এর প্রভাব পড়ে না।
   ============================================= */

.cv{
  --ink:#0f1a14;
  --body:#3b4650;
  --muted:#6b7684;
  --line:#e4e8ec;
  --soft:#f6f8f7;
  --brand:#1B4332;
  --brand-2:#2d6a4f;
  --gold:#D4AF37;
  --r:16px;

  background:#fff; color:var(--body);
  font-family:'Inter','Noto Sans Bengali','Hind Siliguri','Nirmala UI','Kalpurush','SolaimanLipi','Shonar Bangla',system-ui,sans-serif;
  overflow-x:clip;                 /* কোনো কারণে কিছু বেরিয়ে গেলেও পাতা পাশে সরবে না */
}
.cv-wrap{ width:100%; max-width:1120px; margin:0 auto; padding:0 16px; }
@media (min-width:768px){ .cv-wrap{ padding:0 24px; } }
@media (min-width:1280px){ .cv-wrap{ padding:0 32px; } }

.cv h1,.cv h2,.cv h3{ color:var(--ink); margin:0; overflow-wrap:break-word; }
.cv p{ margin:0; }
.cv a{ color:inherit; }
.cv img{ max-width:100%; }
.cv ul,.cv ol{ margin:0; padding:0; list-style:none; }

/* ---------- নরম প্রবেশ অ্যানিমেশন ---------- */
.cv-anim{ opacity:0; transform:translateY(14px); }
.cv-anim.is-in{ opacity:1; transform:none; transition:opacity .45s ease, transform .45s cubic-bezier(.22,.8,.3,1); }
@media (prefers-reduced-motion:reduce){
  .cv-anim{ opacity:1 !important; transform:none !important; transition:none !important; }
}

/* =============== হিরো =============== */
.cv-hero{
  position:relative; padding:28px 0 40px;
  background:
    radial-gradient(1100px 420px at 78% -12%, rgba(45,106,79,.10), transparent 62%),
    linear-gradient(180deg,#f7faf8 0%, #ffffff 100%);
  border-bottom:1px solid var(--line);
}
@media (min-width:1024px){ .cv-hero{ padding:40px 0 56px; } }

.cv-langs{ display:flex; justify-content:flex-end; gap:6px; margin-bottom:22px; }
.cv-langs a{
  min-height:44px; padding:0 16px; display:inline-flex; align-items:center;
  font-size:13.5px; font-weight:600; text-decoration:none; color:var(--muted);
  background:#fff; border:1px solid var(--line); border-radius:999px;
  transition:color .18s, border-color .18s, background .18s;
}
.cv .cv-langs a:hover{ color:var(--brand); border-color:#bcd3c5; }
.cv .cv-langs a.is-on{ background:var(--brand); border-color:var(--brand); color:#fff; }
.cv-langs a:focus-visible{ outline:2px solid var(--brand); outline-offset:2px; }

.cv-hero-grid{ display:grid; gap:26px; justify-items:center; text-align:center; }
@media (min-width:900px){
  .cv-hero-grid{
    grid-template-columns:auto minmax(0,1fr); gap:44px;
    justify-items:start; text-align:left; align-items:center;
  }
}

.cv-photo{
  width:148px; height:148px; border-radius:50%; overflow:hidden; flex:none;
  background:linear-gradient(135deg,var(--brand),var(--brand-2));
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 32px rgba(27,67,50,.20); border:4px solid #fff;
}
@media (min-width:900px){ .cv-photo{ width:200px; height:200px; } }
.cv-photo img{ width:100%; height:100%; object-fit:cover; display:block; }
.cv-initials{ font-size:54px; font-weight:700; color:#fff; line-height:1; }
@media (min-width:900px){ .cv-initials{ font-size:72px; } }

.cv-hero-text{ min-width:0; width:100%; }
.cv-hero-text h1{
  font-size:clamp(27px,7.4vw,34px); font-weight:700; line-height:1.2;
  letter-spacing:-.02em; margin-bottom:6px;
}
@media (min-width:640px){ .cv-hero-text h1{ font-size:clamp(34px,4.6vw,46px); } }
.cv-tagline{ font-size:15.5px; font-weight:600; color:var(--brand-2); margin-bottom:14px !important; }
@media (min-width:640px){ .cv-tagline{ font-size:17px; } }

.cv-roles{ display:flex; flex-wrap:wrap; gap:7px; justify-content:center; margin-bottom:16px !important; }
@media (min-width:900px){ .cv-roles{ justify-content:flex-start; } }
.cv-roles li{
  font-size:12.5px; font-weight:600; color:var(--brand);
  background:#eef5f0; border:1px solid #d5e5dc; border-radius:999px; padding:6px 13px;
}
.cv-intro{ font-size:15px; line-height:1.75; max-width:62ch; margin-bottom:16px !important; }

.cv-meta{ display:flex; flex-wrap:wrap; gap:8px 20px; justify-content:center; margin-bottom:20px !important; }
@media (min-width:900px){ .cv-meta{ justify-content:flex-start; } }
.cv-meta li{ display:flex; align-items:center; gap:7px; font-size:14px; color:var(--muted); min-width:0; }
.cv-meta a{ color:var(--body); text-decoration:none; overflow-wrap:anywhere; }
.cv .cv-meta a:hover{ color:var(--brand); text-decoration:underline; }

.cv-actions{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; }
@media (min-width:900px){ .cv-actions{ justify-content:flex-start; } }
.cv-actions-center{ justify-content:center !important; }

.cv-btn{
  min-height:46px; padding:0 20px; border-radius:999px;
  display:inline-flex; align-items:center; justify-content:center; gap:7px;
  font-size:14.5px; font-weight:600; text-decoration:none; white-space:nowrap;
  color:var(--ink); background:#fff; border:1.5px solid var(--line);
  transition:transform .16s ease, box-shadow .16s ease, border-color .16s, background .16s;
}
.cv-btn:hover{ border-color:#bcd3c5; transform:translateY(-2px); box-shadow:0 7px 18px rgba(15,26,20,.09); }
.cv-btn:active{ transform:translateY(0); }
.cv-btn:focus-visible{ outline:2px solid var(--brand); outline-offset:2px; }
.cv .cv-btn-main{ background:var(--brand); border-color:var(--brand); color:#fff; }
.cv .cv-btn-main:hover{ background:#163a2a; border-color:#163a2a; }
.cv .cv-btn-ghost{ background:transparent; border-color:rgba(255,255,255,.4); color:#fff; }
.cv-btn-ghost:hover{ background:rgba(255,255,255,.1); border-color:rgba(255,255,255,.7); }
.cv-btn-sm{ min-height:44px; padding:0 16px; font-size:13.5px; margin-top:14px; align-self:flex-start; }
@media (prefers-reduced-motion:reduce){ .cv-btn:hover{ transform:none; } }

.cv-pdf-note{ margin-top:14px !important; font-size:13px; color:var(--muted); }
.cv .cv-pdf-note a{ color:var(--brand); font-weight:600; }

/* =============== সেকশন =============== */
.cv-sec{ padding:38px 0; }
@media (min-width:1024px){ .cv-sec{ padding:52px 0; } }
.cv-sec + .cv-sec{ border-top:1px solid var(--line); }

.cv-head{ margin-bottom:22px; }
.cv-head h2{
  font-size:clamp(21px,5vw,26px); font-weight:700; line-height:1.3; letter-spacing:-.01em;
  position:relative; padding-bottom:11px;
}
@media (min-width:768px){ .cv-head h2{ font-size:29px; } }
.cv-head h2::after{
  content:''; position:absolute; left:0; bottom:0;
  width:46px; height:3px; border-radius:3px;
  background:linear-gradient(90deg,var(--brand),var(--gold));
}
.cv-head p{ margin-top:9px !important; font-size:14.5px; color:var(--muted); }
.cv-head-light h2{ color:#fff; }
.cv-head-light h2::after{ background:linear-gradient(90deg,var(--gold),#fff); }

.cv-prose p{ font-size:15.5px; line-height:1.85; max-width:74ch; }
.cv-prose p + p{ margin-top:14px !important; }
.cv-muted{ color:var(--muted); font-size:13.5px; }

/* =============== গ্রিড ও কার্ড =============== */
.cv-grid{ display:grid; gap:16px; grid-template-columns:1fr; }
@media (min-width:640px){ .cv-grid-2,.cv-grid-3{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:1024px){ .cv-grid-3{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.cv-stack{ display:grid; gap:14px; }
.cv-two{ display:grid; gap:0; }
@media (min-width:900px){
  .cv-two{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:0 44px; }
  .cv-two .cv-sec + .cv-sec{ border-top:0; }
}

.cv-card{
  position:relative; display:flex; flex-direction:column; min-width:0;
  background:#fff; border:1px solid var(--line); border-radius:var(--r); padding:20px;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.cv-card:hover{ transform:translateY(-3px); box-shadow:0 12px 28px rgba(15,26,20,.08); border-color:#d3dde0; }
@media (prefers-reduced-motion:reduce){ .cv-card:hover{ transform:none; } }
.cv-card h3{ font-size:16.5px; font-weight:700; line-height:1.4; }
.cv-card p{ font-size:14.5px; line-height:1.7; margin-top:8px !important; }

/* ---------- অভিজ্ঞতা ---------- */
.cv-exp{ display:grid; gap:0; }
.cv-exp-item{ display:grid; grid-template-columns:38px minmax(0,1fr); gap:14px; position:relative; padding-bottom:26px; }
.cv-exp-item:last-child{ padding-bottom:0; }
.cv-exp-item::before{
  content:''; position:absolute; left:18px; top:40px; bottom:0; width:2px;
  background:linear-gradient(180deg,var(--line),transparent);
}
.cv-exp-item:last-child::before{ display:none; }
.cv-exp-dot{
  width:38px; height:38px; border-radius:50%; flex:none; z-index:1;
  display:flex; align-items:center; justify-content:center; font-size:17px;
  background:var(--soft); border:1px solid var(--line);
}
.cv-exp-body{ min-width:0; padding-bottom:4px; }
.cv-exp-top{ display:flex; flex-wrap:wrap; align-items:baseline; gap:8px 12px; }
.cv-exp-top h3{ font-size:17px; font-weight:700; line-height:1.4; flex:1 1 auto; min-width:0; }
.cv-exp-org{ font-size:14px; color:var(--muted); margin-top:3px !important; }
.cv-exp-desc{ font-size:14.5px; line-height:1.75; margin-top:9px !important; max-width:72ch; }

.cv-chip{
  font-size:12px; font-weight:600; color:var(--brand); white-space:nowrap;
  background:#eef5f0; border:1px solid #d5e5dc; border-radius:999px; padding:4px 11px;
}
.cv-chip.is-now{ background:#fff8e6; border-color:#f0dfae; color:#8a6d14; }

.cv-bullets{ margin-top:11px !important; display:grid; gap:5px; }
@media (min-width:768px){ .cv-bullets{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:5px 20px; } }
.cv-bullets li{
  position:relative; padding-left:19px; font-size:14px; line-height:1.65; min-width:0;
}
.cv-bullets li::before{
  content:''; position:absolute; left:4px; top:.62em;
  width:6px; height:6px; border-radius:50%; background:var(--brand-2); opacity:.55;
}
.cv-tags{ display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.cv-tags span{
  font-size:11.5px; font-weight:500; color:var(--muted);
  background:var(--soft); border:1px solid var(--line); border-radius:6px; padding:4px 9px;
}

/* ---------- দক্ষতা ---------- */
.cv-skill-list{ margin-top:13px !important; display:grid; gap:1px; }
.cv-skill-list li{
  display:flex; justify-content:space-between; align-items:baseline; gap:12px;
  padding:8px 0; border-top:1px solid #f0f3f5; min-width:0;
}
.cv-skill-list li:first-child{ border-top:0; }
.cv-skill-name{ font-size:14px; font-weight:500; color:var(--ink); min-width:0; overflow-wrap:anywhere; }
.cv-skill-lvl{ font-size:11.5px; color:var(--muted); white-space:nowrap; flex:none; }

/* ---------- প্রজেক্ট ---------- */
.cv-proj{ padding-right:44px; }
.cv-proj-top{ display:flex; align-items:center; gap:12px; min-width:0; }
.cv-proj-logo{ width:44px; height:44px; border-radius:11px; object-fit:cover; flex:none; border:1px solid var(--line); }
.cv-proj h3{ font-size:17.5px; overflow-wrap:anywhere; }
.cv-star{
  position:absolute; top:16px; right:16px; color:var(--gold); font-size:17px; line-height:1;
}

/* ---------- যাত্রা ---------- */
.cv-tl{ position:relative; display:grid; gap:0; }
.cv-tl li{ display:grid; grid-template-columns:34px minmax(0,1fr); gap:14px; position:relative; padding-bottom:22px; }
.cv-tl li:last-child{ padding-bottom:0; }
.cv-tl li::before{
  content:''; position:absolute; left:16px; top:36px; bottom:0; width:2px;
  background:linear-gradient(180deg,#d9e4dd,transparent);
}
.cv-tl li:last-child::before{ display:none; }
.cv-tl-dot{
  width:34px; height:34px; border-radius:50%; flex:none; z-index:1; font-size:15px;
  display:flex; align-items:center; justify-content:center;
  background:#fff; border:2px solid #d9e4dd;
}
.cv-tl-body{ min-width:0; padding-top:4px; }
.cv-tl-year{
  display:inline-block; font-size:11.5px; font-weight:700; letter-spacing:.05em;
  color:var(--gold); margin-bottom:3px;
}
.cv-tl-body h3{ font-size:16px; font-weight:700; line-height:1.45; }
.cv-tl-body p{ font-size:14px; line-height:1.7; color:var(--muted); margin-top:4px !important; max-width:70ch; }

/* ---------- শক্তি ---------- */
.cv-str{
  display:flex; gap:13px; align-items:flex-start; min-width:0;
  background:var(--soft); border:1px solid var(--line); border-radius:13px; padding:16px;
  transition:background .18s, border-color .18s, transform .18s;
}
.cv-str:hover{ background:#fff; border-color:#d3dde0; transform:translateY(-2px); }
@media (prefers-reduced-motion:reduce){ .cv-str:hover{ transform:none; } }
.cv-str-ic{ font-size:20px; line-height:1.2; flex:none; }
.cv-str h3{ font-size:14.8px; font-weight:600; line-height:1.5; }
.cv-str p{ font-size:13.5px; line-height:1.65; color:var(--muted); margin-top:4px !important; }

/* =============== যোগাযোগ =============== */
.cv-contact{
  background:linear-gradient(140deg,#15301f 0%, var(--brand) 55%, #245c40 100%);
  color:#dbe6df; padding:46px 0 52px; margin-top:8px;
}
.cv-contact .cv-head{ margin-bottom:26px; }
.cv-ct-list{
  display:grid; gap:11px; grid-template-columns:1fr; margin-bottom:28px !important;
}
@media (min-width:640px){ .cv-ct-list{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (min-width:1024px){ .cv-ct-list{ grid-template-columns:repeat(3,minmax(0,1fr)); } }
.cv-ct-list li{ min-width:0; }
.cv-ct-list a, .cv-ct-list li > span, .cv-ct-list li{ min-width:0; }
.cv-ct-list a{
  display:flex; align-items:center; gap:12px; min-height:60px; padding:11px 15px;
  background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.14);
  border-radius:13px; text-decoration:none; color:inherit;
  transition:background .18s, border-color .18s, transform .18s;
}
.cv-ct-list a:hover{ background:rgba(255,255,255,.13); border-color:rgba(255,255,255,.3); transform:translateY(-2px); }
.cv-ct-list a:focus-visible{ outline:2px solid var(--gold); outline-offset:2px; }
@media (prefers-reduced-motion:reduce){ .cv-ct-list a:hover{ transform:none; } }
.cv-ct-ic{ font-size:19px; flex:none; }
.cv-ct-tx{ display:flex; flex-direction:column; min-width:0; }
.cv-ct-tx small{ font-size:11.5px; color:#9fb8ab; line-height:1.4; }
.cv .cv-ct-tx strong{ font-size:14.5px; font-weight:600; color:#fff; line-height:1.45; overflow-wrap:anywhere; }

/* =============== ছাপার সময় (সাধারণ পাতা থেকে Ctrl+P) ===============
   আসল CV ছাপা হয় /about-tarikul?print=1 থেকে। তবু কেউ এই পাতাটিই
   ছাপাতে চাইলে যেন নেভিগেশন, বোতাম ও রঙিন ব্যাকগ্রাউন্ড না আসে। */
@media print{
  nav, footer, .cv-langs, .cv-actions, .cv-pdf-note,
  a[href^="https://wa.me"], #mobileMenu{ display:none !important; }
  .cv, .cv-hero, .cv-contact{ background:#fff !important; color:#000 !important; }
  .cv-contact, .cv-head-light h2, .cv-ct-tx strong{ color:#000 !important; }
  .cv-ct-list a{ background:none !important; border-color:#ccc !important; }
  .cv-sec{ padding:14px 0; break-inside:avoid; }
  .cv-card, .cv-exp-item, .cv-tl li, .cv-str{ break-inside:avoid; page-break-inside:avoid; }
  .cv-anim{ opacity:1 !important; transform:none !important; }
}