/* Obsidian Podcast Co. — site styles
   Sections: 1 reset  2 layout  3 type  4 header/nav  5 buttons
             6 ledger  7 cards  8 pricing  9 lists  10 media  11 footer  12 responsive */

/* 1 reset ------------------------------------------------------------------ */

*{box-sizing:border-box}

html{scroll-behavior:smooth}

body{
  margin:0;
  background:#07080b;
  color:#f3f1ed;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  font-size:16px;
  -webkit-font-smoothing:antialiased;
  -webkit-text-size-adjust:100%;
  text-size-adjust:100%;
  overflow-wrap:break-word;
}

a{color:inherit;text-decoration:none}
a:hover{opacity:.85}
img,svg{max-width:100%}
h1,h2,h3{margin:0}
p{margin:0}

.sprite{display:none}

:root{
  --ink:#f3f1ed;
  --body:#b3ada5;
  --muted:#948f88;
  --gold:#e0a548;
  --hair:rgba(243,241,237,.10);
  --gold-hair:rgba(224,165,72,.32);
  --gold-rule:linear-gradient(90deg,#8a5a15,#e0a548);
  --cta-just:flex-start;
  --cta-row-just:space-between;
}

/* 2 layout ----------------------------------------------------------------- */

.page{min-height:100vh;overflow-x:clip}

.wrap{max-width:1260px;margin:0 auto;padding:0 clamp(20px,5vw,56px)}

section{border-bottom:1px solid var(--hair)}
section.alt{background:#0a0b0f}
section.plain{border-bottom:none}

.sec{padding-top:clamp(72px,9vw,120px);padding-bottom:clamp(72px,9vw,120px)}
.sec-sm{padding-top:clamp(72px,9vw,110px);padding-bottom:clamp(72px,9vw,110px)}
.sec-hero{padding-top:clamp(64px,9vw,110px);padding-bottom:clamp(64px,9vw,110px)}
.sec-strip{padding-top:64px;padding-bottom:64px}

.hero{background:radial-gradient(1100px 520px at 12% 8%,rgba(196,124,32,.16),transparent 62%)}
.band{background:radial-gradient(900px 420px at 20% 50%,rgba(196,124,32,.20),#0a0b0f 70%)}

.grid{display:grid}
.grid-hero{grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:clamp(48px,7vw,90px);align-items:center}
.grid-2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:24px}
.grid-3{grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px}
.grid-4{grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:clamp(28px,3.5vw,40px)}
.grid-work{grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:clamp(28px,4vw,40px);margin-bottom:clamp(48px,6vw,72px)}
.grid-split{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:clamp(32px,4vw,48px);align-items:center}
.grid-contact{grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:clamp(40px,6vw,70px);align-items:center}

.stack{display:flex;flex-direction:column}

.divider{margin-top:clamp(48px,6vw,64px);padding-top:32px;border-top:1px solid var(--hair)}

/* 3 type ------------------------------------------------------------------- */

.display{font-family:'Plus Jakarta Sans',sans-serif;letter-spacing:-.032em;font-weight:700}

.eyebrow{
  font-size:12px;letter-spacing:.12em;text-transform:uppercase;
  color:#a7a198;font-weight:600;margin-bottom:20px;
}
.eyebrow span{
  display:inline-block;width:18px;height:1px;background:var(--gold-rule);
  vertical-align:middle;margin-right:12px;
}

.h1{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:clamp(47px,9vw,78px);line-height:.99;letter-spacing:-.042em;font-weight:800;
  margin-bottom:26px;text-wrap:pretty;
}
.h1 .soft{display:block;color:var(--muted);font-weight:500}

.h1-page{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:clamp(34px,6.4vw,56px);line-height:1.04;letter-spacing:-.036em;font-weight:700;
  margin-bottom:22px;
}

.h2{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:clamp(29px,5.5vw,48px);line-height:1.07;letter-spacing:-.032em;font-weight:700;
  max-width:24ch;text-wrap:pretty;margin-bottom:24px;
}
.h2-sm{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:clamp(26px,5.1vw,44px);line-height:1.07;letter-spacing:-.032em;font-weight:700;
  max-width:24ch;margin-bottom:54px;
}
.h3{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:clamp(24px,4.1vw,36px);line-height:1.1;letter-spacing:-.03em;font-weight:700;
  margin-bottom:24px;
}

.soft{color:var(--muted);font-weight:500}
.dot{font-style:normal;color:var(--gold)}
.h1 .dot{font-weight:800}
.dot-sm{font-style:normal;color:var(--gold);font-size:.5em;vertical-align:baseline}

.lead{color:var(--body);font-size:16px;line-height:1.72;max-width:760px;margin-bottom:54px}
.lead-wide{max-width:860px}
.lead-tight{max-width:700px}

.body{color:var(--body);font-size:16px;line-height:1.7}
.body-loose{line-height:1.75}

.mono{
  font-family:ui-monospace,SFMono-Regular,Menlo,monospace;
  font-size:11px;color:#7a838d;text-transform:uppercase;letter-spacing:.14em;
}
.mono-lg{font-size:15px;color:#7a838c}

/* 4 header / nav ----------------------------------------------------------- */

.bar{
  position:sticky;top:0;z-index:60;
  background:rgba(7,8,11,.92);
  -webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--hair);
}
.bar header{
  max-width:1260px;margin:0 auto;
  padding:clamp(7px,1.6vw,14px) clamp(20px,5vw,56px);
  min-height:clamp(46px,11vw,60px);
  display:flex;align-items:center;justify-content:space-between;
  gap:16px 24px;flex-wrap:wrap;
}
.logo{flex:none}
.logo svg,.menu-top svg{width:clamp(124px,31vw,190px);height:auto;color:var(--ink);display:block}

.nav-desktop{
  display:flex;align-items:center;flex-wrap:wrap;
  gap:14px clamp(14px,2.2vw,28px);
  text-transform:uppercase;font-size:12px;font-weight:600;letter-spacing:.10em;color:#c7c3bd;
}
.nav-desktop a{white-space:nowrap}

.burger{
  display:none;width:44px;height:38px;flex:none;
  flex-direction:column;justify-content:center;gap:5px;padding:0 11px;
  background:transparent;border:1px solid rgba(243,241,237,.28);cursor:pointer;
}
.burger span{display:block;height:1.5px;background:var(--ink)}
.burger span:last-child{background:var(--gold)}
.burger:hover,.close:hover{border-color:rgba(243,241,237,.6)}

.menu{
  position:fixed;inset:0;z-index:90;background:#07080b;
  display:none;flex-direction:column;overflow-y:auto;
  padding:14px clamp(20px,6vw,44px) clamp(28px,6vw,44px);
}
.menu.open{display:flex;animation:obsMenuIn .3s cubic-bezier(.22,.61,.36,1) forwards}
.menu.closing{display:flex;animation:obsMenuOut .24s ease forwards}
.menu-top{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:46px;flex:none}
.close{
  width:44px;height:38px;flex:none;display:flex;align-items:center;justify-content:center;
  background:transparent;border:1px solid rgba(243,241,237,.28);cursor:pointer;color:var(--ink);
  font-family:'Plus Jakarta Sans',sans-serif;font-size:20px;line-height:1;
}
.menu nav{display:flex;flex-direction:column;margin-top:clamp(28px,7vw,48px);border-top:1px solid var(--gold-hair)}
.menu nav a{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:22px 0;border-bottom:1px solid var(--hair);color:var(--ink);
  font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;
  font-size:clamp(26px,7vw,34px);line-height:1.1;letter-spacing:-.03em;
}
.menu nav a b{color:var(--gold);font-size:20px}

@keyframes obsMenuIn{from{transform:translateX(100%)}to{transform:translateX(0)}}
@keyframes obsMenuOut{from{transform:translateX(0)}to{transform:translateX(100%)}}

/* 5 buttons ---------------------------------------------------------------- */

.btn{
  display:inline-flex;align-items:center;min-height:48px;padding:0 23px;
  font-family:'Plus Jakarta Sans',sans-serif;font-size:12px;font-weight:700;
  letter-spacing:.075em;text-transform:uppercase;
  transition:transform .15s ease,background .15s ease,color .15s ease;
}
.btn-primary{background:var(--ink);color:#07080b;border:1px solid var(--ink)}
.btn-primary:hover{transform:translateY(-2px);opacity:1}
.btn-lg{min-height:56px;padding:0 32px;font-size:13px}
.btn-nowrap{white-space:nowrap}

.btn-nav{
  border:1px solid rgba(243,241,237,.78);padding:13px 18px;
  font-family:'Plus Jakarta Sans',sans-serif;font-weight:700;letter-spacing:.075em;
}
.btn-nav:hover{background:var(--ink);color:#07080b;opacity:1}

.cta-row{display:flex;gap:20px;align-items:center;flex-wrap:wrap;justify-content:var(--cta-just)}
.cta-end{display:flex;justify-content:var(--cta-just)}
.cta-split{
  margin-top:44px;padding-top:36px;border-top:1px solid var(--hair);
  display:flex;align-items:center;justify-content:var(--cta-row-just);flex-wrap:wrap;gap:24px;
}
.cta-split p{max-width:52ch}

/* CTA band headline sits tighter to its paragraph than section headlines do */
.h2-band{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:clamp(26px,5.1vw,44px);line-height:1.1;letter-spacing:-.032em;font-weight:700;
  max-width:20ch;margin-bottom:18px;
}
.band .body{max-width:52ch}

/* 6 ledger ----------------------------------------------------------------- */

.ledger{border-top:1px solid var(--gold-hair)}
.ledger > .row{padding:30px 0 32px;border-bottom:1px solid var(--hair)}
.ledger > .row:last-child{border-bottom:none}

.row-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:clamp(20px,3vw,36px);align-items:start;
}
.row-grid.baseline{align-items:baseline}

.row-lead{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:clamp(24px,3.4vw,30px);line-height:1.2;letter-spacing:-.028em;font-weight:500;
  color:var(--ink);text-wrap:pretty;
}
.row-title{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:clamp(24px,3.7vw,32px);line-height:1.15;letter-spacing:-.03em;font-weight:700;
}
.row-detail{padding-top:6px}
.row-detail strong{
  display:block;color:var(--ink);margin-bottom:7px;
  font-family:'Plus Jakarta Sans',sans-serif;font-size:17px;font-weight:700;letter-spacing:-.02em;
}
.row-detail p{color:var(--body);font-size:16px;line-height:1.6;max-width:44ch}
.row-grid > p.copy{color:var(--body);font-size:16px;line-height:1.7;max-width:52ch}

/* FAQ rows */
.faq-row{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:clamp(20px,4vw,56px);padding:32px 0 34px;border-bottom:1px solid var(--hair);
}
.faq-row:last-child{border-bottom:none}
.faq-row h3{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:22px;line-height:1.25;letter-spacing:-.028em;font-weight:600;
}

/* show rows */
.show-row{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));
  align-items:center;gap:clamp(24px,4vw,56px);
  padding:34px 0 36px;border-bottom:1px solid var(--hair);
}
.show-row:last-child{border-bottom:none}
.show-row h3{
  font-family:'Plus Jakarta Sans',sans-serif;margin-bottom:10px;
  font-size:clamp(24px,3.4vw,30px);line-height:1.15;letter-spacing:-.03em;font-weight:700;
}
.show-copy{color:var(--body);font-size:16px;line-height:1.6;max-width:48ch}

.show-meta{margin-top:18px}
.show-meta h3{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:21px;line-height:1.3;letter-spacing:-.025em;font-weight:700;color:var(--ink);
  text-wrap:pretty;
}
.show-meta p{margin-top:10px;color:var(--body);font-size:16px;line-height:1.6;max-width:48ch}

/* 7 cards ------------------------------------------------------------------ */

.card{
  padding:clamp(28px,3vw,40px);
  border:1px solid var(--hair);border-radius:12px;background:#0c0e12;
}
.card-gold{
  position:relative;
  border-color:rgba(224,165,72,.34);
  background:linear-gradient(165deg,rgba(196,124,32,.18),#120c06 62%);
}
.card-gold .tick{
  position:absolute;left:clamp(28px,3vw,40px);top:0;width:56px;height:2px;
  background:linear-gradient(90deg,#e0a548,rgba(224,165,72,0));
}
.card h3{
  font-family:'Plus Jakarta Sans',sans-serif;margin-bottom:18px;
  font-size:clamp(24px,3.9vw,34px);line-height:1.12;letter-spacing:-.03em;font-weight:700;
}
.card > p{margin-bottom:22px;color:var(--body);font-size:16px;line-height:1.72}

.pillar-rule{height:1px;width:48px;background:var(--gold-rule);margin-bottom:20px}
.pillar h3{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:21px;letter-spacing:-.025em;font-weight:700;margin-bottom:10px;
}
.pillar p{color:var(--body);font-size:16px;line-height:1.7}

/* 8 pricing ---------------------------------------------------------------- */

.price-card{
  display:flex;flex-direction:column;padding:clamp(28px,3vw,36px);
  border:1px solid var(--hair);border-radius:14px;background:#0c0e12;
}
.price-card--rec{
  border-color:rgba(224,165,72,.34);
  background:radial-gradient(700px 320px at 100% 0%,rgba(196,124,32,.16),#0c0e12 68%);
}
.price-card .cat{margin-bottom:26px}
.price-card .starting{margin-bottom:12px}
.price-figure{display:flex;align-items:baseline;gap:10px;margin-bottom:20px}
.price-figure .amount{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:46px;font-weight:800;letter-spacing:-.035em;line-height:1;
}
.price-figure .per{color:var(--body);font-size:16px}
.price-custom{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:28px;font-weight:700;letter-spacing:-.03em;line-height:1.15;
  margin:23px 0 20px;
}
.rule{height:1px;width:64px;background:var(--gold-rule);margin-bottom:22px}
.price-card p{color:var(--body);font-size:16px;line-height:1.75}
.price-card .price-desc{margin-bottom:30px}
.price-card .includes-label{margin-bottom:18px}

/* 9 lists ------------------------------------------------------------------ */

.bullets{
  list-style:none;margin:0;padding:0;
  display:flex;flex-direction:column;gap:12px;
  color:var(--body);font-size:16px;line-height:1.5;
}
.bullets li{display:grid;grid-template-columns:16px 1fr;gap:12px}
.bullets li::before{content:none}
.marker{color:var(--gold)}

.bullets-grid{
  list-style:none;margin:0;padding:0;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px 24px;
}
.bullets-grid li{
  display:grid;grid-template-columns:16px 1fr;gap:12px;
  color:var(--body);font-size:16px;line-height:1.5;
}

/* flow line */
.flow{display:flex;flex-wrap:wrap;align-items:center;gap:clamp(16px,2.2vw,26px);margin-bottom:44px}
.flow span{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:clamp(22px,3.4vw,31px);line-height:1.1;letter-spacing:-.03em;font-weight:700;
  white-space:nowrap;
}
.flow span.soft{color:var(--muted);font-weight:700}
.flow b{color:var(--gold);font-size:clamp(20px,2.6vw,25px);line-height:1}

.flow-detail{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:clamp(24px,4vw,56px);padding-top:36px;border-top:1px solid var(--hair);
}
.flow-detail strong{
  display:block;color:var(--ink);margin-bottom:8px;
  font-family:'Plus Jakarta Sans',sans-serif;font-size:17px;font-weight:700;letter-spacing:-.02em;
}
.flow-detail p{color:var(--body);font-size:16px;line-height:1.75}

/* 10 media ----------------------------------------------------------------- */

.hero-copy{max-width:560px;margin-bottom:30px;color:var(--body);font-size:16px;line-height:1.7}
.hero-img{width:100%;aspect-ratio:820/580;object-fit:cover;border-radius:14px;display:block}

.logo-strip{
  display:flex;align-items:center;justify-content:center;
  gap:clamp(32px,6vw,72px);flex-wrap:wrap;opacity:.75;
}
.logo-strip img{height:44px;width:auto;object-fit:contain}
.strip-label{text-align:center;margin-bottom:44px}

.cal-shell{
  border:1px solid rgba(224,165,72,.20);border-radius:12px;
  background:linear-gradient(165deg,rgba(196,124,32,.08),#0c0e12 55%);overflow:hidden;
}
.cal-shell > div{width:100%;min-height:340px}

.contact-copy{color:var(--body);line-height:1.72;font-size:16px;max-width:440px}
.contact-hr{height:1px;background:rgba(243,241,237,.12);margin:36px 0 32px;max-width:440px}
.contact-meta{display:flex;flex-direction:column;gap:22px}
.contact-meta .mono{margin-bottom:7px}
.contact-meta a,.contact-meta p{color:var(--ink);font-size:16px;line-height:1.6}

/* 11 footer ---------------------------------------------------------------- */

.site-footer{border-top:1px solid var(--hair);position:sticky;top:100vh}
.footer-grid{
  max-width:1260px;margin:0 auto;
  padding:56px clamp(20px,5vw,56px) 40px;
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:40px;
}
.footer-mark{max-width:320px;display:flex;align-items:center}
.footer-mark svg{width:80%;max-width:256px;height:auto;color:var(--ink);margin:0 auto;display:block}
.footer-links{display:flex;flex-direction:column;gap:10px;font-size:15px;color:#b8b2a9}
.footer-col .mono{margin-bottom:16px}
.footer-col a{display:block;color:#b8b2a9;font-size:15px}
.legal{
  max-width:1260px;margin:0 auto;
  padding:24px clamp(20px,5vw,56px);border-top:1px solid var(--hair);
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px;
  color:#777f87;font-size:11px;letter-spacing:.15em;text-transform:uppercase;
}

/* 12 responsive ------------------------------------------------------------ */

@media (max-width:900px){
  :root{--cta-just:center;--cta-row-just:center}
  .nav-desktop{display:none}
  .burger{display:flex}
  .hero-eyebrow{display:none}
}

.tlink{
  display:inline-flex;align-items:center;
  font-size:11px;font-weight:600;letter-spacing:.085em;text-transform:uppercase;
  color:#c7c3bd;text-decoration:none;
}
.tlink b{color:var(--gold);margin-left:7px}
.show-link{margin-top:16px}

@media (max-width:700px){
  .show-link{
    display:flex;justify-content:center;align-items:center;
    width:100%;min-height:48px;padding:0 22px;margin-top:20px;
    border:1px solid rgba(243,241,237,.78);
    font-family:'Plus Jakarta Sans',sans-serif;
    font-size:12px;font-weight:700;letter-spacing:.075em;color:var(--ink);
  }
  .show-link:hover{background:var(--ink);color:#07080b;opacity:1}
  .show-link:hover b{color:#07080b}
}