/* =========================================================
   news-variants.css — الأخبار 2 و3 و4 (اختلاف بنيوي)
   الألوان من متغيّرات الثيم. News1 يستخدم style.css.
   يُضاف بعد style.css
   ========================================================= */

/* بطاقة خبر موحّدة (تُستخدم في 2 و3) */
.news-tile{display:flex;flex-direction:column;background:#fff;border-radius:var(--radius-lg);overflow:hidden;
  box-shadow:var(--shadow-sm);border:2px solid transparent;transition:var(--transition-slow);height:100%;}
.news-tile:hover{transform:translateY(-10px);box-shadow:var(--shadow-lg);border-color:rgba(201,169,97,.2);}
.news-tile .nt-img{position:relative;aspect-ratio:16/10;overflow:hidden;}
.news-tile .nt-img img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease;}
.news-tile:hover .nt-img img{transform:scale(1.06);}
.news-tile .nt-cat{position:absolute;top:14px;right:14px;padding:6px 14px;border-radius:50px;font-size:.72rem;font-weight:700;
  background:linear-gradient(135deg,var(--teal),var(--teal-dark));color:#fff;box-shadow:var(--shadow-teal);}
.news-tile .nt-date{position:absolute;bottom:12px;left:12px;padding:6px 12px;border-radius:10px;font-size:.72rem;font-weight:600;
  background:rgba(255,255,255,.92);color:var(--teal-dark);backdrop-filter:blur(6px);}
.news-tile .nt-body{padding:22px 20px;display:flex;flex-direction:column;flex:1;}
.news-tile .nt-title{font-size:1.08rem;font-weight:700;color:var(--dark);line-height:1.5;margin:0 0 14px;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.news-tile .nt-link{margin-top:auto;display:inline-flex;align-items:center;gap:8px;color:var(--teal);font-weight:700;font-size:.88rem;transition:var(--transition);}
.news-tile .nt-link:hover{gap:12px;color:var(--gold-dark);}

/* ============ الأخبار 2 — شبكة موحّدة (3 أعمدة) ============ */
.news-section--grid{background:var(--bg-light);padding:64px 0;}
.news-section--grid .nn2-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
@media(max-width:900px){.news-section--grid .nn2-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:600px){.news-section--grid .nn2-grid{grid-template-columns:1fr;}}

/* ============ الأخبار 3 — مميّز عريض + شريط أفقي ============ */
.news-section--wide{background:var(--bg-light);padding:64px 0;}
.nn3-feature{display:grid;grid-template-columns:1.1fr .9fr;gap:0;background:#fff;border-radius:var(--radius-xl);overflow:hidden;
  box-shadow:var(--shadow-md);margin-bottom:28px;border:2px solid transparent;transition:var(--transition-slow);}
.nn3-feature:hover{box-shadow:var(--shadow-lg);border-color:rgba(201,169,97,.25);}
.nn3-feature .nf-img{position:relative;min-height:320px;overflow:hidden;}
.nn3-feature .nf-img img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:transform .7s;}
.nn3-feature:hover .nf-img img{transform:scale(1.05);}
.nn3-feature .nf-cat{position:absolute;top:16px;right:16px;padding:7px 16px;border-radius:50px;font-size:.75rem;font-weight:700;background:linear-gradient(135deg,var(--gold-light),var(--gold-dark));color:#fff;box-shadow:var(--shadow-gold);}
.nn3-feature .nf-body{padding:38px 34px;display:flex;flex-direction:column;justify-content:center;}
.nn3-feature .nf-date{color:var(--gray-500);font-size:.82rem;margin-bottom:12px;}
.nn3-feature .nf-title{font-size:1.6rem;font-weight:800;color:var(--dark);line-height:1.4;margin:0 0 14px;}
.nn3-feature .nf-ex{color:var(--gray-500);line-height:1.9;margin:0 0 22px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;}
.nn3-feature .nf-link{display:inline-flex;align-items:center;gap:8px;color:var(--teal);font-weight:700;transition:var(--transition);}
.nn3-feature .nf-link:hover{gap:12px;color:var(--gold-dark);}
.nn3-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
@media(max-width:860px){.nn3-feature{grid-template-columns:1fr;}.nn3-feature .nf-img{min-height:240px;}.nn3-strip{grid-template-columns:1fr;}}

/* ============ الأخبار 4 — مجلّة (Magazine) ============ */
.news-section--mag{background:var(--white);padding:64px 0;}
.nn4-row{display:grid;grid-template-columns:1.15fr .85fr;gap:32px;align-items:start;}
.nn4-feature{position:relative;border-radius:var(--radius-xl);overflow:hidden;box-shadow:var(--shadow-md);height:100%;min-height:420px;transition:var(--transition-slow);}
.nn4-feature:hover{box-shadow:var(--shadow-lg);}
.nn4-feature img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;transition:transform .7s;}
.nn4-feature:hover img{transform:scale(1.05);}
.nn4-feature::after{content:'';position:absolute;inset:0;background:linear-gradient(to top,rgba(14,68,80,.92),rgba(14,68,80,.2) 55%,transparent);}
.nn4-feature .nf4-body{position:absolute;bottom:0;right:0;left:0;padding:32px;z-index:1;}
.nn4-feature .nf4-cat{display:inline-block;padding:6px 16px;border-radius:50px;font-size:.74rem;font-weight:700;background:linear-gradient(135deg,var(--gold-light),var(--gold-dark));color:#fff;margin-bottom:12px;}
.nn4-feature .nf4-title{font-size:1.5rem;font-weight:800;color:#fff;line-height:1.4;margin:0 0 10px;}
.nn4-feature .nf4-ex{color:rgba(255,255,255,.88);line-height:1.8;margin:0 0 16px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.nn4-feature .nf4-link{display:inline-flex;align-items:center;gap:8px;color:#fff;font-weight:700;}
.nn4-list{display:flex;flex-direction:column;gap:16px;}
.nn4-item{display:flex;gap:16px;background:var(--bg-light);border-radius:var(--radius-md);padding:12px;transition:var(--transition-slow);border:1px solid transparent;}
.nn4-item:hover{background:#fff;border-color:rgba(201,169,97,.3);box-shadow:var(--shadow-md);transform:translateX(-4px);}
.nn4-item .ni-img{width:110px;height:90px;flex:none;border-radius:12px;overflow:hidden;}
.nn4-item .ni-img img{width:100%;height:100%;object-fit:cover;}
.nn4-item .ni-body{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center;}
.nn4-item .ni-cat{color:var(--teal);font-size:.72rem;font-weight:700;margin-bottom:4px;}
.nn4-item .ni-title{font-size:.95rem;font-weight:700;color:var(--dark);line-height:1.5;margin:0 0 6px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.nn4-item .ni-meta{font-size:.75rem;color:var(--gray-500);}
.nn4-item .ni-meta i{color:var(--gold);margin-left:4px;}
@media(max-width:860px){.nn4-row{grid-template-columns:1fr;}.nn4-feature{min-height:340px;}}
