:root{
    --navy-deep:#0A1B2E;
    --navy-mid:#122B47;
    --navy-soft:#1B3B5C;
    --gold:#C9A45C;
    --gold-soft:#E4CFA0;
    --teal:#3E93A0;
    --ivory:#F6F2E8;
    --ivory-dim:#EDE7D8;
    --ink:#141B22;
    --ink-soft:#4A5560;
    --serif:'Fraunces', serif;
    --sans:'Inter', sans-serif;
    --mono:'IBM Plex Mono', monospace;
  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    font-family:var(--sans);
    background:var(--ivory);
    color:var(--ink);
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  @media (prefers-reduced-motion: reduce){
    *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important; scroll-behavior:auto !important;}
  }

  a{color:inherit;text-decoration:none;}
  img{max-width:100%;display:block;}
  .container{max-width:1120px;margin:0 auto;padding:0 32px;}
  .eyebrow{
    font-family:var(--mono);
    font-size:12px;
    letter-spacing:0.18em;
    text-transform:uppercase;
    color:var(--gold);
  }

  /* ---------- Light thread signature element ---------- */
  .light-thread{
    position:fixed;
    top:0; left:50%;
    width:1px; height:100vh;
    background:linear-gradient(to bottom, transparent, var(--gold) 15%, var(--gold-soft) 50%, var(--gold) 85%, transparent);
    opacity:0.18;
    pointer-events:none;
    z-index:1;
    transform:translateX(-50%);
    mix-blend-mode:multiply;
  }

  /* ---------- Nav (CHỈ menu trong header — không đụng <nav> phân trang) ---------- */
  header nav{
    position:fixed; top:0; left:0; right:0;
    z-index:100;
    padding:20px 32px;
    display:flex; align-items:center; justify-content:space-between;
    backdrop-filter:blur(10px);
    background:rgba(246,242,232,0.72);
    border-bottom:1px solid rgba(20,27,34,0.06);
    transition:background 0.4s ease;
  }
  .nav-brand{display:flex; align-items:center; gap:10px;}
  .nav-brand img{width:28px; height:28px; object-fit:contain;}
  .nav-brand span{font-family:var(--serif); font-weight:500; font-size:17px; letter-spacing:0.02em;}
  .nav-links{display:flex; gap:36px; font-size:13px; letter-spacing:0.03em;}
  .nav-links a{opacity:0.65; transition:opacity 0.25s ease;}
  .nav-links a:hover, .nav-links a:focus-visible{opacity:1;}
  .nav-toggle{ display:none; }

  /* ---------- Hero ---------- */
  .hero{
    min-height:82vh;
    background:radial-gradient(ellipse 140% 90% at 50% -10%, var(--navy-soft), var(--navy-deep) 65%);
    color:var(--ivory);
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    padding:128px 32px 64px;
    position:relative;
    overflow:hidden;
  }
  .hero::before{
    content:"";
    position:absolute;
    top:-20%; left:50%;
    width:900px; height:900px;
    background:radial-gradient(circle, rgba(201,164,92,0.16), transparent 65%);
    transform:translateX(-50%);
    pointer-events:none;
  }
  .hero-logo{
    width:auto; height:180px;
    max-width:200px;
    object-fit:contain;
    margin-bottom:28px;
    filter:drop-shadow(0 0 40px rgba(201,164,92,0.35));
    opacity:0;
    animation:riseIn 1.1s ease forwards;
  }
  .hero-title{
    font-family:var(--serif);
    font-weight:400;
    font-size:clamp(48px, 9vw, 96px);
    letter-spacing:0.01em;
    line-height:1;
    opacity:0;
    animation:riseIn 1.1s ease 0.15s forwards;
  }
  .hero-subtitle{
    font-family:var(--mono);
    font-size:13px;
    letter-spacing:0.24em;
    text-transform:uppercase;
    color:var(--gold-soft);
    margin-top:18px;
    opacity:0;
    animation:riseIn 1.1s ease 0.3s forwards;
  }
  .hero-lines{
    margin-top:56px;
    max-width:620px;
    font-family:var(--serif);
    font-size:clamp(19px, 2.4vw, 24px);
    font-weight:300;
    line-height:1.65;
    color:var(--ivory-dim);
  }
  .hero-lines span{
    display:block;
    opacity:0;
    animation:riseIn 1s ease forwards;
  }
  .hero-lines span:nth-child(1){animation-delay:0.6s;}
  .hero-lines span:nth-child(2){animation-delay:0.85s; color:var(--gold-soft); margin-top:6px;}

  @keyframes riseIn{
    from{opacity:0; transform:translateY(16px);}
    to{opacity:1; transform:translateY(0);}
  }

  .scroll-cue{
    position:absolute;
    bottom:40px; left:50%;
    transform:translateX(-50%);
    width:1px; height:48px;
    background:linear-gradient(to bottom, transparent, var(--gold));
    opacity:0.6;
    animation:pulseCue 2.4s ease-in-out infinite;
  }
  @keyframes pulseCue{
    0%,100%{opacity:0.25; height:32px;}
    50%{opacity:0.7; height:48px;}
  }

  /* ---------- Section shell ---------- */
  section{
    padding:96px 32px;
    position:relative;
    z-index:2;
  }
  .section-head{
    max-width:640px;
    margin:0 auto 72px;
    text-align:center;
  }
  .section-head h2{
    font-family:var(--serif);
    font-weight:400;
    font-size:clamp(32px, 4vw, 44px);
    margin-top:14px;
    letter-spacing:0.01em;
  }
  .section-head p{
    margin-top:20px;
    font-size:16px;
    line-height:1.75;
    color:var(--ink-soft);
    font-weight:300;
  }

  /* ---------- Preface (dark, quiet) ---------- */
  .preface{
    background:var(--navy-deep);
    color:var(--ivory);
    text-align:center;
    padding:118px 32px;
  }
  .preface blockquote{
    max-width:760px;
    margin:0 auto;
    font-family:var(--serif);
    font-weight:300;
    font-size:clamp(24px, 3.4vw, 34px);
    line-height:1.55;
    color:var(--ivory-dim);
  }
  .preface .divider{
    width:36px; height:1px;
    background:var(--gold);
    margin:44px auto;
    opacity:0.7;
  }
  .preface .cross-icon{
    width:42px; height:42px;
    margin:48px auto;
    opacity:0.75;
    animation:slowRotate 60s linear infinite;
  }
  .preface .cross-icon svg{width:100%; height:100%; display:block;}
  .preface .cross-icon path{
    stroke:var(--gold);
    stroke-width:3;
    stroke-linecap:round;
    fill:none;
  }
  @keyframes slowRotate{
    from{transform:rotate(0deg);}
    to{transform:rotate(360deg);}
  }
  .preface .question{
    font-family:var(--serif);
    font-style:italic;
    font-weight:400;
    font-size:clamp(20px, 2.6vw, 26px);
    color:var(--gold-soft);
    max-width:600px;
    margin:0 auto;
    line-height:1.5;
  }

  /* ---------- Philosophy grid ---------- */
  .philosophy{background:var(--ivory);}
  .chapters{
    max-width:960px;
    margin:0 auto;
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:1px;
    background:rgba(20,27,34,0.08);
    border:1px solid rgba(20,27,34,0.08);
  }
  .chapter{
    background:var(--ivory);
    padding:44px 40px;
    opacity:0;
    transform:translateY(18px);
    transition:opacity 0.7s ease, transform 0.7s ease;
  }
  .chapter.visible{opacity:1; transform:translateY(0);}
  .chapter .num{
    font-family:var(--mono);
    font-size:12px;
    color:var(--gold);
    letter-spacing:0.1em;
  }
  .chapter h3{
    font-family:var(--serif);
    font-weight:500;
    font-size:22px;
    margin-top:10px;
    margin-bottom:12px;
  }
  .chapter p{
    font-size:14.5px;
    line-height:1.7;
    color:var(--ink-soft);
    font-weight:300;
  }

  /* ---------- Commandments ---------- */
  .commandments{
    background:var(--navy-deep);
    color:var(--ivory);
  }
  .commandments .section-head p{color:var(--ivory-dim);}
  .tablet{
    max-width:720px;
    margin:0 auto;
    border-top:1px solid rgba(228,207,160,0.25);
  }
  .commandment{
    display:flex;
    gap:28px;
    align-items:baseline;
    padding:26px 4px;
    border-bottom:1px solid rgba(228,207,160,0.15);
    opacity:0;
    transform:translateY(14px);
    transition:opacity 0.6s ease, transform 0.6s ease;
  }
  .commandment.visible{opacity:1; transform:translateY(0);}
  .commandment .cnum{
    font-family:var(--serif);
    font-size:22px;
    color:var(--gold);
    min-width:32px;
    flex-shrink:0;
  }
  .commandment p{
    font-family:var(--serif);
    font-weight:300;
    font-size:19px;
    line-height:1.5;
    color:var(--ivory-dim);
  }

  /* ---------- About / Mission ---------- */
  .about{background:var(--ivory);}
  .about-grid{
    max-width:960px;
    margin:0 auto;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:72px;
    align-items:center;
  }
  .about-visual{
    display:flex;
    align-items:center;
    justify-content:center;
    padding:40px;
    background:linear-gradient(160deg, var(--navy-mid), var(--navy-deep));
    border-radius:4px;
    aspect-ratio:1;
  }
  .about-visual img{width:70%; filter:drop-shadow(0 0 30px rgba(201,164,92,0.25));}
  .about-text .eyebrow{margin-bottom:16px;}
  .about-text h2{
    font-family:var(--serif);
    font-weight:400;
    font-size:clamp(28px, 3.4vw, 38px);
    line-height:1.25;
    margin-bottom:22px;
  }
  .about-text p{
    font-size:16px;
    line-height:1.85;
    color:var(--ink-soft);
    font-weight:300;
    margin-bottom:18px;
  }
  .about-text p:last-child{margin-bottom:0;}

/* ---------- applications ---------- */
  .applications{
    background:var(--navy-deep);
    color:var(--ivory);
  }
  .applications .section-head p{color:var(--ivory-dim);}
  .tablet{
    max-width:720px;
    margin:0 auto;
    border-top:1px solid rgba(228,207,160,0.25);
  }
  .application{
    display:flex;
    gap:28px;
    align-items:baseline;
    padding:26px 4px;
    border-bottom:1px solid rgba(228,207,160,0.15);
    opacity:0;
    transform:translateY(14px);
    transition:opacity 0.6s ease, transform 0.6s ease;
  }
  .application.visible{opacity:1; transform:translateY(0);}
  .application .cnum{
    font-family:var(--serif);
    font-size:22px;
    color:var(--gold);
    min-width:32px;
    flex-shrink:0;
  }
  .application p{
    font-family:var(--serif);
    font-weight:300;
    font-size:19px;
    line-height:1.5;
    color:var(--ivory-dim);
  }

  /* ---------- CTA / Contact ---------- */
  .cta{
    background:var(--ivory-dim);
    text-align:center;
  }
  .cta-inner{max-width:560px; margin:0 auto;}
  .cta h2{
    font-family:var(--serif);
    font-weight:400;
    font-size:clamp(30px, 4vw, 42px);
    margin-top:14px;
    margin-bottom:20px;
  }
  .cta p{
    font-size:16px;
    line-height:1.75;
    color:var(--ink-soft);
    font-weight:300;
    margin-bottom:40px;
  }
  .cta-buttons{
    display:flex;
    gap:16px;
    justify-content:center;
    flex-wrap:wrap;
  }
  .btn{
    display:inline-block;
    padding:15px 34px;
    font-size:14px;
    letter-spacing:0.04em;
    border-radius:2px;
    transition:all 0.3s ease;
  }
  .btn-primary{
    background:var(--navy-deep);
    color:var(--ivory);
  }
  .btn-primary:hover, .btn-primary:focus-visible{
    background:var(--gold);
    color:var(--navy-deep);
  }
  .btn-secondary{
    border:1px solid rgba(20,27,34,0.25);
    color:var(--ink);
  }
  .btn-secondary:hover, .btn-secondary:focus-visible{
    border-color:var(--ink);
  }

  /* ---------- Footer ---------- */
  footer{
    background:var(--navy-deep);
    color:var(--ivory-dim);
    padding:56px 32px 40px;
    text-align:center;
  }
  footer .foot-brand{
    display:flex; align-items:center; justify-content:center; gap:10px;
    margin-bottom:16px;
  }
  footer .foot-brand img{width:22px; height:22px; object-fit:contain;}
  footer .foot-brand span{font-family:var(--serif); font-size:16px;}
  footer p{font-size:12.5px; opacity:0.5; letter-spacing:0.02em;}

  
  /* ---------- Pray ---------- */
  .pray{background:var(--ivory);}
  .pray .section-head p{color:var(--ink-soft);}

  /* ---------- Prayer templates ---------- */
  .prayertemplates{
    background:var(--navy-deep);
    color:var(--ivory);
  }
  .prayertemplates .section-head p{color:var(--ivory-dim);}
  .prayertemplate{
    display:flex;
    gap:28px;
    align-items:baseline;
    padding:26px 4px;
    border-bottom:1px solid rgba(228,207,160,0.15);
    opacity:0;
    transform:translateY(14px);
    transition:opacity 0.6s ease, transform 0.6s ease;
  }
  .prayertemplate.visible{opacity:1; transform:translateY(0);}
  .prayertemplate .cnum{
    font-family:var(--serif);
    font-size:22px;
    color:var(--gold);
    min-width:32px;
    flex-shrink:0;
  }
  .prayertemplate p{
    font-family:var(--serif);
    font-weight:300;
    font-size:19px;
    line-height:1.5;
    color:var(--ivory-dim);
  }

  /* ---------- Blogs ---------- */
  .blogs{background:var(--ivory);}
  .blogs .section-head p{color:var(--ink-soft);}

  /* ---------- Responsive ---------- */
  @media (max-width:820px){
    /* Menu mobile: hiện nút hamburger, nav-links thành panel xổ xuống */
    .nav-toggle{
      display:flex; flex-direction:column; justify-content:center; gap:5px;
      width:42px; height:42px; padding:9px; background:none; border:0; cursor:pointer;
    }
    .nav-toggle span{ display:block; width:100%; height:2px; background:var(--ink); border-radius:2px; transition:transform .3s ease, opacity .2s ease; }
    header nav{ flex-wrap:wrap; }
    header nav.nav-open{ background:rgba(246,242,232,0.98); }
    .nav-links{
      display:none; flex-direction:column; align-items:stretch; width:100%; gap:0; margin-top:14px;
    }
    header nav.nav-open .nav-links{ display:flex; }
    .nav-links a{ opacity:0.9; padding:13px 4px; font-size:15px; border-top:1px solid rgba(20,27,34,0.08); }
    .nav-open .nav-toggle span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
    .nav-open .nav-toggle span:nth-child(2){ opacity:0; }
    .nav-open .nav-toggle span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

    .chapters{grid-template-columns:1fr;}
    .about-grid{grid-template-columns:1fr; gap:40px;}
    .about-visual{aspect-ratio:16/10;}
    section{padding:96px 24px;}
    .preface{padding:120px 24px;}
  }

  :focus-visible{outline:2px solid var(--gold); outline-offset:3px;}

  /* Vô hiệu hoá block-gap của Gutenberg trên landing (thiết kế gốc dùng margin riêng).
     Chỉ zero ở các CONTAINER card (không có margin riêng) để không phá margin nội bộ
     đã khai báo tường minh (vd .chapter h3, .section-head h2). */
  /* CHỈ áp dụng trên TRANG CHỦ (.home) để section full-bleed chạm nhau & thẻ không hở.
     Các trang con (blog, khấn xin) giữ block-gap bình thường → giãn cách hài hoà. */
  .home .wp-block-post-content > .alignfull,
  .home .entry-content > .alignfull,
  .home .chapters > *,
  .home .tablet > *,
  .home .about-grid > *,
  .home .hero > .wp-block-html,
  .home .chapter > *,
  .home .commandment > *,
  .home .prayertemplate > *,
  .home .application > *{
    margin-block-start:0 !important;
    margin-block-end:0 !important;
  }
  .home .chapter h3{margin-top:10px !important; margin-bottom:12px !important;}

  /* Vạch chỉ vàng trang trí chỉ ở trang chủ, ẩn ở các trang con */
  body:not(.home) .light-thread{ display:none !important; }

  /* Landing render bằng block (evx-landing): các section chạm nhau, không dính block-gap */
  .evx-landing > *{ margin-block-start:0 !important; margin-block-end:0 !important; }

  /* ---------- Giờ Kinh Riêng ---------- */
  .giokinh-back{ font-family:var(--mono); font-size:12.5px; margin-bottom:18px; }
  .giokinh-back a{ color:var(--teal); }
  .giokinh-back a:hover{ color:var(--gold); }
  .giokinh-intro{ font-size:16px; line-height:1.7; color:var(--ink-soft); margin-bottom:34px; }
  .giokinh-card{ border-bottom:1px solid rgba(20,27,34,0.1); padding:24px 0; }
  .giokinh-card .wp-block-post-title{ font-family:var(--serif); font-weight:500; font-size:22px; margin-bottom:8px; }
  .giokinh-card .wp-block-post-title a{ color:var(--ink); }
  .giokinh-card .wp-block-post-title a:hover{ color:var(--gold); }
  .giokinh-card .wp-block-post-excerpt{ font-size:14.5px; line-height:1.65; color:var(--ink-soft); }
  /* thẻ giờ kinh trên trang chủ bấm được */
  a.prayertemplate{ cursor:pointer; transition:opacity 0.6s ease, transform 0.6s ease, padding-left 0.25s ease; }
  a.prayertemplate:hover{ padding-left:8px; }
  a.prayertemplate:hover .cnum{ color:var(--gold-soft); }
  a.prayertemplate:hover p{ color:#fff; }

  /* ---------- Cột đọc căn giữa cho trang nội dung (blog, khấn xin, trang thường) ---------- */
  /* Reset *{margin:0} của landing xoá margin-auto của WP nên phải khôi phục canh giữa ở đây */
  .evx-column{
    max-width:808px;
    margin-left:auto !important;
    margin-right:auto !important;
    padding-left:24px;
    padding-right:24px;
    box-sizing:border-box;
  }

  /* Thẻ chủ đề blog trên trang chủ (bấm được → trang chuyên mục) */
  a.chapter{ cursor:pointer; }
  a.chapter:hover h3{ color:var(--gold); }
  a.chapter:hover .num{ color:var(--teal); }

  /* Lọc theo chuyên mục — dạng dropdown gọn */
  .blog-filter{
    display:flex; align-items:center; gap:12px; flex-wrap:wrap;
    margin:0 0 34px !important; padding-bottom:26px;
    border-bottom:1px solid rgba(20,27,34,0.1);
  }
  .blog-filter-label{
    font-family:var(--mono); font-size:12px; letter-spacing:0.06em; text-transform:uppercase;
    color:var(--ink-soft);
  }
  .blog-filter-select{
    font-family:var(--sans); font-size:15px; color:var(--ink);
    background-color:#fff; border:1px solid rgba(20,27,34,0.18); border-radius:10px;
    padding:11px 42px 11px 16px; cursor:pointer; min-width:230px;
    appearance:none; -webkit-appearance:none; -moz-appearance:none;
    background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'><path d='M1 1l5 5 5-5' fill='none' stroke='%234A5560' stroke-width='1.6' stroke-linecap='round'/></svg>");
    background-repeat:no-repeat; background-position:right 14px center;
    transition:border-color .2s, box-shadow .2s;
  }
  .blog-filter-select:hover{ border-color:var(--gold); }
  .blog-filter-select:focus{ outline:none; border-color:var(--gold); box-shadow:0 0 0 3px rgba(201,164,92,0.18); }

  /* Khi đăng nhập (có thanh admin) đẩy menu header xuống để không bị đè */
  .admin-bar header nav{ top:32px; }
  @media screen and (max-width:782px){ .admin-bar header nav{ top:46px; } }

  /* Phân trang */
  .evx-pagination{ margin-top:48px !important; gap:8px; align-items:center; flex-wrap:wrap; }
  .evx-pagination .wp-block-query-pagination-previous,
  .evx-pagination .wp-block-query-pagination-next,
  .evx-pagination .page-numbers{
    font-family:var(--mono); font-size:13px; color:var(--ink-soft);
    padding:8px 14px; border:1px solid rgba(20,27,34,0.15); border-radius:8px;
    text-decoration:none; transition:border-color .2s, color .2s, background .2s;
  }
  .evx-pagination .page-numbers.current{ background:var(--navy-deep); color:var(--ivory); border-color:var(--navy-deep); }
  .evx-pagination a:hover{ border-color:var(--gold); color:var(--gold); }

  /* ---------- Blog (Ghi chép) ---------- */
  .blog-single, .blog-list{max-width:808px;}
  .blog-single .wp-block-post-title,
  .blog-single h1,
  .blog-list-title{
    font-family:var(--serif); font-weight:400;
    font-size:clamp(30px,4vw,42px); line-height:1.2; color:var(--ink);
    margin-bottom:14px;
  }
  .blog-list-title{ margin-bottom:36px; padding-bottom:18px; border-bottom:1px solid rgba(20,27,34,0.12); }
  .post-meta, .blog-card .wp-block-post-date{
    font-family:var(--mono); font-size:12.5px; color:var(--ink-soft); opacity:0.85;
    display:flex; gap:16px; margin-bottom:22px;
  }
  .blog-single .wp-block-post-content p{ font-size:17px; line-height:1.85; color:var(--ink); font-weight:300; margin-bottom:20px; }
  .blog-single .wp-block-post-content h2{ font-family:var(--serif); font-size:26px; margin:28px 0 12px; }
  .blog-single .wp-block-post-content h3{ font-family:var(--serif); font-size:21px; margin:22px 0 10px; }
  .blog-card{
    border-bottom:1px solid rgba(20,27,34,0.1); padding:26px 0; margin:0;
  }
  .blog-card .wp-block-post-title{ font-family:var(--serif); font-weight:500; font-size:24px; margin-bottom:8px; }
  .blog-card .wp-block-post-title a{ color:var(--ink); }
  .blog-card .wp-block-post-title a:hover{ color:var(--gold); }
  .blog-card .wp-block-post-excerpt{ font-size:15px; line-height:1.7; color:var(--ink-soft); font-weight:300; }
  .blog-card .wp-block-post-date{ margin-bottom:10px; }

  /* Thumbnail bài viết (trang blog / chuyên mục) */
  .blog-thumb{ margin:0 0 16px !important; }
  .blog-thumb img,
  .blog-card .wp-block-post-featured-image img{ width:100%; height:auto; border-radius:12px; display:block; }

  /* Bài viết mới nhất (kèm thumbnail) trên TRANG CHỦ, mục Ghi chép */
  .blogs-latest-title{ font-family:var(--serif); font-weight:400; font-size:26px; color:var(--ink); text-align:center; margin:64px 0 30px !important; }
  .blogs-latest{ max-width:960px; margin:0 auto; }
  .blogs-latest-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
  .blogs-latest-card{ background:#fff; border:1px solid rgba(20,27,34,0.06); border-radius:14px; overflow:hidden; box-shadow:0 8px 24px rgba(10,27,46,0.06); transition:transform .2s ease, box-shadow .2s ease; }
  .blogs-latest-card:hover{ transform:translateY(-3px); box-shadow:0 16px 34px rgba(10,27,46,0.1); }
  .blogs-latest-card .wp-block-post-featured-image{ margin:0 !important; }
  .blogs-latest-card .wp-block-post-featured-image img{ width:100%; height:auto; display:block; border-radius:0; }
  .blogs-latest-card .wp-block-post-title{ font-family:var(--serif); font-weight:500; font-size:17px; line-height:1.35; margin:16px 18px 6px !important; }
  .blogs-latest-card .wp-block-post-title a{ color:var(--ink); }
  .blogs-latest-card .wp-block-post-title a:hover{ color:var(--gold); }
  .blogs-latest-card .wp-block-post-date{ font-family:var(--mono); font-size:11.5px; color:var(--ink-soft); margin:0 18px 16px !important; }
  @media (max-width:820px){ .blogs-latest-grid{ grid-template-columns:1fr; } }

  /* ---------- Bình luận (custom) ---------- */
  /* Giãn cách thoáng, hài hoà cho nội dung trang con */
  .blog-single > * + *{ margin-top:30px; }
  .blog-single .wp-block-post-content > * + *{ margin-top:22px; }
  .evx-column > .entry-content > * + *{ margin-top:28px; }
  .blog-single .post-meta{ margin-bottom:30px; }

  .wp-block-comments{ margin-top:84px; padding-top:40px; border-top:1px solid rgba(20,27,34,0.12); }
  .evx-comments-title{ font-family:var(--serif); font-weight:400; font-size:26px; color:var(--ink); margin-bottom:26px; }

  .wp-block-comment-template{ list-style:none; margin:0 0 40px; padding:0; }
  .wp-block-comment-template li{ list-style:none; }
  .comment-body{
    background:#fff; border:1px solid rgba(20,27,34,0.06); border-radius:14px;
    padding:20px 22px; margin-bottom:14px;
    box-shadow:0 6px 20px rgba(10,27,46,0.05);
  }
  .comment-head{ display:flex; gap:12px; align-items:baseline; margin-bottom:8px; }
  .comment-head .wp-block-comment-author-name{ font-family:var(--serif); font-weight:500; font-size:16px; color:var(--ink); }
  .comment-head .wp-block-comment-author-name a{ color:var(--ink); }
  .comment-head .wp-block-comment-date,
  .comment-head .wp-block-comment-date a{ font-family:var(--mono); font-size:11.5px; color:var(--ink-soft); opacity:0.85; }
  .comment-body .wp-block-comment-content p{ font-family:var(--sans); font-size:15px; line-height:1.7; color:var(--ink-soft); margin:0; }
  .comment-body .wp-block-comment-reply-link{ margin-top:10px; font-size:13px; }
  .comment-body .wp-block-comment-reply-link a{ color:var(--teal); }

  /* Form bình luận */
  .comment-respond, .wp-block-post-comments-form{ margin-top:8px; }
  .comment-reply-title{ font-family:var(--serif); font-weight:400; font-size:22px; color:var(--ink); margin-bottom:18px; }
  .comment-form{
    background:#fff; border:1px solid rgba(20,27,34,0.07); border-radius:16px;
    padding:26px 26px 22px; box-shadow:0 14px 40px rgba(10,27,46,0.06);
    display:flex; flex-direction:column; gap:14px;
  }
  .comment-form p{ margin:0; }
  .comment-form input[type="text"],
  .comment-form input[type="email"],
  .comment-form textarea{
    width:100%; box-sizing:border-box; font-family:var(--sans); font-size:15px; color:var(--ink);
    background:var(--ivory); border:1px solid rgba(20,27,34,0.12); border-radius:10px;
    padding:13px 15px; line-height:1.6; transition:border-color .2s, box-shadow .2s, background .2s;
  }
  .comment-form textarea{ resize:vertical; min-height:120px; }
  .comment-form input::placeholder, .comment-form textarea::placeholder{ color:#9aa2ad; }
  .comment-form input:focus, .comment-form textarea:focus{
    outline:none; background:#fff; border-color:var(--gold); box-shadow:0 0 0 3px rgba(201,164,92,0.18);
  }
  .comment-form .form-submit{ margin:0; }
  .comment-form .submit{
    cursor:pointer; font-family:var(--sans); font-size:14.5px; font-weight:500; letter-spacing:0.02em;
    color:var(--ivory); background:linear-gradient(135deg, var(--navy-soft), var(--navy-deep));
    border:0; border-radius:999px; padding:13px 34px; box-shadow:0 6px 18px rgba(10,27,46,0.22);
    transition:transform .18s ease, box-shadow .18s ease, background .25s ease, color .25s ease;
  }
  .comment-form .submit:hover{
    background:linear-gradient(135deg, var(--gold-soft), var(--gold)); color:var(--navy-deep);
    transform:translateY(-1px); box-shadow:0 10px 24px rgba(201,164,92,0.3);
  }

  /* ---------- Trang con (app / blog): chừa chỗ cho nav cố định ---------- */
  .page-main{padding-top:72px; background:var(--ivory);}
  .evangelux-app-frame{display:block; width:100%; border:0;}
  main .wp-block-group.page-main{min-height:60vh;}

  /* Bỏ "gạch" scroll-cue */
  .scroll-cue{ display:none !important; }

  /* ---------- Hero starfield (sao lấp lánh — giống ảnh mẫu) ---------- */
  .hero-starfield{
    position:relative;
    width:min(660px, 90vw);
    height:300px;
    margin:40px auto 0;
    overflow:hidden;
    pointer-events:none;
    /* nền tối ở giữa để sao nổi bật như ảnh chụp không gian, mờ dần ra rìa */
    background:radial-gradient(ellipse 60% 56% at 50% 50%, rgba(2,5,12,0.92) 0%, rgba(2,5,12,0.5) 40%, transparent 72%);
    -webkit-mask-image:radial-gradient(ellipse 76% 72% at 50% 50%, #000 46%, transparent 100%);
    mask-image:radial-gradient(ellipse 76% 72% at 50% 50%, #000 46%, transparent 100%);
  }
  .hs-star{
    position:absolute;
    width:2px; height:2px;
    border-radius:50%;
    background:#fff;
    opacity:.3;
    animation:hsTwinkle 3s ease-in-out infinite;
  }
  @keyframes hsTwinkle{
    0%,100%{opacity:.08; transform:scale(.6);}
    50%{opacity:1; transform:scale(1.3);}
  }
  /* Flash: sao tối phần lớn thời gian rồi lóe sáng bùng lên ngắn (lấp lánh rõ) */
  @keyframes hsFlash{
    0%, 86%, 100%{ opacity:.1; transform:scale(.55); box-shadow:none; }
    92%{ opacity:1; transform:scale(2.1); box-shadow:0 0 8px 2px rgba(255,255,255,0.9); }
    96%{ opacity:.85; transform:scale(1.25); }
  }
  .hs-star.hs-flash{ animation-name:hsFlash; }
  .hs-bright{
    position:absolute;
    width:7px; height:7px;
    transform:translate(-50%,-50%);
    border-radius:50%;
    background:radial-gradient(circle, #fff 0%, rgba(255,255,255,0.8) 22%, transparent 66%);
    animation:hsPulse 3.6s ease-in-out infinite;
  }
  .hs-bright::before, .hs-bright::after{
    content:""; position:absolute; left:50%; top:50%;
    transform:translate(-50%,-50%);
  }
  /* tia nhiễu xạ: lõi trắng nóng, chuyển sang màu sao rồi tắt dần */
  .hs-bright::before{ width:1.5px; height:82px; background:linear-gradient(to bottom, transparent, currentColor 40%, #fff 50%, currentColor 60%, transparent); }
  .hs-bright::after{ width:82px; height:1.5px; background:linear-gradient(to right, transparent, currentColor 40%, #fff 50%, currentColor 60%, transparent); }
  .hs-blue{ color:#cfe3ff; box-shadow:0 0 15px 3px rgba(150,190,255,0.75); }
  .hs-gold{ color:#ffd39a; box-shadow:0 0 20px 5px rgba(255,190,105,0.8); }
  .hs-white{ color:#ffffff; box-shadow:0 0 13px 3px rgba(255,255,255,0.7); }
  @keyframes hsPulse{
    0%,100%{opacity:.55; filter:brightness(0.8);}
    46%{opacity:.7; filter:brightness(1);}
    50%{opacity:1; filter:brightness(2.1);}   /* lóe sáng đỉnh */
    54%{opacity:.75; filter:brightness(1.1);}
  }
  @media (prefers-reduced-motion: reduce){
    .hs-star, .hs-bright{ animation:none; }
  }