/* Kallos & Co — shared blog post styles */

* { margin:0; padding:0; box-sizing:border-box; }

:root {
  --white: #FFFFFF;
  --off-white: #FAFAF8;
  --stone: #F4F1ED;
  --blush: #E8D5CB;
  --rose: #B87B6F;
  --rose-dark: #8F5A50;
  --gold: #A8865C;
  --ink: #1A1410;
  --mink: #5C4840;
  --soft: #9A8880;
  --line: rgba(90,60,48,0.1);
}

html { scroll-behavior:smooth; }
body {
  font-family:'Inter', sans-serif;
  background:var(--white); color:var(--ink);
  line-height:1.6;
}

/* Skip link */
.skip-link {
  position:absolute; left:-9999px; top:0;
  background:var(--ink); color:white;
  padding:14px 22px; font-size:11px; letter-spacing:0.16em;
  text-transform:uppercase; text-decoration:none;
  z-index:1500;
}
.skip-link:focus { left:8px; top:8px; outline:2px solid var(--rose); outline-offset:2px; }

/* Top bar — minimal nav for blog posts */
.blog-topbar {
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,0.97);
  backdrop-filter:blur(20px);
  border-bottom:1px solid var(--line);
  padding:0 48px; height:64px;
  display:flex; align-items:center; justify-content:space-between;
}
.blog-topbar-logo {
  font-family:'Cormorant Garamond', serif;
  font-size:18px; font-weight:400; letter-spacing:0.18em;
  color:var(--ink); text-decoration:none; text-transform:uppercase;
}
.blog-topbar-logo span { color:var(--rose); font-style:italic; }
.blog-topbar-links { display:flex; gap:28px; align-items:center; }
.blog-topbar-links a {
  font-size:11px; font-weight:400; letter-spacing:0.16em; text-transform:uppercase;
  color:var(--soft); text-decoration:none; transition:color 0.2s;
}
.blog-topbar-links a:hover { color:var(--ink); }
.blog-topbar-links .nav-cta {
  background:var(--rose); color:white; padding:10px 22px;
  letter-spacing:0.16em; transition:background 0.2s;
}
.blog-topbar-links .nav-cta:hover { background:var(--rose-dark); color:white; }

/* Article container */
.post-wrap {
  max-width:720px; margin:0 auto; padding:64px 32px 48px;
}

/* Breadcrumb */
.post-breadcrumb {
  font-size:11px; letter-spacing:0.16em; text-transform:uppercase;
  color:var(--soft); margin-bottom:32px;
}
.post-breadcrumb a {
  color:var(--soft); text-decoration:none; transition:color 0.2s;
}
.post-breadcrumb a:hover { color:var(--rose); }
.post-breadcrumb .sep { margin:0 8px; color:var(--line); }

/* Post header */
.post-eyebrow {
  font-size:11px; font-weight:400; letter-spacing:0.22em; text-transform:uppercase;
  color:var(--rose); margin-bottom:18px;
}
.post-h1 {
  font-family:'Cormorant Garamond', serif;
  font-size:clamp(36px, 4.5vw, 56px); font-weight:300; line-height:1.1;
  color:var(--ink); margin-bottom:24px;
}
.post-h1 em { font-style:italic; color:var(--rose); }
.post-meta {
  font-size:12px; letter-spacing:0.1em; color:var(--soft);
  margin-bottom:48px; padding-bottom:24px;
  border-bottom:1px solid var(--line);
}
.post-meta strong { color:var(--mink); font-weight:500; }

/* Post body typography */
.post-body { font-size:17px; line-height:1.85; color:var(--ink); }
.post-body p { margin-bottom:24px; }
.post-body p:first-of-type::first-line {
  letter-spacing:0.02em;
}
.post-body h2 {
  font-family:'Cormorant Garamond', serif;
  font-size:30px; font-weight:300; line-height:1.2;
  color:var(--ink); margin:48px 0 18px;
}
.post-body h2 em { font-style:italic; color:var(--rose); }
.post-body h3 {
  font-family:'Cormorant Garamond', serif;
  font-size:22px; font-weight:400;
  color:var(--ink); margin:32px 0 14px;
}
.post-body strong { font-weight:500; color:var(--ink); }
.post-body a {
  color:var(--rose-dark); text-decoration:none;
  border-bottom:1px solid var(--blush); transition:all 0.2s;
}
.post-body a:hover { color:var(--rose); border-color:var(--rose); }
.post-body ul, .post-body ol { margin:0 0 24px 24px; }
.post-body li { margin-bottom:10px; line-height:1.75; }
.post-body blockquote {
  margin:32px 0;
  padding:24px 28px;
  background:var(--off-white); border-left:3px solid var(--rose);
  font-family:'Cormorant Garamond', serif; font-size:22px;
  font-style:italic; color:var(--mink); line-height:1.4;
}

/* Pull quote inline */
.post-body .pull-quote {
  font-family:'Cormorant Garamond', serif;
  font-size:24px; font-style:italic; line-height:1.3;
  color:var(--rose-dark);
  margin:32px 24px; padding:0;
}

/* CTA card at bottom of post */
.post-cta {
  margin-top:48px; padding:36px 28px;
  background:var(--stone); border:1px solid var(--line);
  text-align:center;
}
.post-cta-eyebrow {
  font-size:10px; letter-spacing:0.22em; text-transform:uppercase;
  color:var(--rose); margin-bottom:10px;
}
.post-cta-title {
  font-family:'Cormorant Garamond', serif;
  font-size:24px; font-weight:300; line-height:1.2;
  color:var(--ink); margin-bottom:12px;
}
.post-cta-title em { font-style:italic; color:var(--rose); }
.post-cta-body {
  font-size:14px; line-height:1.7; color:var(--mink);
  margin-bottom:22px;
}
.post-cta-actions {
  display:flex; gap:12px; justify-content:center; flex-wrap:wrap;
}
.post-cta a {
  display:inline-block; padding:14px 28px;
  font-size:11px; font-weight:400; letter-spacing:0.16em; text-transform:uppercase;
  text-decoration:none; transition:all 0.2s;
}
.post-cta .btn-primary { background:var(--rose); color:white; }
.post-cta .btn-primary:hover { background:var(--rose-dark); }
.post-cta .btn-secondary {
  background:transparent; color:var(--ink); border:1px solid var(--ink);
}
.post-cta .btn-secondary:hover { background:var(--ink); color:white; }

/* Author / signature footer */
.post-signoff {
  margin-top:48px; padding-top:24px; border-top:1px solid var(--line);
  display:flex; align-items:center; gap:18px;
}
.post-signoff-name {
  font-family:'Cormorant Garamond', serif;
  font-size:18px; color:var(--ink);
}
.post-signoff-cred {
  font-size:11px; letter-spacing:0.12em; color:var(--soft);
  text-transform:uppercase;
}

/* Page footer */
.blog-footer {
  border-top:1px solid var(--line); margin-top:64px;
  padding:32px 32px 24px;
  font-size:11px; letter-spacing:0.1em; color:var(--soft);
  text-align:center;
}
.blog-footer a { color:var(--mink); text-decoration:none; }
.blog-footer a:hover { color:var(--rose); }

/* Reg footnote on blog posts */
.blog-reg {
  margin-top:48px; padding:24px 0; border-top:1px solid var(--line);
  font-size:11px; line-height:1.7; color:var(--soft);
}
.blog-reg strong { color:var(--mink); }
.blog-reg a { color:var(--rose); text-decoration:none; }

/* Mobile */
@media (max-width:640px) {
  .blog-topbar { padding:0 20px; }
  .blog-topbar-links { gap:14px; }
  .blog-topbar-links a:not(.nav-cta) { display:none; }
  .post-wrap { padding:40px 22px 32px; }
  .post-body { font-size:16px; }
  .post-body h2 { font-size:24px; margin-top:36px; }
  .post-body .pull-quote { font-size:20px; margin:24px 0; }
  .post-cta { padding:28px 22px; }
}

/* Print */
@media print {
  @page { margin:18mm 14mm; }
  .blog-topbar, .post-cta, .blog-footer, .post-breadcrumb { display:none; }
  body { font-size:11pt; color:#1A1410; }
  .post-wrap { max-width:none; padding:0; }
  .post-h1 { font-size:28pt; }
  .post-body { font-size:11pt; }
  .post-body p, .post-body h2, .post-body h3 { page-break-inside:avoid; }
  a { color:#1A1410; }
}
