/*
Theme Name: LateStarterFIRE
Theme URI: https://latestarterfire.page
Author: LateStarterFIRE
Description: Tema editorial untuk LateStarterFIRE — panduan FIRE (Financial Independence, Retire Early) untuk Indonesia. Hasil porting desain editorial (Newsreader + Figtree) menjadi tema dinamis yang membaca artikel langsung dari database WordPress.
Version: 1.0.3
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: latestarterfire
*/

:root{
  --green-900:#1E332A; --green-800:#2C4A3B; --green-600:#3E6B52;
  --sage:#9CB29E; --clay:#C97B4A; --clay-dark:#9C5A33;
  --paper:#F6F1E7; --paper-2:#EDE6D5; --card:#FCFAF4;
  --border:#E6DECB; --line:#DED6C4;
  --ink:#283228; --muted:#52594F; --muted-2:#6B7268;
}

*{ box-sizing:border-box; }
html{ -webkit-text-size-adjust:100%; }
body{ margin:0; background:var(--paper); color:var(--ink); font-family:'Figtree',sans-serif; }
::selection{ background:var(--clay); color:#fff; }
img{ max-width:100%; }
a{ color:inherit; text-decoration:none; }
a:hover{ text-decoration:underline; }

/* range slider (kalkulator) */
input[type=range]{ -webkit-appearance:none; appearance:none; width:100%; height:6px; border-radius:99px; background:#E0D8C5; outline:none; }
input[type=range]::-webkit-slider-thumb{ -webkit-appearance:none; appearance:none; width:22px; height:22px; border-radius:50%; background:var(--green-800); border:3px solid var(--paper); box-shadow:0 1px 4px rgba(0,0,0,.25); cursor:pointer; }
input[type=range]::-moz-range-thumb{ width:18px; height:18px; border-radius:50%; background:var(--green-800); border:3px solid var(--paper); cursor:pointer; }

/* layout grids (kept here so media queries can collapse them on mobile) */
.lsf-nav-links{ display:flex; align-items:center; gap:30px; flex-wrap:wrap; }
.lsf-hero{ display:grid; grid-template-columns:1.15fr .85fr; gap:56px; align-items:center; }
.lsf-trust{ display:grid; grid-template-columns:repeat(3,1fr); }
.lsf-pillars{ display:grid; grid-template-columns:repeat(3,1fr); gap:48px; }
.lsf-why{ display:grid; grid-template-columns:1fr 1fr; gap:56px; }
.lsf-cta-grid{ display:grid; grid-template-columns:1.2fr .8fr; gap:48px; align-items:center; }
.lsf-grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:28px; }
.lsf-featured-grid{ display:grid; grid-template-columns:1fr 1fr; }
.lsf-calc{ display:grid; grid-template-columns:.95fr 1.05fr; gap:36px; align-items:start; }
.lsf-foot-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:40px; }

/* article card thumbnail: keep fixed aspect whether image or gradient placeholder */
.lsf-thumb{ display:block; height:160px; overflow:hidden; }
.lsf-thumb img{ width:100%; height:100%; object-fit:cover; display:block; }
.lsf-featured-img{ min-height:360px; }
.lsf-featured-img img{ width:100%; height:auto; max-height:440px; object-fit:contain; display:block; }
.lsf-single-img img{ width:100%; height:auto; border-radius:18px; margin:0 0 24px; display:block; }

/* WP nav menu reset so it matches the inline-styled nav */
.lsf-nav-links ul{ list-style:none; margin:0; padding:0; display:flex; align-items:center; gap:30px; flex-wrap:wrap; }
.lsf-nav-links a{ color:#3E4A40; font-weight:500; }
.lsf-nav-links .current-menu-item > a,
.lsf-nav-links a:hover{ color:var(--clay); text-decoration:none; }

/* the_content typography on single posts */
.lsf-prose{ font-size:18px; line-height:1.75; color:#3a4239; }
.lsf-prose h2{ font-family:'Newsreader',serif; font-weight:500; font-size:30px; margin:38px 0 12px; }
.lsf-prose h3{ font-family:'Newsreader',serif; font-weight:500; font-size:24px; margin:30px 0 10px; }
.lsf-prose p{ margin:0 0 18px; }
.lsf-prose a{ color:var(--green-600); text-decoration:underline; }
.lsf-prose img{ border-radius:14px; height:auto; }
.lsf-prose ul,.lsf-prose ol{ margin:0 0 18px; padding-left:22px; }
.lsf-prose li{ margin:6px 0; }
.lsf-prose blockquote{ border-left:3px solid var(--clay); margin:22px 0; padding:6px 0 6px 22px; font-family:'Newsreader',serif; font-style:italic; font-size:21px; color:var(--green-800); }
.lsf-prose table{ width:100%; border-collapse:collapse; margin:18px 0; }
.lsf-prose th,.lsf-prose td{ border:1px solid var(--border); padding:10px 12px; text-align:left; }

/* pagination */
.lsf-pagination{ display:flex; gap:8px; flex-wrap:wrap; margin:48px 0 0; }
.lsf-pagination .page-numbers{ padding:9px 15px; border:1px solid var(--border); border-radius:10px; background:var(--card); color:var(--green-800); font-weight:600; }
.lsf-pagination .page-numbers.current{ background:var(--green-800); color:var(--paper); border-color:var(--green-800); }

@media (max-width:900px){
  .lsf-hero,.lsf-why,.lsf-cta-grid,.lsf-featured-grid,.lsf-calc{ grid-template-columns:1fr !important; gap:32px; }
  .lsf-pillars,.lsf-grid-3{ grid-template-columns:1fr 1fr !important; gap:24px; }
  .lsf-trust,.lsf-foot-grid{ grid-template-columns:1fr !important; gap:0; }
  .lsf-hero h1{ font-size:44px !important; }
}
@media (max-width:620px){
  .lsf-pillars,.lsf-grid-3{ grid-template-columns:1fr !important; }
  .lsf-nav-links{ gap:16px; }
  .lsf-hero h1{ font-size:36px !important; }
  h1{ font-size:38px !important; }
}