/* MyBirthSign blog landing-page redesign. Load only from blog.html; all selectors are page-scoped. */
.page-blog {
  --blog-night: #071329; --blog-panel: #0d1b35; --blog-gold: #efc66e;
  background: radial-gradient(ellipse at 50% -8%,rgba(99,68,157,.18),transparent 42rem),linear-gradient(180deg,#061126 0%,#08152b 44%,#071329 100%);
  color: #dfe6f3;
}
.page-blog header.site-header { position:sticky; top:0; z-index:60; background:rgba(5,14,31,.94); border-bottom:1px solid rgba(239,198,110,.22); backdrop-filter:blur(14px); }
.page-blog header.site-header .container { max-width:1440px; }
.page-blog header.site-header .logo-text { color:#f5d58d; }
.page-blog header.site-header nav a[aria-current="page"],.page-blog header.site-header nav a:hover,.page-blog header.site-header nav .nav-dropdown[open]>summary { color:var(--blog-gold); }

.page-blog .bv2-hero { isolation:isolate; position:relative; min-height:clamp(350px,36vw,470px); display:flex; align-items:center; justify-content:flex-start; overflow:hidden; text-align:left; padding:clamp(52px,6.5vw,88px) max(22px,calc((100vw - 1200px)/2)); border-bottom:1px solid rgba(239,198,110,.25); background:#09152b; }
.page-blog .bv2-hero-art { display:none; }
.page-blog .bv2-hero::before { content:""; position:absolute; inset:0; z-index:-2; pointer-events:none; background:linear-gradient(90deg,rgba(5,13,30,.97) 0%,rgba(5,13,30,.83) 33%,rgba(5,13,30,.38) 64%,rgba(5,13,30,.3) 100%),linear-gradient(0deg,rgba(5,13,30,.78),transparent 37%),url("../images/guides/khmer-lunar-wide.webp") center 43%/cover no-repeat; transform:scale(1.01); }
.page-blog .bv2-hero::after { content:""; position:absolute; z-index:-1; right:max(28px,calc((100vw - 1200px)/2 + 35px)); top:50%; width:clamp(230px,28vw,365px); aspect-ratio:1; transform:translateY(-50%); border:1px solid rgba(244,197,104,.72); border-radius:50%; pointer-events:none; opacity:.82; background:radial-gradient(circle,transparent 0 27%,rgba(239,198,110,.16) 27.3% 27.8%,transparent 28.1% 46%,rgba(239,198,110,.52) 46.2% 46.6%,transparent 46.9% 62%,rgba(239,198,110,.22) 62.2% 62.6%,transparent 62.9%),repeating-conic-gradient(from -15deg,rgba(239,198,110,.5) 0deg .4deg,transparent .4deg 30deg); box-shadow:0 0 0 14px rgba(239,198,110,.025),0 0 0 34px rgba(239,198,110,.025),0 0 70px rgba(239,198,110,.1); mask-image:linear-gradient(90deg,transparent,#000 24%,#000 84%,transparent); -webkit-mask-image:linear-gradient(90deg,transparent,#000 24%,#000 84%,transparent); }
.page-blog .bv2-hero-content { z-index:2; width:min(100%,640px); max-width:640px; margin:0; }
.page-blog .bv2-hero-content::before { content:"ASTROLOGY · ZODIAC · CULTURE"; display:block; margin:0 0 14px; color:var(--blog-gold); font:700 .76rem/1.4 system-ui,sans-serif; letter-spacing:.16em; }
.page-blog .bv2-hero h1 { margin:0 0 18px; color:#fff8e8; font-family:"Playfair Display",Georgia,serif; font-size:clamp(2.5rem,5vw,4.2rem); line-height:1.08; letter-spacing:-.035em; text-wrap:balance; text-shadow:0 4px 28px rgba(0,0,0,.36); }
.page-blog .bv2-hero h1::after { content:""; display:block; width:66px; height:3px; margin:19px 0 0; border-radius:4px; background:linear-gradient(90deg,#f7dfa0,#c79537); }
.page-blog .bv2-hero p { max-width:560px; margin:0 0 27px; color:#e0e4f0; font-size:clamp(1rem,1.5vw,1.15rem); line-height:1.8; text-wrap:pretty; }
.page-blog .bv2-hero-cta,.page-blog .bv2-featured-btn { display:inline-flex; align-items:center; justify-content:center; min-height:46px; border:1px solid rgba(255,255,255,.22); border-radius:999px; color:#241a07; background:linear-gradient(135deg,#ffe6a0 0%,#e1b64b 92%); box-shadow:0 8px 22px rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.42); text-decoration:none; transition:transform .18s ease,filter .18s ease,box-shadow .18s ease; }
.page-blog .bv2-hero-cta { padding:12px 28px; }
.page-blog .bv2-hero-cta:hover,.page-blog .bv2-featured:hover .bv2-featured-btn { transform:translateY(-2px); filter:brightness(1.06); }

.page-blog .ad-slot.container { max-width:1200px; margin-top:18px; margin-bottom:-14px; color:#9aa8c4; border-color:rgba(239,198,110,.12); }
.page-blog .bv2-section,.page-blog .bv2-info-section { max-width:1240px; margin:clamp(42px,5vw,68px) auto; padding-inline:clamp(16px,2.2vw,28px); }
.page-blog .bv2-section-head { align-items:end; gap:12px 24px; margin-bottom:22px; }
.page-blog .bv2-section-head h2,.page-blog .bv2-info-grid h2 { color:#f5ead0; font-family:"Playfair Display",Georgia,serif; font-size:clamp(1.55rem,2.7vw,2.05rem); line-height:1.2; letter-spacing:-.025em; text-wrap:balance; }
.page-blog .bv2-section-head h2::after { content:""; display:block; width:42px; height:2px; margin-top:11px; border-radius:4px; background:linear-gradient(90deg,var(--blog-gold),#a987d8); }
.page-blog .bv2-view-all { display:inline-flex; align-items:center; gap:7px; color:var(--blog-gold); border-bottom:1px solid rgba(239,198,110,.45); padding:5px 0; text-decoration:none; transition:color .18s ease,transform .18s ease; }
.page-blog .bv2-view-all:hover { color:#fff0c8; transform:translateX(2px); }

.page-blog .bv2-featured { grid-template-columns:minmax(210px,270px) minmax(0,1fr); gap:clamp(22px,3.6vw,42px); min-height:285px; padding:clamp(20px,3vw,34px); border:1px solid rgba(239,198,110,.28); border-radius:22px; background:radial-gradient(ellipse at 100% 0%,rgba(239,198,110,.12),transparent 47%),linear-gradient(135deg,#10213d,#0b1831 72%); box-shadow:0 18px 44px rgba(0,0,0,.22),inset 0 1px rgba(255,255,255,.04); }
.page-blog .bv2-featured:hover { transform:translateY(-3px); border-color:rgba(239,198,110,.58); box-shadow:0 23px 48px rgba(0,0,0,.3); }
.page-blog .bv2-featured::before { background:radial-gradient(circle at 100% 0%,rgba(239,198,110,.12),transparent 52%); }
.page-blog .bv2-featured-art { aspect-ratio:4/5; min-height:225px; border:1px solid rgba(239,198,110,.28); border-radius:16px; box-shadow:0 10px 26px rgba(0,0,0,.22); }
.page-blog .bv2-featured-art img { object-position:center 18%; }
.page-blog .bv2-tags { gap:7px; margin-bottom:13px; }
.page-blog .bv2-tag { padding:5px 10px; font-size:.68rem; line-height:1.3; letter-spacing:.075em; }
.page-blog .bv2-tag-new { border:1px solid rgba(239,198,110,.28); background:rgba(239,198,110,.12); color:#f4d184; }
.page-blog .bv2-tag-cat { border:1px solid rgba(177,146,228,.24); background:rgba(155,127,212,.13); color:#d7c3ff; }
.page-blog .bv2-featured h2 { color:#fff7e6; font-size:clamp(1.6rem,2.4vw,2rem); line-height:1.2; text-wrap:balance; }
.page-blog .bv2-featured p { color:#c6d1e4; line-height:1.8; }
.page-blog .bv2-featured-meta { gap:9px 17px; color:#aab9d2; }
.page-blog .bv2-featured-meta span+span::before { content:"•"; color:var(--blog-gold); margin-right:10px; }
.page-blog .bv2-featured-btn { padding:10px 21px; font-size:.9rem; }

.page-blog .bv2-guides-grid { grid-template-columns:repeat(4,minmax(0,1fr)); gap:17px; align-items:stretch; }
.page-blog .bv2-guide-card { display:flex; flex-direction:column; min-width:0; border:1px solid rgba(239,198,110,.17); border-radius:17px; background:linear-gradient(155deg,#10213d,#0b1830 85%); box-shadow:0 8px 24px rgba(0,0,0,.14),inset 0 1px rgba(255,255,255,.025); }
.page-blog .bv2-guide-card:hover { border-color:rgba(239,198,110,.58); box-shadow:0 17px 34px rgba(0,0,0,.25); }
.page-blog .bv2-guide-art { flex:none; height:clamp(125px,13vw,170px); object-position:center 35%; filter:saturate(.94) contrast(1.03); }
.page-blog .bv2-guide-body { display:flex; flex:1; flex-direction:column; align-items:flex-start; padding:17px 17px 19px; }
.page-blog .bv2-guide-body h3 { min-height:2.5em; margin-bottom:7px; color:#fff2d4; font-size:1.02rem; line-height:1.35; text-wrap:balance; }
.page-blog .bv2-guide-body p { flex:1; color:#c1cce0; font-size:.9rem; line-height:1.7; }
.page-blog .bv2-guide-link { color:var(--blog-gold); margin-top:6px; }

.page-blog .bv2-zodiac-grid { grid-template-columns:repeat(6,minmax(0,1fr)); gap:12px; }
.page-blog .bv2-zodiac-card { min-width:0; padding:16px 10px 15px; border:1px solid rgba(239,198,110,.22); border-radius:14px; background:linear-gradient(180deg,rgba(15,31,56,.98),rgba(8,21,42,.98)); box-shadow:inset 0 1px rgba(255,255,255,.025); }
.page-blog .bv2-zodiac-card:hover { border-color:rgba(239,198,110,.72); box-shadow:0 10px 24px rgba(0,0,0,.22); }
.page-blog .bv2-zodiac-img { width:clamp(58px,6vw,88px); height:clamp(58px,6vw,88px); margin-bottom:8px; filter:drop-shadow(0 3px 7px rgba(0,0,0,.35)); }
.page-blog .bv2-zodiac-card h3 { color:#fff2d4; font-size:.98rem; }
.page-blog .bv2-zodiac-khmer { color:var(--blog-gold); }
.page-blog .bv2-zodiac-card p.bv2-zodiac-trait { min-height:2.7em; color:#adbbd3; font-size:.78rem; line-height:1.55; }
.page-blog .bv2-zodiac-explore { color:var(--blog-gold); }

.page-blog .bv2-latest-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:17px; }
.page-blog .bv2-latest-card { display:flex; min-width:0; flex-direction:column; overflow:hidden; border:1px solid rgba(239,198,110,.17); border-radius:16px; background:linear-gradient(160deg,#10213d,#09172e); color:inherit; text-decoration:none; box-shadow:0 8px 22px rgba(0,0,0,.13); transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease; }
.page-blog .bv2-latest-card:hover { transform:translateY(-4px); border-color:rgba(239,198,110,.58); box-shadow:0 17px 32px rgba(0,0,0,.25); }
.page-blog .bv2-latest-card img { display:block; width:100%; height:138px; object-fit:cover; object-position:center 38%; }
.page-blog .bv2-latest-body { display:flex; flex:1; flex-direction:column; padding:16px 17px 18px; }
.page-blog .bv2-latest-kicker { margin:0 0 6px; color:var(--blog-gold); font:700 .67rem/1.4 system-ui,sans-serif; letter-spacing:.1em; text-transform:uppercase; }
.page-blog .bv2-latest-card h3 { margin:0 0 8px; color:#fff2d4; font:700 1.02rem/1.38 "Playfair Display",Georgia,serif; }
.page-blog .bv2-latest-card p { flex:1; margin:0 0 12px; color:#bcc9de; font-size:.88rem; line-height:1.65; }
.page-blog .bv2-latest-read { color:var(--blog-gold); font-size:.86rem; font-weight:700; }

.page-blog .bv2-info-grid { gap:clamp(24px,4vw,44px); border:1px solid rgba(239,198,110,.2); border-radius:22px; background:linear-gradient(145deg,#10213c,#0a172e); padding:clamp(24px,4vw,44px); box-shadow:0 16px 36px rgba(0,0,0,.16); }
.page-blog .bv2-info-grid h2 { color:#fff2d4; }
.page-blog .bv2-info-grid p,.page-blog .bv2-info-grid ul { color:#bfcbdf; }
.page-blog .bv2-info-btn { border-color:var(--blog-gold); color:#fff0c8; }
.page-blog .bv2-info-btn:hover { color:#211706; background:var(--blog-gold); }
.page-blog :is(.bv2-hero-cta,.bv2-featured,.bv2-guide-card,.bv2-zodiac-card,.bv2-view-all,.bv2-info-btn,.bv2-latest-card):focus-visible { outline:3px solid #ffe6a0; outline-offset:4px; }
html[lang="km"] .page-blog .bv2-hero h1,html[lang="km"] .page-blog .bv2-section-head h2,html[lang="km"] .page-blog .bv2-featured h2,html[lang="km"] .page-blog .bv2-guide-body h3,html[lang="km"] .page-blog .bv2-latest-card h3 { line-height:1.6; }
html[lang="km"] .page-blog .bv2-hero-content::before { letter-spacing:.04em; }
html[lang="zh-Hans"] .page-blog .bv2-hero h1,html[lang="zh-Hans"] .page-blog .bv2-section-head h2 { letter-spacing:0; }

@media(max-width:1000px) {
 .page-blog .bv2-guides-grid,.page-blog .bv2-latest-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
 .page-blog .bv2-zodiac-grid { grid-template-columns:repeat(4,minmax(0,1fr)); }
 .page-blog .bv2-hero::after { right:2.5vw; opacity:.46; }
 .page-blog .bv2-hero-content { max-width:590px; }
}
@media(max-width:640px) {
 .page-blog .bv2-hero { min-height:340px; padding:52px 21px 48px; }
 .page-blog .bv2-hero::before { background:linear-gradient(90deg,rgba(5,13,30,.94),rgba(5,13,30,.68)),linear-gradient(0deg,rgba(5,13,30,.75),transparent 55%),url("../images/guides/khmer-lunar-wide.webp") 58% center/cover no-repeat; }
 .page-blog .bv2-hero::after { display:none; }
 .page-blog .bv2-hero-content::before { font-size:.67rem; letter-spacing:.11em; }
 .page-blog .bv2-hero h1 { font-size:clamp(2.25rem,10vw,3rem); }
 .page-blog .bv2-hero p { max-width:37ch; font-size:.99rem; }
 .page-blog .bv2-section,.page-blog .bv2-info-section { margin:42px auto; padding-inline:15px; }
 .page-blog .bv2-section-head { align-items:start; }
 .page-blog .bv2-section-head h2 { font-size:1.5rem; }
 .page-blog .bv2-featured { grid-template-columns:1fr; gap:18px; padding:18px; }
 .page-blog .bv2-featured-art { aspect-ratio:16/9; min-height:0; }
 .page-blog .bv2-guides-grid,.page-blog .bv2-latest-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
 .page-blog .bv2-guide-art { height:116px; }
 .page-blog .bv2-guide-body,.page-blog .bv2-latest-body { padding:13px 13px 15px; }
 .page-blog .bv2-guide-body h3 { min-height:0; font-size:.98rem; }
 .page-blog .bv2-guide-body p,.page-blog .bv2-latest-card p { font-size:.83rem; }
 .page-blog .bv2-latest-card img { height:105px; }
 .page-blog .bv2-latest-card h3 { font-size:.96rem; }
 .page-blog .bv2-zodiac-grid { grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }
 .page-blog .bv2-zodiac-card { padding:12px 7px; }
 .page-blog .bv2-zodiac-img { width:62px; height:62px; }
 .page-blog .bv2-zodiac-card p.bv2-zodiac-trait { font-size:.73rem; }
 .page-blog .bv2-info-grid { padding:23px 19px; }
}
@media(max-width:360px) {
 .page-blog .bv2-hero { padding-inline:16px; }
 .page-blog .bv2-guides-grid,.page-blog .bv2-latest-grid { gap:9px; }
 .page-blog .bv2-guide-body,.page-blog .bv2-latest-body { padding-inline:10px; }
 .page-blog .bv2-zodiac-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}
@media(prefers-reduced-motion:reduce) {
 .page-blog *, .page-blog *::before, .page-blog *::after { scroll-behavior:auto!important; transition-duration:.01ms!important; animation-duration:.01ms!important; animation-iteration-count:1!important; }
}


/* Popular Guides carousel: horizontal cards with working, accessible controls. */
.page-blog .bv2-guide-carousel-controls{display:inline-flex;align-items:center;gap:8px;margin-left:8px}
.page-blog .bv2-guide-arrow{display:inline-grid;place-items:center;width:40px;height:40px;padding:0;border:1px solid rgba(239,198,110,.48);border-radius:50%;background:linear-gradient(145deg,#122441,#0a172e);color:#f4d184;cursor:pointer;box-shadow:0 4px 12px rgba(0,0,0,.18);transition:transform .18s ease,background .18s ease,border-color .18s ease,opacity .18s ease}
.page-blog .bv2-guide-arrow:hover:not(:disabled){transform:translateY(-2px);background:#1b2d4b;border-color:#f4d184}
.page-blog .bv2-guide-arrow:focus-visible{outline:3px solid #ffe6a0;outline-offset:3px}
.page-blog .bv2-guide-arrow:disabled{cursor:default;opacity:.35;box-shadow:none}
.page-blog .bv2-guides-slider-track{display:flex;align-items:stretch;gap:17px;overflow-x:auto;overflow-y:hidden;padding:4px 3px 18px;margin:0 0 -4px;scroll-snap-type:x mandatory;scroll-padding-inline:3px;overscroll-behavior-x:contain;scrollbar-width:thin;scrollbar-color:rgba(239,198,110,.5) rgba(255,255,255,.06);-webkit-overflow-scrolling:touch}
.page-blog .bv2-guides-slider-track::-webkit-scrollbar{height:7px}
.page-blog .bv2-guides-slider-track::-webkit-scrollbar-track{background:rgba(255,255,255,.055);border-radius:9px}
.page-blog .bv2-guides-slider-track::-webkit-scrollbar-thumb{background:rgba(239,198,110,.48);border-radius:9px}
.page-blog .bv2-guides-slider-track .bv2-guide-card,.page-blog .bv2-guides-slider-track .bv2-guide-card.bv2-guide-wide{display:flex;flex:0 0 clamp(250px,26vw,310px);flex-direction:column;min-width:0;width:auto;grid-column:auto;align-self:stretch;scroll-snap-align:start;scroll-snap-stop:normal}
.page-blog .bv2-guides-slider-track .bv2-guide-card.bv2-guide-wide .bv2-guide-art{display:block;flex:none;width:100%;height:152px;min-height:0;max-height:none;aspect-ratio:16/9;object-fit:cover;object-position:center 38%}
.page-blog .bv2-guides-slider-track .bv2-guide-body{display:flex;flex:1;flex-direction:column;align-items:flex-start}
.page-blog .bv2-guides-slider-track .bv2-guide-body h3{min-height:0}
.page-blog .bv2-guides-slider-track .bv2-guide-body p{flex:1}
.page-blog .bv2-guides-slider-track .bv2-guide-link{margin-top:auto;padding-top:10px}
@media(max-width:700px){
 .page-blog .bv2-guides-slider-track{gap:13px;padding-bottom:16px}
 .page-blog .bv2-guides-slider-track .bv2-guide-card,.page-blog .bv2-guides-slider-track .bv2-guide-card.bv2-guide-wide{flex-basis:min(82vw,310px)}
 .page-blog .bv2-guides-slider-track .bv2-guide-card.bv2-guide-wide .bv2-guide-art{height:148px}
 .page-blog .bv2-guide-carousel-controls{gap:6px;margin-left:0}
 .page-blog .bv2-guide-arrow{width:36px;height:36px}
 .page-blog #guides .bv2-section-head,.page-blog #guides-km .bv2-section-head,.page-blog #guides-zh .bv2-section-head{flex-wrap:wrap}
}
@media(prefers-reduced-motion:reduce){.page-blog .bv2-guide-arrow{transition:none}}
