/* Ruedt Co. — shared stylesheet (design D2: warm white, burgundy accent, Inter Tight) */
:root {
  --bg:#fefefc; --ink:#181315; --body:#4a4346; --grey:#7d7578; --line:#ebe4e6;
  --accent:#7a1c3e;       /* burgundy */
  --accent-dk:#5a122c;
  --tint:#f8edf1;         /* very light burgundy */
  --on-accent:#f1cfdb;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:20px; }
body { margin:0; background:var(--bg); color:var(--ink); font:400 1.0625rem/1.6 "Inter Tight", system-ui, sans-serif; -webkit-font-smoothing:antialiased; }
main { overflow-x:clip; }
img { max-width:100%; display:block; }
a { color:inherit; }
p { margin:0 0 1em; }
h1,h2,h3 { letter-spacing:-0.035em; line-height:1.02; margin:0 0 .5em; }
h1 { font-size:clamp(2.3rem,4.6vw,4rem); font-weight:600; line-height:1.05; }
h2 { font-size:clamp(2.1rem,4.4vw,3.6rem); font-weight:600; }
h3 { font-size:1.2rem; font-weight:600; letter-spacing:-0.015em; line-height:1.25; }
.ac { color:var(--accent); }
.wrap { width:min(1200px,100% - 32px); margin-inline:auto; }
.skip { position:absolute; left:-9999px; }
.skip:focus { left:16px; top:16px; z-index:20; background:var(--ink); color:#fff; padding:.6rem 1rem; }
.hidden { display:none; }

/* Header */
.site-header { display:flex; justify-content:space-between; align-items:center; height:84px; position:relative; }
.site-header .brand img { width:120px; }
.nav { display:flex; gap:1.8rem; font-size:.95rem; align-items:center; }
.nav a { text-decoration:none; color:var(--grey); }
.nav a:hover, .nav a[aria-current="page"] { color:var(--ink); }
.nav a[aria-current="page"] { font-weight:500; }
.nav .cta-s { color:var(--accent); font-weight:600; }
.nav .ext::after { content:" ↗"; font-size:.8em; }
.nav .lang { color:var(--grey); font-size:.85rem; letter-spacing:.04em; }
.nav .lang:hover { color:var(--accent); }
.menu-toggle { display:none; background:none; border:1px solid var(--ink); padding:.45rem .9rem; font:500 .9rem "Inter Tight", system-ui, sans-serif; color:var(--ink); cursor:pointer; }

/* Buttons */
.btn { display:inline-block; background:var(--accent); color:#fff; text-decoration:none; font-weight:600; padding:1.05rem 1.7rem; border:0; font-family:inherit; font-size:1rem; cursor:pointer; transition:background .2s; }
.btn:hover { background:var(--accent-dk); }
.more { text-decoration:none; font-weight:500; border-bottom:2px solid var(--accent); padding-bottom:2px; }
.more:hover { color:var(--accent); }

/* Home hero */
.hello { font-size:1.15rem; font-weight:500; margin-bottom:1.4rem; }
.hero { display:grid; grid-template-columns:7fr 5fr; gap:3rem; padding:3rem 0 0; align-items:end; }
.hero > div:first-child { align-self:center; padding-bottom:4rem; }
.hero h1.long { font-size:clamp(2rem,3.7vw,3.25rem); }
.hero .lead { font-size:1.3rem; color:var(--body); max-width:34ch; margin:2rem 0 2.5rem; }
.hero-actions { display:flex; flex-wrap:wrap; gap:1.5rem 2rem; align-items:center; }

/* Portrait: b&w cut-out whose lower edge dissolves into halftone dots */
.portrait { margin:0; justify-self:end; width:min(500px,100%); }
.portrait img { width:100%; height:auto; mix-blend-mode:multiply; } /* white image background melts into the page colour */

/* Subpage header */
.page-head { padding:4.5rem 0 4rem; max-width:860px; }
/* Page titles in burgundy (not the home headline, which has its own highlight) */
.page-head h1, .article-head h1, h1.page-title { color:var(--accent); }
.page-head .lead { font-size:clamp(1.2rem,1.8vw,1.4rem); color:var(--body); max-width:52ch; margin-top:1.8rem; line-height:1.5; }
.page-head .lead + .lead { margin-top:0; }

/* Section rows (Swiss grid) */
.row { display:grid; grid-template-columns:3fr 9fr; gap:4rem; padding:6rem 0; border-top:1px solid var(--line); }
.row > :only-child { grid-column:2; }   /* sections without a side label keep the text column */
.row h2 { font-size:clamp(1.8rem,3.4vw,2.8rem); }
.text { max-width:62ch; }
.text p { color:var(--body); font-size:1.1rem; }
.text p.big { font-size:clamp(1.25rem,1.9vw,1.5rem); color:var(--ink); line-height:1.4; letter-spacing:-0.015em; }
.text a { color:var(--accent); }
/* Home intro: same size as the opening paragraph on the Me page */
.text.intro-block p { font-size:1.3rem; line-height:1.5; max-width:46ch; }
.text.intro-block mark { background:var(--tint); color:var(--accent); padding:0 .12em; }

/* Concerns */
.concerns { display:grid; grid-template-columns:1fr 1fr; gap:0 3rem; margin-top:2.5rem; list-style:none; padding:0; }
.concerns li { padding:1.25rem 0 1.25rem 2.2rem; border-top:1px solid var(--line); position:relative; font-size:1.15rem; letter-spacing:-0.01em; }
.concerns li::before { content:"→"; position:absolute; left:0; color:var(--accent); font-weight:600; }

.statement { font-size:clamp(1.5rem,2.7vw,2.15rem); font-weight:400; line-height:1.3; letter-spacing:-0.025em; margin:0; max-width:30ch; }
.statement mark { background:var(--tint); color:var(--accent); padding:0 .12em; }
.cols3 { display:grid; grid-template-columns:repeat(3,1fr); gap:3rem; }
.cols3 .n { font-size:.85rem; font-weight:600; color:var(--accent); display:block; margin-bottom:1rem; padding-bottom:1rem; border-bottom:2px solid var(--ink); }
.cols3 p { color:var(--body); font-size:1rem; }
.cols3 p:last-child { margin:0; }
.intro-text { font-size:1.15rem; color:var(--body); max-width:60ch; margin-top:1.5rem; }

/* Burgundy band */
.band { background:var(--accent); color:#fff; padding:6rem 0; }
.band h2 { max-width:20ch; }
.steps { display:grid; grid-template-columns:repeat(3,1fr); gap:3rem; margin-top:3.5rem; }
.steps div { border-top:2px solid rgba(255,255,255,.35); padding-top:1.5rem; }
.steps .n { font-size:3.5rem; font-weight:300; line-height:1; display:block; margin-bottom:1.2rem; letter-spacing:-0.04em; }
.steps p { color:rgba(255,255,255,.8); margin:0; }
.steps strong { color:#fff; }
.band .btn { background:var(--bg); color:var(--accent); margin-top:3.5rem; }
.band .btn:hover { background:var(--tint); }

/* About */
.about { display:grid; grid-template-columns:1.3fr 1fr; gap:4rem; }
.about .intro { font-size:1.35rem; line-height:1.4; letter-spacing:-0.015em; }
.about p { color:var(--body); }
.facts { list-style:none; padding:0; margin:0; }
.facts li { padding:.9rem 0; border-top:1px solid var(--line); display:grid; grid-template-columns:7rem 1fr; gap:1rem; font-size:.97rem; color:var(--body); }
.facts li:last-child { border-bottom:1px solid var(--line); }
.facts b { color:var(--ink); font-weight:600; }
.im-a { margin-top:2rem; font-size:1rem; line-height:1.9; color:var(--body); }
.im-a b { color:var(--ink); }
.im-a i { font-style:normal; color:var(--accent); padding:0 .35rem; }

/* Timeline (Me page) */
.timeline { list-style:none; padding:0; margin:0; }
.timeline li { display:grid; grid-template-columns:5.5rem 1fr; gap:1.5rem; padding:1rem 0; border-top:1px solid var(--line); color:var(--body); font-size:1.05rem; }
.timeline li:last-child { border-bottom:1px solid var(--line); }
.timeline a { color:var(--accent); }
.timeline b { color:var(--accent); font-weight:600; font-variant-numeric:tabular-nums; }

/* Now list */
.now { list-style:none; padding:0; margin:0 0 2rem; }
.now li { padding:1.2rem 0 1.2rem 2.2rem; border-top:1px solid var(--line); position:relative; font-size:1.15rem; color:var(--ink); }
.now li:last-child { border-bottom:1px solid var(--line); }
.now li::before { content:"→"; position:absolute; left:0; color:var(--accent); font-weight:600; }
.now a { color:var(--accent); }
.updated { color:var(--grey); font-size:.95rem; }

/* Writing: compact list (home) */
.posts a { display:flex; justify-content:space-between; align-items:baseline; gap:2rem; padding:1.5rem 0; border-top:1px solid var(--line); text-decoration:none; font-size:clamp(1.2rem,2vw,1.55rem); font-weight:500; letter-spacing:-0.02em; }
.posts a:last-child { border-bottom:1px solid var(--line); }
.posts span { color:var(--accent); transition:transform .2s; }
.posts a:hover { color:var(--accent); }
.posts a:hover span { transform:translateX(6px); }

/* Writing: full index */
.post-index { list-style:none; padding:0; margin:0; }
.post-index li { border-top:1px solid var(--line); }
.post-index li:last-child { border-bottom:1px solid var(--line); }
.post-index a { display:block; padding:2rem 0; text-decoration:none; }
.post-index h2 { font-size:clamp(1.35rem,2.2vw,1.75rem); letter-spacing:-0.025em; line-height:1.15; margin:0 0 .5rem; }
.post-index p { color:var(--body); margin:0; max-width:70ch; }
.post-index a:hover h2 { color:var(--accent); }
.note { color:var(--grey); font-size:.95rem; margin-top:-2rem; margin-bottom:3rem; }

/* Article */
.article-head { padding:4.5rem 0 3rem; max-width:860px; }
.article-head h1 { font-size:clamp(2.1rem,4.2vw,3.5rem); }
.meta { color:var(--grey); font-size:.95rem; display:flex; gap:.6rem; flex-wrap:wrap; margin-top:1.5rem; }
.prose { max-width:68ch; padding-bottom:5rem; }
.prose p { font-size:1.15rem; line-height:1.7; color:#2e282b; margin-bottom:1.3em; }
.prose h2 { font-size:clamp(1.35rem,2vw,1.6rem); letter-spacing:-0.02em; line-height:1.25; margin:2.4rem 0 .8rem; }
.prose p:first-child { font-size:1.3rem; line-height:1.55; color:var(--ink); }
.prose a { color:var(--accent); text-underline-offset:3px; }
.prose blockquote { margin:2rem 0; padding:0 0 0 1.5rem; border-left:3px solid var(--accent); }
.prose blockquote p { font-size:1.25rem; color:var(--ink); }
.post-nav { display:flex; justify-content:space-between; gap:2rem; padding:2.5rem 0; border-top:1px solid var(--line); flex-wrap:wrap; }
.post-nav a { text-decoration:none; max-width:45%; }
.post-nav small { display:block; color:var(--grey); font-size:.85rem; margin-bottom:.3rem; }
.post-nav span { font-weight:500; letter-spacing:-0.01em; }
.post-nav a:hover span { color:var(--accent); }
.post-nav .next { text-align:right; margin-left:auto; }

/* Callout (end of article / subpages) */
.callout { background:#f3f2f0; padding:3.5rem; margin:0 0 6rem; display:grid; grid-template-columns:1fr auto; gap:2rem; align-items:center; }
.callout h2 { font-size:clamp(1.5rem,2.6vw,2.1rem); margin:0 0 .5rem; }
.callout p { margin:0; color:var(--body); max-width:55ch; }

/* Contact */
.contact { display:grid; grid-template-columns:1fr 1fr; gap:4rem; }
.contact p { color:var(--body); font-size:1.1rem; }
.contact a { color:var(--accent); }
form { display:grid; gap:1.8rem; }
.two { display:grid; grid-template-columns:1fr 1fr; gap:1.8rem; }
label { display:grid; font-size:.85rem; color:var(--grey); gap:.3rem; }
input, textarea { font:inherit; font-size:1.1rem; border:0; border-bottom:1px solid var(--ink); padding:.5rem 0; background:none; color:var(--ink); border-radius:0; }
input:focus, textarea:focus { outline:none; border-bottom:2px solid var(--accent); }
form .btn { justify-self:start; }
.privacy-note { font-size:.85rem; color:var(--grey); margin:-.6rem 0 0; }
.privacy-note a { color:var(--grey); }

/* Legal text */
.legal { max-width:72ch; padding-bottom:6rem; }
.legal h2 { font-size:1.4rem; letter-spacing:-0.02em; margin:2.5rem 0 .8rem; }
.legal h3 { font-size:1.1rem; margin:1.8rem 0 .5rem; }
.legal p, .legal li { color:var(--body); }
.legal ul { padding-left:1.2rem; margin:0 0 1em; }
.legal a { color:var(--accent); word-break:break-word; }

/* bso logo inside the Coaching page qualification section */
.text .bso-inline { display:inline-block; margin-top:1.5rem; }
.text .bso-inline img { width:min(380px,100%); mix-blend-mode:multiply; }

/* bso membership strip (above the footer, every page) */
.membership { display:grid; grid-template-columns:1fr auto; gap:2rem 4rem; align-items:center; padding:3.5rem 0; border-top:1px solid var(--line); }
.membership p { margin:0; font-size:1.15rem; color:var(--body); max-width:42ch; line-height:1.5; }
.membership img { width:420px; mix-blend-mode:multiply; }

/* Footer */
.site-footer { border-top:2px solid var(--ink); padding:3rem 0 3.5rem; font-size:.9rem; color:var(--grey); display:grid; grid-template-columns:1.2fr 1fr 1fr; gap:2rem 3rem; align-items:start; }
.site-footer .f-brand img { width:110px; margin-bottom:.8rem; }
.site-footer p { margin:0 0 .4rem; }
.site-footer h4 { margin:0 0 .7rem; font-size:.8rem; font-weight:600; color:var(--ink); text-transform:uppercase; letter-spacing:.08em; }
.site-footer ul { list-style:none; padding:0; margin:0; }
.site-footer li { margin-bottom:.4rem; }
.site-footer a { text-decoration:none; }
.site-footer a:hover { color:var(--accent); }
.site-footer .consulting { color:var(--ink); }

@media (max-width:980px) {
  .menu-toggle { display:block; }
  .nav { display:none; position:absolute; top:84px; left:-16px; right:-16px; z-index:10; background:var(--bg); flex-direction:column; align-items:flex-start; gap:1.1rem; padding:1.5rem 16px 2rem; border-bottom:1px solid var(--line); font-size:1.1rem; }
  .nav.open { display:flex; }
  .site-footer { grid-template-columns:1fr 1fr; }
}
@media (max-width:900px) {
  .hero, .row, .about, .contact { grid-template-columns:1fr; gap:2.5rem; }
  .hero { padding:2rem 0 0; gap:1rem; }
  .hero > div:first-child { padding-bottom:1rem; }
  .portrait { order:-1; justify-self:center; width:min(250px,70%); }
  .row { padding:4rem 0; gap:1rem; }
  .row > :only-child { grid-column:auto; }
  .cols3, .steps, .concerns { grid-template-columns:1fr; gap:2rem; }
  .concerns { gap:0; }
  .band { padding:4rem 0; }
  .page-head, .article-head { padding:2.5rem 0 2.5rem; }
  .post-index a { padding:1.6rem 0; }
  .callout { grid-template-columns:1fr; padding:2rem; }
  .membership { grid-template-columns:1fr; gap:1.5rem; padding:2.5rem 0; }
  .membership img { width:min(340px,100%); }
}
@media (max-width:520px) {
  .two { grid-template-columns:1fr; }
  .facts li, .timeline li { grid-template-columns:1fr; gap:.2rem; }
  .site-footer { grid-template-columns:1fr; }
  .post-nav a { max-width:100%; }
}