/*
Theme Name: LucYenGem
Theme URI: https://lucyengem.com
Author: LucYenGem
Description: Custom theme for LucYenGem — fine gems from Luc Yen, Vietnam. Design system: Lora + Be Vietnam Pro, ink/paper/stone/carbon palette with single cobalt accent.
Version: 1.1.0
License: GNU General Public License v2 or later
Text Domain: lucyengem
*/

:root{
  --ink:#2B2B2B; --ink-soft:#6B6B66; --paper:#FFFFFF; --stone:#F6F4EF;
  --carbon:#1C1C1C; --cobalt:#0047AB; --cobalt-deep:#003580; --line:#E4E1D8;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font:400 17px/1.65 'Be Vietnam Pro',system-ui,sans-serif;color:var(--ink);background:var(--paper)}
h1,h2,h3.serif{font-family:'Lora',Georgia,serif;font-weight:400}
h1{font-size:42px;line-height:1.2}
h2{font-size:32px;line-height:1.25}
img{max-width:100%;height:auto}
a{color:var(--cobalt)}
a:hover{color:var(--cobalt-deep)}

.eyebrow{font:600 13px/1 'Be Vietnam Pro';text-transform:uppercase;letter-spacing:2px;color:var(--ink-soft);margin-bottom:14px}
.btn{display:inline-block;background:var(--carbon);color:#fff !important;font:600 12px/1 'Be Vietnam Pro';text-transform:uppercase;letter-spacing:2px;padding:16px 32px;text-decoration:none;transition:background .2s;border:none;cursor:pointer;border-radius:0}
.btn:hover{background:var(--cobalt)}
.btn-ghost{background:none;color:var(--ink) !important;border:1px solid var(--ink)}
.btn-ghost:hover{background:var(--ink);color:#fff !important}
.wrap{max-width:1200px;margin:0 auto;padding:0 24px}
.narrow{max-width:720px;margin:0 auto;padding:0 24px}
section.band{padding:96px 0}
.stone-bg{background:var(--stone)}
@media(max-width:800px){h1{font-size:32px}h2{font-size:26px}section.band{padding:64px 0}}

/* NAV */
.site-nav{border-bottom:1px solid var(--line);background:var(--paper);position:sticky;top:0;z-index:99}
.site-nav .wrap{display:flex;align-items:center;justify-content:space-between;height:64px}
.logo{font-family:'Lora',serif;font-size:22px;letter-spacing:.5px;color:var(--ink);text-decoration:none}
.logo b{font-weight:500;color:var(--cobalt)}
.site-nav ul{display:flex;gap:28px;list-style:none;flex-wrap:wrap}
.site-nav ul a{color:var(--ink);text-decoration:none;font-size:14px}
.site-nav ul a:hover{color:var(--cobalt)}
.site-nav ul .cta-link a{color:var(--cobalt);font-weight:600}

/* HERO */
.hero{position:relative;overflow:hidden;background:linear-gradient(rgba(18,18,20,.55),rgba(18,18,20,.72)),radial-gradient(80% 120% at 70% 20%,#274a72 0%,#101418 70%);color:#fff;padding:130px 0;text-align:center}
.hero-video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hero-overlay{position:absolute;inset:0;z-index:1;background:linear-gradient(rgba(18,18,20,.5),rgba(18,18,20,.68)),radial-gradient(90% 130% at 70% 15%,rgba(39,74,114,.35) 0%,rgba(16,20,24,.55) 70%)}
.hero .wrap{position:relative;z-index:2}
.hero .eyebrow{color:#e6e1d6}
.hero h1{max-width:760px;margin:0 auto 20px;color:#fff}
.hero p{max-width:560px;margin:0 auto 36px;color:#e2ded5}
.hero .cta{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}
@media (max-width:640px){.hero-video{display:none}.hero{background:linear-gradient(rgba(18,18,20,.5),rgba(18,18,20,.66)),url(/wp-content/uploads/2026/08/lucyengem-hero-poster.jpg?v=2) center/cover}}

/* TRUST BAR */
.trust{border-bottom:1px solid var(--line);padding:18px 0;text-align:center;font:600 13px/1.8 'Be Vietnam Pro';text-transform:uppercase;letter-spacing:1.5px;color:var(--ink-soft)}

/* SPLIT + COLS */
.split{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.cols3{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;margin-top:44px}
.cols3 h3{font:400 21px/1.35 'Lora',serif;margin-bottom:8px}
.cols3 h3 a{color:var(--ink);text-decoration:none}
.cols3 h3 a:hover{color:var(--cobalt)}
.cols3 p{font-size:15px;color:var(--ink-soft)}
@media(max-width:800px){.split,.cols3{grid-template-columns:1fr}}

/* NEWSLETTER / DARK */
.news{background:var(--carbon);color:#fff;text-align:center}
.news h2{color:#fff;margin-bottom:12px}
.news p{color:#b9b4a8;max-width:520px;margin:0 auto 30px}

/* FOOTER */
.site-footer{background:var(--carbon);color:#8f8b81;border-top:1px solid #333;padding:56px 0 0;font-size:14px}
.site-footer a{color:#c9c4b8;text-decoration:none}
.site-footer a:hover{color:#fff}
.fcols{display:grid;grid-template-columns:1.4fr 1.2fr 1fr 1fr;gap:40px;padding-bottom:40px}
.fcols h4{font:600 12px/1 'Be Vietnam Pro';text-transform:uppercase;letter-spacing:2px;color:#c9c4b8;margin-bottom:16px}
.fcols .flogo{font-family:'Lora',serif;font-size:22px;color:#fff;margin-bottom:12px}
.fcols .flogo b{font-weight:500;color:#6f9be0}
.fcols p,.fcols li{font-size:14px;line-height:1.8;color:#8f8b81}
.fcols ul{list-style:none}
.fbottom{border-top:1px solid #333;padding:20px 0;text-align:center;font-size:12px;color:#6e6a61}
@media(max-width:800px){.fcols{grid-template-columns:1fr 1fr}}

/* ARTICLE / CONTENT */
.entry{padding:64px 0}
.entry-header{max-width:720px;margin:0 auto 8px;padding:0 24px}
.entry-header .byline{font-size:14px;color:var(--ink-soft);font-style:italic;margin-top:14px}
.entry-content{max-width:720px;margin:0 auto;padding:0 24px}
.entry-content>*+*{margin-top:1.2em}
.entry-content h2{margin-top:2em}
.entry-content h3{font:600 20px/1.4 'Be Vietnam Pro';margin-top:1.6em}
.entry-content blockquote{border-left:3px solid var(--cobalt);padding:8px 0 8px 24px;color:var(--ink-soft);font-style:italic}
.entry-content table{width:100%;border-collapse:collapse;font-size:15px;display:block;overflow-x:auto}
.entry-content th{background:var(--stone);color:#1A1A1A;text-align:left;padding:10px 14px;border:1px solid var(--line);font-weight:600}
.entry-content td{padding:10px 14px;border:1px solid var(--line);vertical-align:top}
.entry-content code{background:var(--stone);padding:2px 6px;font-size:14px}
.entry-content img{border:1px solid var(--line)}
.entry-content .price{font:500 20px 'Lora',serif}
.author-box{max-width:720px;margin:48px auto 0;padding:28px;background:var(--stone);border:1px solid var(--line)}
.author-box p{font-size:15px}

/* BLOG LIST */
.post-card{border-bottom:1px solid var(--line);padding:36px 0}
.post-card h2 a{color:var(--ink);text-decoration:none}
.post-card h2 a:hover{color:var(--cobalt)}
.post-card .meta{font-size:13px;color:var(--ink-soft);text-transform:uppercase;letter-spacing:1.5px;margin-bottom:8px}
.post-card p{color:var(--ink-soft);margin-top:10px}