/* =======================================================
   SINGLE POST (Article / News)
   File: assets/css/single-post.css
   Layer: pages
   Goal: clean alignment + readable typography + full token colors
======================================================= */


  /* -------------------------------------------------------
     SCOPE
  ------------------------------------------------------- */
  :where(body.single,body.single-post) :where(.single-post-section,.single-section){
    padding:var(--space-xl) 0;
    background:var(--color-bg);
  }

  :where(body.single,body.single-post) .single-post-wrap{
    max-width:980px;
    margin:0 auto;
  }

  :where(body.single,body.single-post) .single-post-card{
    background:var(--color-white);
    border-radius:var(--radius-base);
    box-shadow:var(--shadow-soft);
    border:1px solid color-mix(in srgb, var(--color-dark) 12%, transparent);
    padding:var(--space-lg);
    overflow:hidden;
  }

  /* Meta */
  :where(body.single,body.single-post) :where(.post-meta,.entry-meta){
    font-size:13px;
    opacity:.9;
    margin:0 0 10px;
    color:var(--color-dark);
  }
  :where(body.single,body.single-post) :where(.post-meta,.entry-meta) a{
    color:var(--color-link);
    text-decoration:underline;
    text-underline-offset:3px;
  }

  /* Title */
  :where(body.single,body.single-post) :where(.single-post-title,.entry-title){
    font-family:var(--font-title);
    font-size:clamp(30px,4vw,44px);
    line-height:1.1;
    margin:0 0 16px;
    color:var(--color-dark);
  }

  /* Featured image */
  :where(body.single,body.single-post) :where(.post-thumbnail,.single-featured-image){
    margin:0 0 var(--space-md);
  }
  :where(body.single,body.single-post) :where(.post-thumbnail,.single-featured-image) img{
    width:100%;
    height:auto;
    display:block;
    border-radius:var(--radius-base);
    object-fit:cover;
  }

  /* Content typography */
  :where(body.single,body.single-post) :where(.entry-content,.post-content,.single-content){
    color:var(--color-dark);
    line-height:1.75;
    font-size:15px;
  }

  :where(body.single,body.single-post) :where(.entry-content,.post-content,.single-content) :where(p,ul,ol){
    margin:0 0 14px;
  }

  :where(body.single,body.single-post) :where(.entry-content,.post-content,.single-content) :where(h2,h3){
    font-family:var(--font-title);
    margin:26px 0 10px;
    line-height:1.2;
    color:var(--color-dark);
  }
  :where(body.single,body.single-post) :where(.entry-content,.post-content,.single-content) h2{font-size:22px;}
  :where(body.single,body.single-post) :where(.entry-content,.post-content,.single-content) h3{font-size:18px;}

  :where(body.single,body.single-post) :where(.entry-content,.post-content,.single-content) :where(ul,ol){
    padding-left:18px;
  }
  :where(body.single,body.single-post) :where(.entry-content,.post-content,.single-content) li{
    margin:6px 0;
  }

  /* Links inside content */
  :where(body.single,body.single-post) :where(.entry-content,.post-content,.single-content) a{
    color:var(--color-link);
    text-decoration:underline;
    text-underline-offset:3px;
    text-decoration-thickness:1.5px;
  }
  :where(body.single,body.single-post) :where(.entry-content,.post-content,.single-content) a:hover{
    color:var(--color-link-hover);
    text-decoration-thickness:2px;
  }

  /* Back button area */
  :where(body.single,body.single-post) .single-back{
    margin-top:var(--space-lg);
    padding-top:var(--space-md);
    border-top:1px solid color-mix(in srgb, var(--color-dark) 18%, transparent);
    display:flex;
    justify-content:flex-start;
  }

  /* -------------------------------------------------------
     A11Y: clear focus on content links (scoped)
  ------------------------------------------------------- */
  :where(body.single,body.single-post) :where(.entry-content,.post-content) a:focus-visible{
    outline:3px solid var(--color-focus);
    outline-offset:3px;
    border-radius:8px;
  }