@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,600;0,9..144,700;1,9..144,400&family=Outfit:wght@300;400;500;600;700&display=swap');

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:'Outfit',sans-serif;background:#fdfcfb;color:#18181b;font-size:16px;line-height:1.75}
a{color:#92400e;text-decoration:none}
a:hover{color:#b45309;text-decoration:underline}
img{max-width:100%;height:auto;display:block}

/* HEADER */
.site-header{background:#18181b;position:sticky;top:0;z-index:100}
.hdr{max-width:1160px;margin:0 auto;padding:0 24px;display:flex;align-items:center;justify-content:space-between;height:58px}
.brand{font-family:'Fraunces',serif;font-size:1.55rem;font-weight:700;color:#fdfcfb;letter-spacing:-.01em}
.brand em{color:#f59e0b;font-style:normal}
.nav-links{display:flex;gap:2px;list-style:none}
.nav-links a{font-size:.78rem;font-weight:500;color:rgba(253,252,251,.65);padding:6px 16px;border-radius:30px;letter-spacing:.03em;transition:background .18s,color .18s}
.nav-links a:hover{background:rgba(255,255,255,.1);color:#fdfcfb;text-decoration:none}
.hamburger{display:none;background:none;border:none;color:#fdfcfb;font-size:1.4rem;cursor:pointer}

/* BANNER */
.banner{background:#fdfcfb;border-bottom:1px solid #f3ede4;padding:12px 0}
.banner-inner{max-width:1160px;margin:0 auto;padding:0 24px;display:flex;justify-content:space-between;align-items:center;font-size:.76rem;color:#78716c}
.banner-links{display:flex;gap:18px}
.banner-links a{color:#78716c;font-size:.76rem}
.banner-links a:hover{color:#b45309}

/* FEATURED / HERO */
.featured{max-width:1160px;margin:0 auto;padding:48px 24px 0}
.featured-card{display:grid;grid-template-columns:1fr 1fr;gap:0;background:#18181b;border-radius:10px;overflow:hidden}
.fc-img{position:relative;min-height:380px}
.fc-img img{width:100%;height:100%;object-fit:cover}
.fc-badge{position:absolute;top:18px;left:18px;background:#b45309;color:#fff;font-size:.65rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;padding:4px 12px;border-radius:20px}
.fc-body{padding:48px 44px;display:flex;flex-direction:column;justify-content:center}
.fc-cat{font-size:.68rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:#f59e0b;margin-bottom:14px}
.fc-title{font-family:'Fraunces',serif;font-size:2rem;font-weight:700;line-height:1.2;color:#fdfcfb;margin-bottom:16px}
.fc-desc{font-size:.92rem;color:rgba(253,252,251,.7);line-height:1.7;margin-bottom:20px}
.fc-meta{font-size:.74rem;color:rgba(253,252,251,.4);margin-bottom:24px}
.btn-featured{display:inline-block;background:#b45309;color:#fff;font-size:.82rem;font-weight:600;padding:12px 26px;border-radius:6px;transition:background .2s}
.btn-featured:hover{background:#92400e;color:#fff;text-decoration:none}

/* CARD GRID */
.grid-section{max-width:1160px;margin:0 auto;padding:52px 24px 64px}
.grid-label{font-size:.7rem;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:#a8a29e;margin-bottom:28px;display:flex;align-items:center;gap:12px}
.grid-label::after{content:'';flex:1;height:1px;background:#e7e5e4}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.card{background:#fff;border-radius:8px;border:1px solid #f3ede4;overflow:hidden;transition:box-shadow .22s,transform .22s}
.card:hover{box-shadow:0 6px 28px rgba(180,83,9,.1);transform:translateY(-3px)}
.c-img{aspect-ratio:16/9;overflow:hidden}
.c-img img{width:100%;height:100%;object-fit:cover;transition:transform .35s}
.card:hover .c-img img{transform:scale(1.05)}
.c-body{padding:20px 22px}
.c-cat{font-size:.66rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#b45309;margin-bottom:9px}
.c-title{font-family:'Fraunces',serif;font-size:1.08rem;font-weight:600;line-height:1.3;margin-bottom:9px;color:#18181b}
.c-title a{color:inherit}
.c-title a:hover{color:#b45309;text-decoration:none}
.c-excerpt{font-size:.84rem;color:#78716c;line-height:1.6;margin-bottom:12px}
.c-meta{font-size:.72rem;color:#a8a29e}

/* ARTICLE */
.art-container{max-width:780px;margin:0 auto;padding:52px 24px 80px}
.art-cat{font-size:.66rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#b45309;margin-bottom:12px}
.art-h1{font-family:'Fraunces',serif;font-size:2.1rem;font-weight:700;line-height:1.2;color:#18181b;margin-bottom:16px}
.art-meta{font-size:.79rem;color:#a8a29e;padding-bottom:18px;border-bottom:1px solid #f3ede4;margin-bottom:24px}
.art-meta strong{color:#57534e}

/* Stars */
.star-display{display:flex;align-items:center;gap:12px;margin:16px 0 26px;padding:16px 20px;background:#fffbf5;border:1px solid #fde68a;border-radius:8px}
.star-display .stars{font-size:1.3rem;color:#d97706}
.star-display .score{font-family:'Fraunces',serif;font-size:1.5rem;font-weight:700;color:#18181b}
.star-display .score-label{font-size:.8rem;color:#78716c}

/* Disclosure */
.disc{background:#fffbf5;border-left:3px solid #f59e0b;padding:12px 18px;border-radius:0 6px 6px 0;font-size:.8rem;color:#78350f;line-height:1.6;margin-bottom:26px}
.disc strong{color:#18181b}
.fda{background:#fafaf9;border:1px solid #f3ede4;border-radius:6px;padding:12px 18px;font-size:.76rem;color:#a8a29e;line-height:1.6;font-style:italic;margin:28px 0}

/* Hero image */
.art-hero{border-radius:8px;overflow:hidden;margin-bottom:30px}
.art-hero img{width:100%}

/* Body */
.art-body{font-size:1rem;line-height:1.85;color:#18181b}
.art-body h2{font-family:'Fraunces',serif;font-size:1.55rem;font-weight:700;margin:40px 0 14px;color:#18181b}
.art-body h3{font-family:'Fraunces',serif;font-size:1.12rem;font-style:italic;margin:26px 0 10px;color:#3f3f46}
.art-body p{margin-bottom:20px;color:#3f3f46}
.art-body ul,.art-body ol{margin:0 0 20px 24px}
.art-body li{margin-bottom:8px;color:#3f3f46}
.art-body strong{color:#18181b}
.art-body blockquote{border-left:3px solid #f59e0b;background:#fffbf5;padding:16px 22px;margin:28px 0;border-radius:0 6px 6px 0}
.art-body blockquote p{font-family:'Fraunces',serif;font-size:1.1rem;font-style:italic;color:#18181b;margin:0}

/* Inline figure */
.ifig{margin:30px 0;border-radius:8px;overflow:hidden}
.ifig img{width:100%}
.ifig figcaption{font-size:.73rem;color:#a8a29e;margin-top:6px;text-align:center;font-style:italic}

/* Pros / cons */
.pcgrid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:30px 0}
.pcbox{padding:20px 22px;border-radius:8px;background:#fff;border:1px solid #f3ede4}
.pcbox.pro{border-top:3px solid #16a34a}
.pcbox.con{border-top:3px solid #dc2626}
.pcbox h4{font-size:.7rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;margin-bottom:12px}
.pcbox.pro h4{color:#16a34a}
.pcbox.con h4{color:#dc2626}
.pclist{list-style:none;padding:0}
.pclist li{font-size:.86rem;padding:5px 0 5px 20px;position:relative;border-bottom:1px solid #f9f5f0;line-height:1.5;color:#3f3f46}
.pclist li:last-child{border-bottom:none}
.pcbox.pro .pclist li::before{content:'✓';position:absolute;left:0;color:#16a34a;font-weight:700}
.pcbox.con .pclist li::before{content:'—';position:absolute;left:0;color:#dc2626;font-weight:700}

/* Testimonials */
.tbox{margin:30px 0;display:flex;flex-direction:column;gap:14px}
.tcard{background:#fff;border:1px solid #f3ede4;border-radius:8px;padding:18px 22px}
.tcard .ts{color:#d97706;font-size:.88rem;margin-bottom:6px}
.tcard p{font-size:.89rem;color:#3f3f46;line-height:1.65;margin-bottom:6px}
.tcard .tw{font-size:.74rem;color:#a8a29e}

/* CTA */
.cta-strip{background:#18181b;border-radius:10px;padding:40px 44px;text-align:center;margin:44px 0}
.cta-strip h3{font-family:'Fraunces',serif;font-size:1.65rem;color:#fdfcfb;margin-bottom:10px}
.cta-strip p{font-size:.9rem;color:rgba(253,252,251,.65);margin-bottom:24px;line-height:1.65}
.btn-cta{display:inline-block;background:#b45309;color:#fff;font-size:.86rem;font-weight:600;padding:14px 38px;border-radius:6px;letter-spacing:.03em;transition:background .2s}
.btn-cta:hover{background:#92400e;color:#fff;text-decoration:none}
.cta-note{font-size:.72rem;color:rgba(253,252,251,.3);margin-top:12px}

/* Static */
.static-pg{max-width:740px;margin:0 auto;padding:56px 24px 80px}
.static-pg h1{font-family:'Fraunces',serif;font-size:2rem;font-weight:700;margin-bottom:8px}
.pg-date{font-size:.78rem;color:#a8a29e;display:block;margin-bottom:30px;padding-bottom:18px;border-bottom:1px solid #f3ede4}
.static-pg h2{font-family:'Fraunces',serif;font-size:1.2rem;font-weight:600;margin:28px 0 10px;color:#18181b}
.static-pg p{font-size:.95rem;line-height:1.8;color:#3f3f46;margin-bottom:14px}

/* FOOTER */
.site-footer{background:#18181b;color:rgba(253,252,251,.55);padding:52px 24px 0;margin-top:24px}
.footer-wrap{max-width:1160px;margin:0 auto;display:grid;grid-template-columns:1.8fr 1fr;gap:72px;padding-bottom:44px;border-bottom:1px solid rgba(253,252,251,.08)}
.fb .brand{color:#fdfcfb;display:block;margin-bottom:12px}
.fb p{font-size:.81rem;line-height:1.7;color:rgba(253,252,251,.45)}
.fc-col h4{font-size:.68rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:rgba(253,252,251,.3);margin-bottom:14px}
.fc-col ul{list-style:none}
.fc-col li{margin-bottom:8px}
.fc-col a{font-size:.82rem;color:rgba(253,252,251,.5)}
.fc-col a:hover{color:#fdfcfb}
.footer-base{max-width:1160px;margin:0 auto;padding:16px 0;display:flex;justify-content:space-between;font-size:.73rem;color:rgba(253,252,251,.25)}

@media(max-width:860px){
  .featured-card{grid-template-columns:1fr}
  .fc-img{min-height:240px}
  .cards{grid-template-columns:1fr 1fr}
  .footer-wrap{grid-template-columns:1fr}
}
@media(max-width:580px){
  .cards{grid-template-columns:1fr}
  .pcgrid{grid-template-columns:1fr}
  .art-h1{font-size:1.65rem}
  .fc-body{padding:28px 24px}
  .fc-title{font-size:1.5rem}
  .nav-links{display:none}
  .nav-links.open{display:flex;flex-direction:column;position:absolute;top:58px;left:0;right:0;background:#18181b;padding:16px 24px;gap:4px;border-top:1px solid rgba(255,255,255,.08)}
  .hamburger{display:block}
}