
/* Page hero */
.about_hero {
padding-top: var(--nav_h);
background: var(--bg_surface);
border-bottom: 1px solid var(--rule_light);
padding-bottom: 0;
}
.about_hero_inner {
display: grid;
grid-template-columns: 1fr 420px;
gap: 0;
min-height: 380px;
}
.about_hero_text {
padding: 72px 64px 64px 8vw;
display: flex; flex-direction: column; justify-content: center;
}
.about_hero_text h1 {
font-size: clamp(34px, 3.8vw, 54px);
letter-spacing: -0.015em;
margin-bottom: 20px;
}
.about_hero_text h1 em { font-style: italic; color: var(--green_mid); }
.about_hero_text .subtitle {
font-size: 19px; color: var(--ink_2); line-height: 1.75;
max-width: 500px; margin-bottom: 32px;
}
.about_hero_aside {
background: var(--bg_tinted);
border-left: 1px solid var(--rule_light);
display: flex; flex-direction: column; justify-content: center;
padding: 48px 40px;
gap: 16px;
}
.about_stat {
display: flex; flex-direction: column; gap: 3px;
}
.about_stat_val {
font-family: var(--serif); font-size: 40px; color: var(--ink_1); line-height: 1;
}
.about_stat_lbl {
font-size: 14px; color: var(--ink_3); letter-spacing: 0.03em; line-height: 1.4;
}
.about_stat_divider {
width: 100%; height: 1px; background: var(--rule_light);
}

/* Bio section */
.bio_sec {
padding: 80px 8vw;
background: var(--bg_base);
}
.bio_inner {
display: grid;
grid-template-columns: 580px 1fr;
gap: 80px;
align-items: start;
max-width: 1200px;
}
.bio_text p {
font-size: 18px; line-height: 1.82; color: var(--ink_2);
margin-bottom: 22px;
}
.bio_text p:last-child { margin-bottom: 0; }
.bio_text p strong {
color: var(--ink_1); font-weight: 600;
}
.bio_aside {
display: flex; flex-direction: column; gap: 20px;
}

/* LinkedIn card */
.linkedin_card {
background: var(--bg_surface);
border: 1px solid var(--rule_light);
border-radius: var(--r_lg);
padding: 28px 28px 24px;
display: flex; flex-direction: column; gap: 14px;
}
.linkedin_card_top {
display: flex; align-items: center; gap: 14px;
}
.linkedin_icon {
width: 40px; height: 40px; border-radius: 8px;
background: #fff;
display: flex; align-items: center; justify-content: center;
flex-shrink: 0;
}
.linkedin_icon svg { display: block; }
.linkedin_card_name {
font-family: var(--serif); font-size: 18px; color: var(--ink_1); line-height: 1.2;
}
.linkedin_card_role {
font-size: 14px; color: var(--ink_3); margin-top: 2px;
}
.linkedin_card p {
font-size: 15px; color: var(--ink_2); line-height: 1.65;
}
.linkedin_link {
display: inline-flex; align-items: center; gap: 7px;
background: #f0f4e8; color: #000; text-decoration: none;
font-size: 14px; font-weight: 600;
padding: 10px 20px; border-radius: var(--r_sm);
transition: background 0.18s;
align-self: flex-start;
}
.linkedin_link:hover { background: var(--green); color: #fcfeff; }

/* Values / credentials strip */
.credential_strip {
background: var(--green);
border-radius: var(--r_lg);
padding: 28px 28px 24px;
display: flex; flex-direction: column; gap: 16px;
}
.credential_item {
display: flex; gap: 12px; align-items: flex-start;
}
.credential_dot {
width: 6px; height: 6px; border-radius: 50%;
background: var(--green_light); flex-shrink: 0; margin-top: 8px;
}
.credential_text {
font-size: 15px; color: rgba(245,243,239,0.88); line-height: 1.6;
}
.credential_text strong {
color: #fff; font-weight: 600;
}

/* Books section */
.books_sec {
background: var(--bg_surface);
border-top: 1px solid var(--rule_light);
padding: 80px 8vw;
}
.books_grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20px;
margin-top: 48px;
}
.book_card {
background: var(--bg_base);
border: 1px solid var(--rule_light);
border-radius: var(--r_lg);
padding: 32px 28px 28px;
display: flex; flex-direction: column;
transition: box-shadow 0.2s;
}
.book_card:hover { box-shadow: 0 4px 24px rgba(0,0,0,0.07); }
.book_label {
font-family: var(--sans); font-size: 11px; font-weight: 700;
letter-spacing: 0.13em; text-transform: uppercase;
color: var(--green_mid);
margin-bottom: 12px;
}
.book_title {
font-family: var(--serif); font-size: 19px; color: var(--ink_1);
line-height: 1.35; margin-bottom: 14px;
}
.book_desc {
font-size: 15px; color: var(--ink_2); line-height: 1.7;
flex: 1; margin-bottom: 24px;
}
.book_link {
display: inline-flex; align-items: center; gap: 6px;
font-size: 14px; font-weight: 600; color: var(--green_mid);
text-decoration: none;
border-bottom: 1px solid var(--green_pale);
padding-bottom: 2px;
transition: color 0.15s, border-color 0.15s;
align-self: flex-start;
}
.book_link:hover { color: var(--green); border-color: var(--green_mid); }

/* CTA section */
.cta_sec { background: var(--bg_dark); padding: 80px 8vw; }
.cta_inner { display: grid; grid-template-columns: 1fr auto; gap: 60px; align-items: center; }
.cta_h { font-family: var(--serif); font-size: clamp(26px, 2.8vw, 40px); color: #fff; line-height: 1.2; margin-bottom: 12px; }
.cta_h em { font-style: italic; color: #dbf9e4; }
.cta_sub { font-size: 17px; color: rgba(255,255,255,1); max-width: 520px; line-height: 1.72; }
.cta_r { display: flex; flex-direction: column; gap: 10px; align-items: flex-end; }
.cta_det { font-size: 17px; color: rgba(255,255,255,1); letter-spacing: 0.03em; }

/* ── Responsive ─────────────────────────────────────────────────── */
@media (max-width: 1024px) {
.about_hero_inner { grid-template-columns: 1fr; }
.about_hero_aside {
border-left: none; border-top: 1px solid var(--rule_light);
flex-direction: row; flex-wrap: wrap; gap: 24px 48px;
padding: 36px 8vw;
}
.bio_inner { grid-template-columns: 1fr; gap: 40px; }
.books_grid { grid-template-columns: 1fr 1fr; }
.cta_inner { grid-template-columns: 1fr; gap: 28px; }
.cta_r { align-items: flex-start; flex-direction: row; }
}
@media (max-width: 768px) {
.nav-toggle { display: flex; }
.nav_row {
position: absolute; top: 100%; left: 0; right: 0;
background: #ffffff; border-top: 1px solid #e2e8f0;
box-shadow: rgba(0, 0, 0, 0.07) 0px 4px 12px;
padding: 1rem 1.5rem; display: none; z-index: 1000;
}
.nav_row.nav-open { display: block; }
.nav_links { flex-direction: column; gap: 0.75rem; align-items: flex-start; }
.nav_links a { padding: 0.75rem 0; font-size: 1.05rem; width: 100%; }
body.nav-open { overflow-x: hidden; }
}
@media (max-width: 640px) {
body { font-size: 17px; }
nav { padding: 0 4vw; }
.logo_tag { display: none; }
.about_hero_text { padding: 52px 6vw 40px; }
.bio_sec { padding: 60px 6vw; }
.books_sec { padding: 60px 6vw; }
.books_grid { grid-template-columns: 1fr; }
.cta_inner { grid-template-columns: 1fr; gap: 24px; }
.cta_r { align-items: flex-start; flex-direction: row; }
#cookie_bar {
flex-direction: column; align-items: flex-start;
white-space: normal; bottom: 16px; padding: 16px 18px; gap: 12px;
}
}