/* About + Questions mothers ask (7 Oct 2026). Only the homepage's colours, fonts and parts: cream/blush/teal,
   Cormorant Garamond + Nunito Sans, rounded cards, gold poppy, the line drawing watermark. All classes .pg-* / .q-* */

/* ---------- shared ---------- */
.pg-updated{text-align:center;font-size:.85rem;color:var(--ink-soft);letter-spacing:.02em;margin:0;padding:0 20px clamp(40px,6vw,64px)}
.pg-sec{padding:clamp(56px,8vw,96px) clamp(20px,5vw,40px)}
.pg-sec .wrap{max-width:1080px;margin:0 auto}
.pg-sec .narrow{max-width:680px;margin:0 auto}
.pg-sec h2{color:var(--ink)}
.pg-sec .eyebrow{color:var(--teal)}
.pg-center{text-align:center}
.pg-center .body{margin-left:auto;margin-right:auto}
.pg-btn{display:inline-block;text-decoration:none;font-weight:700;font-size:.92rem;padding:11px 22px;border-radius:999px;border:1px solid rgba(63,110,102,.5);color:var(--teal2);transition:background .2s,color .2s}
.pg-btn:hover{background:var(--teal);color:var(--cream)}
.pg-btns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;margin-top:1.2rem}

/* ---------- About: hero (reuses the homepage .about band) ---------- */
.pg-hero h1{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:clamp(2.3rem,4.6vw,3.2rem);line-height:1.08;margin:0;max-width:none;text-align:left}
.pg-hero .portrait-wrap{position:relative;top:auto}
.pg-cred{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--teal2);font-weight:700;margin:1rem 0 1.2rem;line-height:1.7}
.pg-hero .body{margin:0 0 1rem}

/* ---------- About: at a glance ---------- */
.pg-facts{background:var(--cream2)}
.pg-factgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:18px;margin-top:28px}
.pg-fact{background:var(--cream);border:1px solid rgba(63,110,102,.14);border-radius:16px;padding:22px 22px 20px}
.pg-fact .k{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);font-weight:700;margin:0 0 8px}
.pg-fact p{margin:0;color:var(--ink);line-height:1.55}
.pg-fact a{color:var(--teal2);text-underline-offset:3px;overflow-wrap:anywhere}

/* ---------- About: story ---------- */
.pg-story .body{max-width:none;margin:0 0 1.1rem;font-size:1.1rem;line-height:1.75;color:var(--ink)}
.pg-story .pg-pull{font-family:"Cormorant Garamond",Georgia,serif;font-style:italic;font-size:clamp(1.45rem,3vw,1.85rem);line-height:1.3;color:var(--teal2);border-left:2px solid #c9a227;margin:1.8rem 0 0;padding:.2em 0 .2em 1.1em}

/* ---------- About: ways to work with me ---------- */
.pg-offers{background:var(--blush-soft)}
.pg-offergrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px;margin-top:30px}
.pg-offer{display:flex;flex-direction:column;background:var(--cream2);border-radius:18px;padding:26px 24px;box-shadow:0 10px 26px rgba(63,110,102,.08);text-decoration:none;color:inherit;transition:transform .3s ease,box-shadow .3s ease}
.pg-offer:hover,.pg-offer:focus-visible{transform:translateY(-3px);box-shadow:0 16px 32px rgba(63,110,102,.14)}
.pg-offer .k{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);font-weight:700;margin:0 0 10px}
.pg-offer h3{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:1.6rem;line-height:1.15;margin:0 0 .5rem;color:var(--ink)}
.pg-offer .price{font-family:"Cormorant Garamond",Georgia,serif;font-size:1.3rem;color:var(--teal2);margin:0 0 .6rem}
.pg-offer p{color:var(--ink-soft);margin:0 0 1rem;line-height:1.6;font-size:.98rem}
.pg-offer .go{margin-top:auto;font-weight:700;font-size:.9rem;color:var(--teal2)}

/* ---------- FAQ (About) ---------- */
.pg-faq{background:var(--cream)}
.pg-faqlist{max-width:760px;margin:28px auto 0;display:grid;gap:12px}
.pg-faqlist details{background:var(--cream2);border:1px solid rgba(63,110,102,.16);border-radius:14px;padding:0 22px}
.pg-faqlist summary{cursor:pointer;list-style:none;font-family:"Cormorant Garamond",Georgia,serif;font-weight:600;font-size:1.3rem;line-height:1.3;color:var(--teal2);padding:18px 32px 18px 0;position:relative}
.pg-faqlist summary::-webkit-details-marker{display:none}
.pg-faqlist summary::after{content:"+";position:absolute;right:0;top:50%;transform:translateY(-50%);font-family:"Nunito Sans",system-ui,sans-serif;font-weight:400;font-size:1.5rem;color:var(--teal)}
.pg-faqlist details[open] summary::after{content:"\2212"}
.pg-faqlist details p{margin:0 0 18px;color:var(--ink);line-height:1.7}
.pg-faqlist a{color:var(--teal2)}

/* ---------- Question page ---------- */
.pg-question{padding:0}
.q-hero{position:relative;overflow:clip;background:var(--blush);text-align:center;padding:clamp(56px,9vw,104px) clamp(20px,5vw,40px) clamp(84px,11vw,124px)}
.q-hero .wm{opacity:.09}
.q-hero-in{position:relative;z-index:1;max-width:760px;margin:0 auto}
.q-hero .eyebrow{color:var(--teal2)}
.q-hero h1{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:clamp(2.1rem,5vw,3.3rem);line-height:1.1;color:var(--ink);margin:.3rem auto .9rem;max-width:20ch;text-wrap:balance}
.q-hero .lmeta{color:var(--ink-soft)}
.q-wrap{padding:0 clamp(20px,5vw,40px) clamp(40px,6vw,72px);box-sizing:content-box}
.q-short{position:relative;z-index:2;margin:calc(-1 * clamp(52px,7vw,72px)) 0 clamp(32px,5vw,48px);background:var(--cream2);border-radius:18px;border-left:3px solid var(--teal);padding:24px 28px;box-shadow:0 14px 34px rgba(63,110,102,.12)}
.q-short .k{font-size:.74rem;letter-spacing:.16em;text-transform:uppercase;color:var(--teal);font-weight:700;margin:0 0 8px}
.q-short p:last-child{font-family:"Cormorant Garamond",Georgia,serif;font-size:clamp(1.3rem,2.6vw,1.55rem);line-height:1.38;color:var(--teal2);margin:0}
.lbody .q-prompts{background:var(--blush-soft);border-radius:16px;padding:22px 26px 22px 44px}
.lbody .q-prompts li{margin:.55em 0}
.lbody .q-related{margin:2.6em 0 0;padding-top:2em;border-top:1px solid rgba(63,110,102,.18)}
.lbody .q-related .eyebrow{text-align:center;margin-bottom:.2em}
.lbody .q-related .lgrid{grid-template-columns:1fr;gap:14px;margin-top:14px}
.lbody .q-related .lcard{padding:20px 22px}
.lbody .q-related .lcard h3{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-size:1.4rem;line-height:1.2;margin:0;color:var(--ink)}
.lbody a.lcard{text-decoration:none;color:inherit}
.lbody .q-links{text-align:center;font-size:.95rem;margin-top:1.4em}
.q-disc{font-size:.9rem;line-height:1.6;color:var(--ink-soft);background:var(--cream2);border:1px solid rgba(63,110,102,.14);border-radius:12px;padding:14px 18px;margin:2em 0 0}
.lbody .q-disc{font-size:.9rem}

/* ---------- Hub ---------- */
.pg-hub .lcard{display:flex;flex-direction:column}
.pg-hub .lcard h2{font-size:1.55rem}
.pg-hub .lcard .go{margin-top:1rem;font-weight:700;font-size:.9rem;color:var(--teal2)}
.pg-hub .q-disc{max-width:680px;margin:clamp(32px,5vw,48px) auto 0;text-align:center}
.pg-hub .pg-updated{padding-top:18px}

@media(max-width:820px){
  .pg-hero .about-title{gap:18px}
  .pg-hero h1{font-size:clamp(2.1rem,9vw,2.6rem)}
  .q-short{padding:20px 20px}
  .lbody .q-prompts{padding:18px 18px 18px 36px}
}
@media(prefers-reduced-motion:reduce){.pg-offer{transition:none}.pg-offer:hover{transform:none}}
.lbody p.q-prompts{padding:20px 24px;font-style:italic}
/* 7 Oct polish: six facts sit as 3 x 2; hub cards centre on the last row; dates never break */
@media(min-width:821px){.pg-factgrid{grid-template-columns:repeat(3,1fr)}}
@media(min-width:560px) and (max-width:820px){.pg-factgrid{grid-template-columns:repeat(2,1fr)}}
.pg-hub .pg-hub-body .lgrid{display:flex;flex-wrap:wrap;justify-content:center;gap:22px}
.pg-hub .pg-hub-body .lcard{flex:0 1 330px}
.lmeta time,.pg-updated time{white-space:nowrap}