/* ============================================================
   Prabhjot Singh — personal site design system
   Fraunces (display serif) + Inter (body) · warm editorial palette
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300..900;1,9..144,300..600&family=Inter:wght@400;500;600;700&display=swap');

:root{
  --paper:#F8F4ED;          /* warm ivory background */
  --paper-2:#FFFFFF;        /* cards */
  --cream-deep:#EFE7D9;     /* alt section bg */
  --ink:#211C16;            /* warm near-black */
  --ink-soft:#574E43;       /* body secondary */
  --ink-faint:#938A79;      /* meta */
  --line:#E6DECF;           /* warm hairline */
  --clay:#BD5A3C;           /* terracotta accent */
  --clay-deep:#9E4A30;      /* accent hover */
  --clay-tint:#F3E4DC;      /* accent wash */
  --espresso:#231E18;       /* dark sections / footer */
  --serif:"Fraunces",Georgia,"Times New Roman",serif;
  --sans:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;
  --maxw:1100px;
  --radius:16px;
}

*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:var(--sans);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block;}
a{color:inherit;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px;}
.narrow{max-width:760px;}

/* serif display utility */
.serif{font-family:var(--serif);}
h1,h2,h3{font-family:var(--serif);font-weight:560;line-height:1.08;letter-spacing:-0.015em;color:var(--ink);}
h1{font-size:clamp(40px,6.4vw,72px);font-optical-sizing:auto;}
h2{font-size:clamp(28px,4vw,44px);}
h3{font-size:clamp(20px,2.4vw,25px);letter-spacing:-0.01em;}
.kicker{font-family:var(--sans);font-size:12.5px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;color:var(--clay);}
.lead{font-size:clamp(18px,2.3vw,21px);color:var(--ink-soft);line-height:1.6;}
em,.ital{font-style:italic;}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:50;background:rgba(248,244,237,.82);backdrop-filter:saturate(140%) blur(12px);border-bottom:1px solid var(--line);}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;height:68px;}
.brand{font-family:var(--serif);font-weight:600;font-size:20px;letter-spacing:-0.02em;text-decoration:none;color:var(--ink);}
.brand span{color:var(--clay);}
.nav-links{display:flex;gap:30px;align-items:center;}
.nav-links a{font-size:15px;font-weight:500;color:var(--ink-soft);text-decoration:none;position:relative;padding:4px 0;transition:color .15s;white-space:nowrap;flex-shrink:0;}
.nav-links a:hover{color:var(--ink);}
.nav-links a.active{color:var(--ink);}
.nav-links a.active::after{content:"";position:absolute;left:0;right:0;bottom:-2px;height:2px;background:var(--clay);border-radius:2px;}
.nav-links a.nav-cta{background:var(--ink);color:var(--paper)!important;padding:10px 22px;border-radius:999px;font-weight:600;white-space:nowrap;flex-shrink:0;margin-left:6px;}
.nav-links a.nav-cta::after{display:none;}
.nav-cta:hover{background:var(--clay);}
.nav-toggle{display:none;background:none;border:none;font-size:24px;cursor:pointer;color:var(--ink);}
@media(max-width:720px){
  .nav-links{position:fixed;inset:68px 0 auto 0;background:var(--paper);flex-direction:column;gap:0;border-bottom:1px solid var(--line);max-height:0;overflow:hidden;transition:max-height .25s;}
  .nav-links.open{max-height:380px;}
  .nav-links a{padding:16px 28px;width:100%;border-top:1px solid var(--line);}
  .nav-links a.active::after{display:none;}
  .nav-links a.nav-cta{margin:14px 28px;text-align:center;width:auto;border-top:none;}
  .nav-toggle{display:block;}
}

/* ---------- sections ---------- */
section{padding:84px 0;}
.section-sm{padding:56px 0;}
.eyebrow-row{margin-bottom:18px;}
.divider{height:1px;background:var(--line);border:0;}

/* hero */
.hero{padding:88px 0 64px;}
.hero h1{max-width:16ch;margin:18px 0 24px;}
.hero .lead{max-width:60ch;}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin-top:34px;}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;font-family:var(--sans);font-weight:600;font-size:15.5px;padding:14px 26px;border-radius:999px;text-decoration:none;border:none;cursor:pointer;transition:transform .05s,background .15s,color .15s;}
.btn:active{transform:translateY(1px);}
.btn-primary{background:var(--clay);color:#fff;}
.btn-primary:hover{background:var(--clay-deep);}
.btn-dark{background:var(--ink);color:var(--paper);}
.btn-dark:hover{background:var(--clay);}
.btn-ghost{background:transparent;color:var(--ink);border:1.5px solid var(--ink);}
.btn-ghost:hover{background:var(--ink);color:var(--paper);}
.arrow{transition:transform .15s;}
.btn:hover .arrow{transform:translateX(3px);}

/* ---------- cards / grid ---------- */
.grid{display:grid;gap:24px;}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));}
.card{background:var(--paper-2);border:1px solid var(--line);border-radius:var(--radius);padding:30px 28px;display:flex;flex-direction:column;transition:transform .18s,box-shadow .18s,border-color .18s;}
.card:hover{transform:translateY(-3px);box-shadow:0 18px 40px -26px rgba(33,28,22,.4);border-color:#dcd2bf;}
.card h3{margin-bottom:10px;}
.card p{color:var(--ink-soft);font-size:15.5px;}
.tag{display:inline-flex;align-items:center;gap:7px;font-size:11px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;padding:5px 11px;border-radius:999px;width:max-content;margin-bottom:16px;}
.tag-clay{background:var(--clay-tint);color:var(--clay-deep);}
.tag-ink{background:#ECE5D7;color:var(--ink-soft);}
.meta{font-size:12.5px;color:var(--ink-faint);display:flex;gap:14px;flex-wrap:wrap;margin-top:auto;padding-top:16px;}

/* post (writing) card */
.post-card{position:relative;text-decoration:none;color:inherit;}
.post-card .pillar{font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--clay);margin-bottom:12px;}
.post-card .hook{font-family:var(--serif);font-size:19px;line-height:1.32;color:var(--ink);font-weight:480;}
.post-card .readon{margin-top:18px;font-size:14px;font-weight:600;color:var(--ink);display:inline-flex;gap:7px;align-items:center;}
.post-card:hover .readon{color:var(--clay);}

/* dark band */
.band-dark{background:var(--espresso);color:var(--paper);}
.band-dark h2,.band-dark h3{color:var(--paper);}
.band-dark .lead{color:#C9C0B2;}
.band-dark .kicker{color:#E08A6E;}

/* alt band */
.band-cream{background:var(--cream-deep);}

/* ---------- email capture ---------- */
.capture{display:flex;flex-direction:column;gap:11px;margin-top:6px;}
.capture input[type=email]{width:100%;padding:14px 16px;border:1.5px solid var(--line);border-radius:11px;font:inherit;font-size:15.5px;background:#FCFAF6;color:var(--ink);}
.capture input[type=email]:focus{outline:none;border-color:var(--clay);background:#fff;}
.micro{font-size:12.5px;color:var(--ink-faint);}
.success{background:var(--clay-tint);border:1px solid #E6CABD;border-radius:11px;padding:15px;font-size:14.5px;color:var(--clay-deep);display:none;}
.success.show{display:block;}

/* about / profile */
.profile{display:grid;grid-template-columns:180px 1fr;gap:40px;align-items:start;}
.profile img{width:180px;height:180px;border-radius:18px;object-fit:cover;object-position:center;border:1px solid var(--line);}
@media(max-width:640px){.profile{grid-template-columns:1fr;gap:24px;}.profile img{width:120px;height:120px;}}

/* credentials chips */
.chips{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0;}
.chip{font-size:13px;font-weight:600;padding:7px 14px;border-radius:999px;background:var(--paper-2);border:1px solid var(--line);color:var(--ink-soft);}

/* booking session list */
.session{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;padding:22px 0;border-bottom:1px solid var(--line);}
.session:last-child{border-bottom:none;}
.session .s-price{font-family:var(--serif);font-size:22px;color:var(--ink);white-space:nowrap;}

/* prose */
.prose p{margin-bottom:18px;color:var(--ink-soft);}
.prose p strong{color:var(--ink);font-weight:600;}

/* ---------- footer ---------- */
.footer{background:var(--espresso);color:#C9C0B2;padding:56px 0 40px;}
.footer .wrap{display:flex;justify-content:space-between;align-items:flex-start;flex-wrap:wrap;gap:28px;}
.footer .f-brand{font-family:var(--serif);font-size:22px;color:var(--paper);font-weight:600;}
.footer .f-tag{font-size:14px;margin-top:8px;max-width:34ch;color:#A89E8F;}
.footer nav{display:flex;flex-direction:column;gap:10px;}
.footer nav a{color:#C9C0B2;text-decoration:none;font-size:15px;}
.footer nav a:hover{color:var(--paper);}
.footer .f-legal{width:100%;border-top:1px solid #3a332a;margin-top:30px;padding-top:22px;font-size:13px;color:#8A8071;}

.center{text-align:center;}
.mt-s{margin-top:14px;}.mt-m{margin-top:28px;}.mb-m{margin-bottom:28px;}