/* Article page, author box, service links and article cards. Uses the shared --ac-* tokens from style.css. */
.as-shell{--as-ink:var(--ac-ink,#163c35);--as-primary:var(--ac-primary,#22564a);--as-paper:var(--ac-paper,#fcfaf5);--as-line:var(--ac-line,#e3e7e1);--as-muted:var(--ac-muted,#65726a);--as-gold:var(--ac-gold,#8d692a);--as-focus:var(--ac-focus,#a16c10);--as-radius:var(--ac-radius,12px);color:var(--as-ink);background:#fff;line-height:1.9}
.as-shell *,.as-shell *::before,.as-shell *::after{box-sizing:border-box}
.as-shell a{color:inherit}
.as-shell a:focus-visible{outline:3px solid var(--as-focus);outline-offset:3px;border-radius:4px}
.as-wrap{width:min(1200px,calc(100% - 32px));margin-inline:auto}
.as-wrap--text{width:min(760px,calc(100% - 32px))}

/* Head */
.as-article-head{background:var(--as-paper);border-block-end:1px solid var(--as-line);padding-block:24px 32px}
.as-breadcrumb{display:flex;flex-wrap:wrap;gap:6px 8px;font-size:13px;color:var(--as-muted);margin-block-end:28px}
.as-breadcrumb a{text-decoration:none}
.as-breadcrumb a:hover{color:var(--as-primary);text-decoration:underline}
.as-breadcrumb [aria-current]{color:var(--as-ink)}
.as-eyebrow{margin:0 0 10px;font-size:14px;font-weight:700;color:var(--as-gold)}
.as-eyebrow a{text-decoration:none}
.as-title{margin:0 0 24px;font-size:clamp(28px,4.2vw,42px);line-height:1.45;font-weight:800;color:var(--as-ink);text-wrap:balance}
.as-byline{display:flex;align-items:center;gap:14px}
.as-byline-text p{margin:0}
.as-byline-people{display:flex;flex-wrap:wrap;gap:2px 18px;font-size:15px}
.as-byline-people a{font-weight:700;text-decoration:none;color:var(--as-primary)}
.as-byline-people a:hover{text-decoration:underline}
.as-byline-role{color:var(--as-muted)}
.as-byline-meta{display:flex;flex-wrap:wrap;gap:2px 16px;font-size:13px;color:var(--as-muted)}

/* Avatar: photo or initials */
.as-avatar{flex:0 0 auto;width:var(--as-size,48px);height:var(--as-size,48px);border-radius:50%;object-fit:cover}
.as-avatar--initials{display:inline-flex;align-items:center;justify-content:center;background:var(--as-primary);color:#fff;font-weight:800;font-size:calc(var(--as-size,48px) * .36);line-height:1}

/* Body */
.as-hero-image{margin-block:32px 8px}
.as-hero-image img{display:block;width:100%;max-width:760px;height:auto;margin-inline:auto;border-radius:var(--as-radius)}
.as-content{padding-block:24px 8px;font-size:17px}
.as-content h2{font-size:clamp(22px,2.6vw,27px);line-height:1.6;margin:44px 0 14px;color:var(--as-ink)}
.as-content h3{font-size:20px;line-height:1.6;margin:32px 0 10px}
.as-content p,.as-content ul,.as-content ol{margin:0 0 18px}
.as-content ul,.as-content ol{padding-inline-start:24px}
.as-content a{color:var(--as-primary);text-underline-offset:4px}
.as-content img{max-width:100%;height:auto;border-radius:var(--as-radius)}
.as-content table{display:block;max-width:100%;overflow-x:auto;border-collapse:collapse;margin-block-end:20px}
.as-content th,.as-content td{border:1px solid var(--as-line);padding:8px 12px;text-align:start}

/* «خدمت مرتبط» inside the article */
.as-services{margin:36px 0;padding:22px 24px;background:var(--as-paper);border:1px solid var(--as-line);border-inline-start:4px solid var(--as-gold);border-radius:var(--as-radius)}
.as-services-eyebrow{margin:0 0 4px!important;font-size:13px;font-weight:700;color:var(--as-gold)}
.as-content .as-services-title{margin:0 0 12px;font-size:19px;line-height:1.6}
.as-services ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.as-services a{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-weight:700;text-decoration:none}
.as-services a span{transition:transform .2s ease-out}
.as-services a:hover{text-decoration:underline}
.as-services a:hover span{transform:translateX(-3px)}

/* Foot: author and reviewer */
.as-article-foot{padding-block:16px 40px}
.as-author-box{display:flex;gap:16px;align-items:flex-start;padding:20px;border:1px solid var(--as-line);border-radius:var(--as-radius);margin-block-end:14px}
.as-author-box p{margin:0}
.as-author-kicker{font-size:13px;color:var(--as-muted)}
.as-author-name{font-size:17px;font-weight:800}
.as-author-name a{text-decoration:none;color:var(--as-primary)}
.as-author-name span{font-weight:400;color:var(--as-muted);font-size:15px}
.as-author-bio{margin-block-start:6px!important;font-size:15px}
.as-disclaimer{margin:18px 0 0;font-size:13px;color:var(--as-muted)}

/* Author archive intro */
.as-author-hero{display:flex;gap:18px;align-items:center;max-width:760px;margin:0 auto 32px;padding:20px;border:1px solid var(--ac-line,#e3e7e1);border-radius:var(--ac-radius,12px);line-height:1.9}
.as-author-hero p{margin:0}
.as-author-role{font-weight:700;color:var(--ac-gold,#8d692a)}

/* Cards: related articles and service-page reading lists */
.as-related,.as-service-articles{background:var(--as-paper);border-block-start:1px solid var(--as-line);padding-block:48px 56px}
.as-service-articles{--as-ink:var(--ac-ink,#163c35);--as-primary:var(--ac-primary,#22564a);--as-paper:var(--ac-paper,#fcfaf5);--as-line:var(--ac-line,#e3e7e1);--as-muted:var(--ac-muted,#65726a);--as-radius:var(--ac-radius,12px);color:var(--as-ink);line-height:1.9;direction:rtl}
.as-section-head{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:8px 24px;margin-block-end:20px}
.as-section-head h2{margin:0;font-size:clamp(22px,2.6vw,28px);line-height:1.5}
.as-more{display:inline-flex;align-items:center;gap:6px;min-height:44px;font-weight:700;color:var(--as-primary);text-decoration:none}
.as-more:hover{text-decoration:underline}
.as-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:20px}
.as-card{background:#fff;border:1px solid var(--as-line);border-radius:var(--as-radius);overflow:hidden;transition:box-shadow .2s ease-out,border-color .2s ease-out}
.as-card:hover{border-color:#cfd8cf;box-shadow:0 8px 24px rgba(22,60,53,.08)}
.as-card a{display:flex;flex-direction:column;height:100%;text-decoration:none;color:inherit}
.as-card-image{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover;background:#edf1e5}
.as-card-title{margin:16px 18px 6px;font-size:17px;line-height:1.7;font-weight:700}
.as-card-meta{margin:auto 18px 16px;font-size:13px;color:var(--as-muted)}

@media (max-width:600px){
  .as-article-head{padding-block:18px 24px}
  .as-breadcrumb{margin-block-end:18px}
  .as-content{font-size:16px}
  .as-services{padding:18px}
  .as-author-box,.as-author-hero{flex-direction:column}
}
@media (prefers-reduced-motion:reduce){
  .as-services a span,.as-card{transition:none}
  .as-services a:hover span{transform:none}
}
