/* ===========================================================
   DirectSourceAI — shared design system
   Identity: an audit ledger, not a landing page. Every device
   (stamps, file numbers, hairline rules, mono figures) borrows
   from the vocabulary of a signed financial opinion.
   =========================================================== */

:root{
  --bg:#0b0a08;
  --bg-alt:#131110;
  --card:#17140e;
  --ink:#f2efe6;
  --ink-dim:#b3ab98;
  --gold:#c9a227;
  --gold-bright:#e8bf4f;
  --yellow:#f4d35e;
  --oxblood:#8a2e2e;
  --oxblood-bright:#c14b3f;
  --hair:rgba(201,162,39,.35);
  --hair-soft:rgba(201,162,39,.18);

  --serif:'Fraunces', Georgia, 'Times New Roman', serif;
  --sans:'Inter', 'Segoe UI', system-ui, Arial, sans-serif;
  --mono:'IBM Plex Mono', ui-monospace, 'SF Mono', Consolas, monospace;

  --section-pad: clamp(64px, 9vw, 140px);
  --edge: 28px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important;}
}

body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:var(--sans); font-size:16px; line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block;}
a{color:inherit;}
h1,h2,h3{font-family:var(--serif); color:var(--ink); font-weight:600; margin:0 0 .5em; letter-spacing:-.01em;}
h1{font-size:clamp(2.6rem, 6.4vw, 5.6rem); line-height:.98; letter-spacing:-.02em; font-weight:600;}
h2{font-size:clamp(1.9rem, 4vw, 3rem); line-height:1.05; font-weight:600;}
h3{font-size:1.2rem; line-height:1.3; font-family:var(--serif); font-weight:600;}
p{margin:0 0 1em; color:var(--ink);}

.eyebrow{
  font-family:var(--mono); font-size:.74rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold-bright); font-weight:500; margin-bottom:1em; display:flex; align-items:center; gap:.7em;
}
.eyebrow::before{content:""; width:22px; height:1px; background:var(--gold-bright); display:inline-block;}

.container{max-width:1120px; margin:0 auto; padding:0 var(--edge);}
.wrap-narrow{max-width:760px; margin:0 auto; padding:0 var(--edge);}

/* ---- skip link ---- */
.skip-link{
  position:absolute; left:-999px; top:auto; background:var(--gold-bright); color:#161206;
  padding:12px 18px; font-family:var(--mono); font-size:.8rem; z-index:200; text-decoration:none;
}
.skip-link:focus{left:16px; top:16px;}

/* ---- focus ---- */
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible, select:focus-visible{
  outline:2px solid var(--gold-bright); outline-offset:3px;
}

/* ---- topbar ---- */
.topbar{background:#050504; border-bottom:1px solid var(--hair-soft); font-size:.78rem; color:var(--ink-dim); font-family:var(--mono);}
.topbar .wrap{max-width:1220px; margin:0 auto; padding:0 var(--edge); display:flex; justify-content:space-between; align-items:center; height:38px; flex-wrap:wrap; gap:6px;}
.topbar a{color:var(--gold-bright); text-decoration:none;}

/* ---- header/nav ---- */
header.site{position:sticky; top:0; z-index:80; background:rgba(11,10,8,.98); border-bottom:1px solid var(--hair-soft);}
.nav-inner{max-width:1220px; margin:0 auto; padding:16px var(--edge); display:flex; align-items:center; justify-content:space-between; gap:16px 24px; flex-wrap:wrap;}
.brand{font-family:var(--serif); font-weight:600; font-size:1.3rem; color:var(--ink); text-decoration:none; white-space:nowrap; letter-spacing:-.01em;}
.brand span{color:var(--gold-bright); font-style:italic;}

nav.links{display:flex; gap:24px; flex-wrap:wrap; font-family:var(--mono); font-size:.72rem; letter-spacing:.08em; text-transform:uppercase;}
nav.links a{text-decoration:none; color:var(--ink-dim); padding:6px 0; border-bottom:2px solid transparent; transition:border-color .15s, color .15s;}
nav.links a:hover, nav.links a.active{border-color:var(--gold-bright); color:var(--gold-bright);}

.nav-cta{font-family:var(--mono); font-size:.72rem; font-weight:500; letter-spacing:.06em; text-transform:uppercase; border:1px solid var(--gold-bright); color:var(--gold-bright); padding:10px 18px; text-decoration:none; white-space:nowrap; transition:background .15s,color .15s;}
.nav-cta:hover{background:var(--gold-bright); color:#161206;}

.nav-toggle{display:none; background:none; border:1px solid var(--hair); color:var(--ink); width:42px; height:38px; align-items:center; justify-content:center; cursor:pointer; padding:0;}
.nav-toggle svg{width:18px; height:18px;}

@media (max-width:640px){
  nav.links{display:none;}
  .nav-cta{display:none;}
  .nav-toggle{display:flex;}
  .nav-inner{position:relative;}
  body.nav-open{overflow:hidden;}
  body.nav-open nav.links{
    display:flex; flex-direction:column; gap:0; position:fixed; top:0; left:0; right:0; bottom:0;
    background:var(--bg); padding:96px var(--edge) 100px; z-index:70; overflow-y:auto;
  }
  body.nav-open nav.links a{font-size:1.05rem; padding:16px 0; border-bottom:1px solid var(--hair-soft); width:100%;}
  body.nav-open .nav-cta{
    display:block; position:fixed; left:var(--edge); right:var(--edge); bottom:24px;
    z-index:80; text-align:center; background:var(--bg);
  }
}

/* ---- hero ---- */
.hero{padding:calc(var(--section-pad) * .8) 0 var(--section-pad); position:relative; overflow:hidden; border-bottom:1px solid var(--hair-soft);}
.hero .container{position:relative; z-index:2;}
.hero-sub{font-size:1.14rem; color:var(--ink-dim); max-width:600px; margin-bottom:2em;}
.hero-ctas{display:flex; gap:14px; flex-wrap:wrap; margin-top:8px;}

.btn{display:inline-block; font-family:var(--mono); font-weight:500; font-size:.82rem; letter-spacing:.05em; text-transform:uppercase; padding:15px 26px; text-decoration:none; border:1px solid var(--gold-bright); transition:background .15s,color .15s,border-color .15s;}
.btn-primary{background:var(--gold-bright); border-color:var(--gold-bright); color:#161206;}
.btn-primary:hover{background:var(--yellow); border-color:var(--yellow);}
.btn-ghost{background:transparent; color:var(--ink); border-color:var(--hair);}
.btn-ghost:hover{border-color:var(--gold-bright); color:var(--gold-bright);}

/* ---- stamps: the signature element ----
   Real audit-stamp vocabulary: double border, ink texture, slight
   misregistration. Gold = neutral verdicts. Oxblood = the one that
   ends the project — the only place red ink appears on the site. */
.stamp-row{display:flex; gap:22px; flex-wrap:wrap; margin:46px 0 6px;}
.stamp{
  position:relative; font-family:var(--mono); font-weight:500; font-size:.8rem; letter-spacing:.14em;
  text-transform:uppercase; color:var(--gold-bright); border:3px double var(--gold-bright);
  padding:13px 20px; border-radius:1px; transform:rotate(-3deg);
  background:radial-gradient(ellipse at 30% 20%, rgba(232,191,79,.08), transparent 70%);
}
.stamp::after{
  content:""; position:absolute; inset:3px; border:1px solid currentColor; opacity:.25; pointer-events:none;
}
.stamp:nth-child(2){transform:rotate(2deg);}
.stamp:nth-child(3){transform:rotate(-1.5deg);}
.stamp:nth-child(4){transform:rotate(2.5deg); color:var(--oxblood-bright); border-color:var(--oxblood-bright); background:radial-gradient(ellipse at 30% 20%, rgba(193,75,63,.1), transparent 70%);}
.stamp.solo{transform:rotate(-2.5deg); font-size:.86rem;}

/* ---- ledger rule ---- */
.ledger-rule{border:0; border-top:1px solid var(--hair); border-bottom:3px double var(--hair); height:4px; margin:52px 0;}
.ledger-rule.tight{margin:30px 0;}

/* ---- sections ---- */
section{padding:var(--section-pad) 0;}
section.alt{background:var(--bg-alt);}
.section-head{max-width:660px; margin-bottom:40px;}

/* scroll reveal (JS adds .is-visible on intersect) */
.reveal{opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s ease;}
.reveal.is-visible{opacity:1; transform:none;}

/* ---- stat band ---- */
.stat-band{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--hair); border:1px solid var(--hair);}
.stat{padding:34px 28px; background:var(--bg-alt);}
.stat .num{font-family:var(--serif); font-weight:600; font-size:2.5rem; color:var(--gold-bright); line-height:1;}
.stat .lbl{font-family:var(--sans); font-size:.85rem; color:var(--ink-dim); margin-top:12px; line-height:1.55;}

/* ---- cards ---- */
.card-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:1px; background:var(--hair); border:1px solid var(--hair);}
.card{background:var(--bg-alt); padding:34px 30px; transition:background .2s;}
.card:hover{background:var(--card);}
.card .tag{font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; font-weight:500; color:var(--gold-bright); margin-bottom:12px; display:block;}
.card p{color:var(--ink-dim); font-size:.95rem; margin-bottom:1.1em;}
.card a.more{font-family:var(--mono); font-size:.78rem; font-weight:500; text-transform:uppercase; letter-spacing:.05em; color:var(--gold-bright); text-decoration:none; display:inline-flex; align-items:center; gap:.4em;}
.card a.more:hover{text-decoration:underline;}

/* ---- process/phase list ---- */
.phase{display:grid; grid-template-columns:64px 1fr; gap:20px; padding:28px 0; border-top:1px solid var(--hair);}
.phase:last-child{border-bottom:1px solid var(--hair);}
.phase .n{font-family:var(--serif); font-weight:600; font-size:2.1rem; color:transparent; -webkit-text-stroke:1.5px var(--gold-bright);}
.phase h3{margin-bottom:.3em; color:var(--gold-bright);}
.phase .days{font-family:var(--mono); font-size:.72rem; font-weight:500; letter-spacing:.1em; text-transform:uppercase; color:var(--gold-bright); margin-bottom:.5em; display:block;}

/* ---- framework list ---- */
.fw-item{display:grid; grid-template-columns:1fr 3fr; gap:18px; padding:24px 0; border-top:1px solid var(--hair); align-items:baseline;}
.fw-item:last-child{border-bottom:1px solid var(--hair);}
.fw-item .fw-name{font-family:var(--serif); font-weight:600; font-size:1rem; color:var(--gold-bright);}
.fw-item p{margin:0; color:var(--ink-dim); font-size:.95rem;}

/* ---- pricing block ---- */
.price-block{border:1px solid var(--hair); padding:38px 34px; background:var(--card); display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px;}
.price-block .amount{font-family:var(--serif); font-weight:600; font-size:2.5rem; color:var(--gold-bright);}
.price-block .term{font-family:var(--mono); font-size:.76rem; color:var(--ink-dim); text-transform:uppercase; letter-spacing:.06em;}

/* ---- founder portrait ---- */
.founder-block{display:grid; grid-template-columns:110px 1fr; gap:34px; align-items:start;}
@media (max-width:700px){.founder-block{grid-template-columns:1fr; text-align:center;}}
.founder-photo{width:110px; height:110px; border-radius:50%; overflow:hidden; border:2px solid var(--gold-bright); padding:3px; margin:6px 0 0; box-shadow:0 0 0 1px var(--hair);}
.founder-photo img{width:100%; height:100%; object-fit:cover; border-radius:50%; display:block;}
@media (max-width:700px){.founder-photo{margin:0 auto;} .founder-block .btn{margin:0 auto;}}
.guarantee{border-left:3px solid var(--gold-bright); padding:4px 0 4px 22px; margin:36px 0;}
.guarantee p{font-size:1.03rem; color:var(--ink);}

/* ---- photo band (editorial figure) ---- */
.photo-figure{border:1px solid var(--hair); overflow:hidden; margin:0;}
.photo-figure img{width:100%; height:100%; object-fit:cover; aspect-ratio:16/10; filter:grayscale(.15) contrast(1.05);}
.photo-figure figcaption{font-family:var(--mono); font-size:.72rem; color:var(--ink-dim); padding:12px var(--edge); letter-spacing:.03em; border-top:1px solid var(--hair-soft);}
.photo-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--hair); border:1px solid var(--hair);}
.photo-grid .photo-figure{border:0;}
@media (max-width:760px){.photo-grid{grid-template-columns:1fr;}}

/* ---- contact layout ---- */
.contact-grid{display:grid; grid-template-columns:1.2fr 1fr; gap:60px; align-items:start;}
@media (max-width:760px){.contact-grid{grid-template-columns:1fr; gap:44px;}}

/* ---- forms ---- */
form.contact{display:grid; gap:18px; max-width:560px;}
label{font-family:var(--mono); font-size:.74rem; font-weight:500; text-transform:uppercase; letter-spacing:.06em; color:var(--ink-dim); display:block; margin-bottom:7px;}
input, select, textarea{width:100%; padding:13px 14px; border:1px solid var(--hair); background:var(--bg); font-family:var(--sans); font-size:.95rem; color:var(--ink);}
input:focus, select:focus, textarea:focus{outline:none; border-color:var(--gold-bright);}
textarea{min-height:130px; resize:vertical;}

/* ---- checklist ---- */
.check-list{list-style:none; margin:0; padding:0;}
.check-list li{padding:17px 0 17px 34px; border-top:1px solid var(--hair); position:relative; color:var(--ink-dim); font-size:.95rem;}
.check-list li:last-child{border-bottom:1px solid var(--hair);}
.check-list li::before{content:"—"; position:absolute; left:0; color:var(--gold-bright); font-weight:700;}

/* ---- blog ---- */
.post-grid{display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1px; background:var(--hair); border:1px solid var(--hair);}
.post-card{background:var(--bg-alt); padding:32px 30px; text-decoration:none; color:inherit; display:block; transition:background .2s;}
.post-card:hover{background:var(--card);}
.post-card .meta{font-family:var(--mono); font-size:.72rem; color:var(--gold-bright); letter-spacing:.08em; text-transform:uppercase; margin-bottom:14px; display:block;}
.post-card h3{margin-bottom:.5em;}
.post-card p{color:var(--ink-dim); font-size:.92rem; margin-bottom:0;}
article.post{max-width:700px; margin:0 auto;}
article.post .meta{font-family:var(--mono); font-size:.78rem; color:var(--gold-bright); letter-spacing:.06em; text-transform:uppercase; margin-bottom:1.6em; display:block;}
article.post h2{margin-top:1.4em;}
article.post p{color:var(--ink); font-size:1.03rem;}
article.post blockquote{border-left:3px solid var(--gold-bright); margin:2em 0; padding:.2em 0 .2em 24px; font-family:var(--serif); font-size:1.2rem; color:var(--ink-dim); font-style:italic;}

/* ---- shop / pricing menu ---- */
.menu-list{display:flex; flex-direction:column; border:1px solid var(--hair);}
.menu-item{display:grid; grid-template-columns:1fr auto; gap:24px; align-items:center; padding:32px var(--edge); border-top:1px solid var(--hair);}
.menu-item:first-child{border-top:0;}
.menu-item .file-no{font-family:var(--mono); font-size:.7rem; color:var(--gold); letter-spacing:.1em; margin-bottom:.6em; display:block;}
.menu-item h3{margin-bottom:.35em;}
.menu-item p{color:var(--ink-dim); font-size:.92rem; margin-bottom:0; max-width:520px;}
.menu-item .side{text-align:right; display:flex; flex-direction:column; align-items:flex-end; gap:12px;}
.menu-item .amount{font-family:var(--serif); font-weight:600; font-size:1.7rem; color:var(--gold-bright); white-space:nowrap;}
.menu-item .range{font-family:var(--mono); font-size:.82rem; color:var(--ink-dim); white-space:nowrap;}
@media (max-width:640px){
  .menu-item{grid-template-columns:1fr;}
  .menu-item .side{align-items:flex-start; text-align:left;}
}
.badge-fixed{display:inline-block; font-family:var(--mono); font-size:.65rem; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-bright); border:1px solid var(--gold-bright); padding:3px 8px; margin-bottom:8px;}

/* ---- logo strip (client wordmarks) ---- */
.logo-strip{padding:56px 0; border-top:1px solid var(--hair-soft);}
.logo-strip .eyebrow{margin-bottom:26px;}
.logo-row{display:flex; flex-wrap:wrap; gap:28px 44px; align-items:center;}
.logo-row .wordmark{
  font-family:var(--serif); font-weight:600; font-size:1.05rem; color:var(--ink-dim);
  letter-spacing:.01em; white-space:nowrap; opacity:.7; filter:grayscale(1);
  transition:opacity .2s, color .2s, filter .2s;
}
.logo-row .wordmark:hover{opacity:1; color:var(--ink); filter:grayscale(0);}
.logo-row .wordmark .amp{font-style:italic; color:var(--gold);}

/* ---- footer ---- */
footer.site{background:var(--bg-alt); border-top:1px solid var(--hair-soft); color:var(--ink-dim); padding:60px 0 30px; margin-top:40px;}
footer.site .container{display:flex; justify-content:space-between; flex-wrap:wrap; gap:34px;}
footer.site h4{font-family:var(--mono); font-size:.76rem; letter-spacing:.08em; text-transform:uppercase; color:var(--gold-bright); margin-bottom:16px;}
footer.site a{color:var(--ink-dim); text-decoration:none; font-size:.9rem; display:block; margin-bottom:9px;}
footer.site a:hover{color:var(--gold-bright);}
footer.site .brandf{font-family:var(--serif); font-size:1.35rem; color:var(--ink); margin-bottom:12px;}
.footer-bottom{max-width:1220px; margin:36px auto 0; padding:24px var(--edge) 0; border-top:1px solid var(--hair-soft); font-family:var(--mono); font-size:.76rem; color:var(--ink-dim); display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}

@media (max-width:760px){
  .stat-band{grid-template-columns:1fr;}
  .fw-item, .phase{grid-template-columns:1fr;}
  .price-block{flex-direction:column; align-items:flex-start;}
  section{padding:calc(var(--section-pad) * .7) 0;}
}