/* matteregnerkalkulator.com — Apple-style white theme (one theme only) */
:root{
  --bg:           #ffffff;
  --bg-alt:       #f5f5f7;        /* Apple light gray panels */
  --text:         #1d1d1f;        /* Apple text — near-black */
  --muted:        #6e6e73;        /* Apple secondary text */
  --border:       #d2d2d7;        /* Apple border */
  --border-soft:  #e8e8ed;
  --card:         #ffffff;
  --card-alt:     #fbfbfd;
  --lime:         #84cc16;
  --lime2:        #65a30d;
  --accent:       #65a30d;
  --shadow:       0 1px 2px rgba(0,0,0,.04), 0 4px 12px rgba(0,0,0,.04);
  --shadow-hover: 0 4px 16px rgba(0,0,0,.08);
  --radius-sm:    8px;
  --radius:       14px;
  --radius-lg:    18px;
  --radius-xl:    22px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: -apple-system, BlinkMacSystemFont, "SF Pro Display", "SF Pro Text", "Segoe UI", system-ui, Roboto, Helvetica, Arial, sans-serif;
  background:var(--bg);
  color:var(--text);
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  letter-spacing:-0.01em;
}
a{color:var(--accent); text-decoration:none}
a:hover{text-decoration:underline}

.container{max-width:1024px; margin:0 auto; padding:0 20px}
.page{padding:34px 0}

/* Nav — Apple translucent style */
.site-nav, .site-chrome-nav{
  position:sticky; top:0; z-index:50;
  background:rgba(255,255,255,.80);
  backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  border-bottom:1px solid var(--border-soft);
}
.nav-inner{display:flex; align-items:center; justify-content:space-between; padding:10px 0; gap:14px}
.brand{display:flex; align-items:center; gap:10px; font-weight:700; letter-spacing:-0.025em; color:var(--text)}
.brand:hover{text-decoration:none}
.brand .logo{width:34px; height:34px; display:grid; place-items:center; background:var(--accent); border-radius:9px}
.brand-text{font-size:17px}
.brand-accent{color:var(--accent); font-weight:700}
.nav-links{display:none; gap:28px; font-weight:500; font-size:14px}
.nav-links a{color:var(--text); transition:opacity .15s}
.nav-links a:hover{opacity:.6; text-decoration:none}
@media (min-width:768px){ .nav-links{display:flex} }
.mobile-menu-btn{width:38px; height:38px; border-radius:10px; border:0; background:transparent; cursor:pointer; color:var(--text); display:inline-flex; align-items:center; justify-content:center}
.mobile-menu-btn:hover{background:var(--bg-alt)}
@media (min-width:768px){ .mobile-menu-btn{display:none} }
.mobile-nav{display:none; flex-direction:column; padding:8px 20px 16px; border-top:1px solid var(--border-soft); background:#fff}
.mobile-nav a{padding:11px 0; font-weight:500; color:var(--text); border-bottom:1px solid var(--border-soft)}
.mobile-nav.open{display:flex}

/* Cards — Apple style: white, subtle border + soft shadow */
.card{background:var(--card); border:1px solid var(--border-soft); border-radius:var(--radius-lg); box-shadow:var(--shadow)}
.card-pad{padding:22px}
.panel{background:var(--bg-alt); border:1px solid var(--border-soft); border-radius:var(--radius); padding:18px; position:relative; overflow:hidden}

/* Buttons — Apple pill style */
.btn{
  border:1px solid var(--border); background:transparent; color:var(--text);
  border-radius:980px; padding:11px 22px; font-weight:500; font-size:15px;
  cursor:pointer; user-select:none; transition: all .15s ease;
  -webkit-appearance:none; font-family:inherit;
}
.btn:active{transform:scale(.98)}
.btn:hover{background:var(--bg-alt)}
.btn-primary{
  background:var(--accent); border-color:var(--accent); color:#fff;
}
.btn-primary:hover{background:#5b9d0a; border-color:#5b9d0a; color:#fff}
.btn-soft{background:var(--bg-alt); border-color:transparent}

/* Footer — Apple style, clean */
.site-footer, .site-chrome-footer{
  border-top:1px solid var(--border-soft); margin-top:60px; padding:36px 0;
  color:var(--muted); font-size:13px; background:var(--bg-alt);
}
.site-footer .container, .site-chrome-footer .container{max-width:1024px; margin:0 auto; padding:0 20px}
.footer-grid{display:grid; gap:28px; grid-template-columns:1fr}
@media(min-width:640px){ .footer-grid{grid-template-columns:1fr 1fr} }
@media(min-width:1024px){ .footer-grid{grid-template-columns:1.6fr 1fr 1fr 1fr} }
.site-footer h3, .site-chrome-footer h3{
  margin:0 0 10px 0; font-weight:600; color:var(--text); font-size:14px; letter-spacing:-0.01em;
}
.site-footer p, .site-chrome-footer p{line-height:1.6; margin:0; font-size:13px}
.site-footer ul, .site-chrome-footer ul{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:7px}
.site-footer a, .site-chrome-footer a{color:var(--muted); font-size:13px}
.site-footer a:hover, .site-chrome-footer a:hover{color:var(--text); text-decoration:underline}
.footer-bottom{text-align:center; margin-top:22px; padding-top:20px; border-top:1px solid var(--border-soft); color:var(--muted); font-size:12px}

/* Progress bar */
.progress, .site-chrome-progress{height:3px; position:fixed; top:0; left:0; z-index:9999; background:var(--accent); width:0%; transition:width .08s ease}

/* Toast */
.toast{position:fixed; left:50%; bottom:24px; transform:translateX(-50%); background:#1d1d1f; color:#fff; padding:10px 18px; border-radius:980px; font-weight:500; font-size:13px; opacity:0; transition:opacity .2s ease; z-index:10000; pointer-events:none}

/* Blog cards */
.blog-grid{display:grid; gap:18px; grid-template-columns:1fr}
@media (min-width:768px){ .blog-grid{grid-template-columns:repeat(2, 1fr)} }
@media (min-width:1024px){ .blog-grid{grid-template-columns:repeat(3, 1fr)} }
.post-card{display:flex; flex-direction:column; background:var(--card); border:1px solid var(--border-soft); border-radius:var(--radius-lg); overflow:hidden; transition:transform .2s ease, box-shadow .2s ease}
.post-card:hover{transform:translateY(-2px); box-shadow:var(--shadow-hover); text-decoration:none}
.post-card img{width:100%; aspect-ratio:16/9; object-fit:cover; background:#f5f5f7}
.post-card .post-body{padding:18px}
.post-card h3{margin:0 0 8px; font-size:17px; color:var(--text); font-weight:600; letter-spacing:-0.01em}
.post-card .meta{font-size:12px; color:var(--muted); margin-bottom:6px; font-weight:500}
.post-card .excerpt{color:var(--muted); font-size:14px; line-height:1.55}

/* Post body */
.post-hero{margin-bottom:24px}
.post-hero h1{font-size:42px; line-height:1.08; margin:0 0 12px; font-weight:700; letter-spacing:-0.025em}
.post-hero .meta{color:var(--muted); font-size:14px; font-weight:500}
.post-hero img{margin-top:20px; width:100%; border-radius:var(--radius-lg)}
.post-body article{font-size:17px; line-height:1.6}
.post-body article h2{font-size:28px; margin:32px 0 12px; font-weight:600; letter-spacing:-0.02em}
.post-body article h3{font-size:21px; margin:24px 0 8px; font-weight:600; letter-spacing:-0.01em}
.post-body article p{margin:12px 0}
.post-body article img{max-width:100%; height:auto; border-radius:12px}
.post-body article ul, .post-body article ol{padding-left:22px}
.post-body article blockquote{border-left:3px solid var(--accent); padding:4px 16px; color:var(--muted); margin:16px 0; font-style:italic}
.post-body article code{background:var(--bg-alt); padding:2px 6px; border-radius:6px; font-size:90%; font-family:ui-monospace, "SF Mono", monospace}
.post-body article pre{background:#1d1d1f; color:#fff; padding:18px; border-radius:12px; overflow:auto; font-size:13px}
.breadcrumb{font-size:13px; color:var(--muted); margin:8px 0 18px; font-weight:500}
.breadcrumb a{color:var(--muted)}
.breadcrumb a:hover{color:var(--text)}

/* Pagination */
.pagination{display:flex; gap:8px; justify-content:center; margin:24px 0; flex-wrap:wrap}
.pagination a, .pagination span{padding:8px 14px; border-radius:10px; border:1px solid var(--border); color:var(--text); font-weight:500; font-size:14px}
.pagination .current{background:var(--accent); color:#fff; border-color:transparent}

/* Calc cards (homepage tool grid) */
.calc-card-grid{display:grid; gap:14px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); margin:24px 0}
.calc-card{display:block; padding:20px; background:var(--card); border:1px solid var(--border-soft); border-radius:var(--radius-lg); font-weight:600; color:var(--text); transition:transform .2s ease, box-shadow .2s ease}
.calc-card:hover{transform:translateY(-2px); box-shadow:var(--shadow-hover); text-decoration:none}
.calc-card .ico{display:inline-grid; place-items:center; width:36px; height:36px; border-radius:10px; background:rgba(132,204,22,.12); color:var(--accent); margin-bottom:10px; font-size:18px}
.calc-card .desc{display:block; color:var(--muted); font-weight:400; font-size:14px; margin-top:6px}

/* Ad slots */
.ad-slot{margin:18px 0; text-align:center}

/* Hide theme toggles globally (Apple = single theme) */
#themeToggle, .theme-btn{display:none !important}

/* Print */
@media print{
  .site-nav, .site-chrome-nav, .no-print, .site-footer, .site-chrome-footer, .progress, .toast{display:none !important}
  body{background:#fff !important; color:#000 !important}
  a{color:#000 !important; text-decoration:underline !important}
}