/* Light theme with brand accents */
:root{
  --navy:#0c1530;
  --navy-2:#f7f8fb;
  --gold:#caa24d;
  --gold-2:#b9902f;
  --text:#0c1530;
  --muted:#5c6480;
  --white:#ffffff;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  line-height:1.6;
  color:var(--text);
  background:var(--white);
}
.container{width:min(1100px, 92%); margin:0 auto}

/* Header */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,.85);
  backdrop-filter:saturate(140%) blur(6px);
  border-bottom:1px solid rgba(12,21,48,.08);
}
.nav{display:flex; align-items:center; justify-content:space-between; padding:16px 0}
.brand{font-weight:700; letter-spacing:.5px; text-decoration:none; color:var(--gold);}
.brand span{color:var(--gold-2)}
#nav{display:flex; gap:22px; align-items:center}
#nav a{color:var(--navy); text-decoration:none; opacity:.9}
#nav a:hover{opacity:1; color:var(--gold-2)}
.nav-toggle{display:none; background:none; border:0; color:var(--navy); font-size:24px}

/* Hero */
.hero{padding:88px 0 72px; background: radial-gradient(60% 80% at 70% 10%, rgba(202,162,77,.12), transparent 60%)}
.logo-title{
  font-family: "Playfair Display", serif;
  font-size: clamp(40px, 6.2vw, 76px);
  line-height:1.05; letter-spacing:1.2px;
  margin:0 0 8px;
  color:var(--gold);
}
.logo-title span{color:var(--gold-2)}
.tagline{font-size: clamp(16px, 2.2vw, 22px); color:var(--text); opacity:.95; margin:0 0 28px}
.hero-inner{display:flex; flex-direction:column; align-items:flex-start}

/* Sections */
.section{padding:64px 0; background:var(--white)}
.section.alt{background:var(--navy-2)}
.section h2{
  font-family:"Playfair Display", serif;
  color:var(--gold);
  margin:0 0 18px;
  font-size: clamp(26px, 3.2vw, 34px);
}

/* Cards */
.cards{display:grid; grid-template-columns: repeat(3, 1fr); gap:18px}
.card{
  background:var(--white);
  border:1px solid rgba(12,21,48,.08);
  padding:20px; border-radius:14px;
  box-shadow:0 6px 18px rgba(12,21,48,.06);
}
.card h3{margin-top:0; color:var(--navy)}

/* Process */
.steps{margin:0; padding-left:20px}
.steps li{margin:10px 0}

/* Example engagements */
.examples{display:grid; grid-template-columns: repeat(3,1fr); gap:32px; margin-top:26px}
.example h3{font-family:"Playfair Display", serif; color:var(--gold-2); font-size:22px; margin:10px 0 10px}
.ex-icon{height:40px; display:flex; align-items:center; justify-content:center; margin-bottom:8px; color:var(--gold-2)}
.ex-icon svg{width:36px; height:36px}
.ex-list{margin:8px 0 0; padding-left:18px}

/* Two column about */
.two-col{display:grid; grid-template-columns: 1.2fr .8fr; gap:26px; align-items:start}
.highlight{background:var(--white); border:1px solid rgba(12,21,48,.10); border-radius:12px; padding:16px; box-shadow:0 6px 18px rgba(12,21,48,.06)}

/* Contact */
.contact-form{max-width:720px}
.contact-form .grid{display:grid; grid-template-columns:1fr 1fr; gap:16px}
label span{display:block; font-size:14px; color:var(--muted); margin-bottom:6px}
input, textarea{
  width:100%; padding:12px 14px; border-radius:10px;
  border:1px solid rgba(12,21,48,.16); background:rgba(12,21,48,.01);
  color:var(--text)
}
input:focus, textarea:focus{outline:2px solid rgba(202,162,77,.35); border-color:transparent}
.small{color:var(--muted)}

/* Footer */
.site-footer{padding:28px 0; background:var(--white); border-top:1px solid rgba(12,21,48,.08)}
.footer-inner{display:flex; justify-content:space-between; align-items:center}
.footer-links{display:flex; gap:18px}
.footer-links a{color:var(--navy); text-decoration:none}

/* Buttons */
.btn{display:inline-block; padding:12px 18px; border-radius:30px; text-decoration:none; font-weight:600}
.btn-primary{background:var(--gold); color:#1b1b1b}
.btn-primary:hover{filter:brightness(1.05)}
.btn-outline{border:1px solid rgba(12,21,48,.18); padding:10px 14px; border-radius:24px; color:var(--navy)}

/* Embeds */
.iframe-wrap{position:relative; width:100%; max-width:100%; height:600px; border:1px solid rgba(12,21,48,.10); border-radius:12px; overflow:hidden; background:rgba(12,21,48,.02)}
.iframe-wrap iframe{width:100%; height:100%; border:0}

/* Pricing */
.pricing{display:grid; grid-template-columns: repeat(3,1fr); gap:18px}
.price-card{
  background:var(--white);
  border:1px solid rgba(12,21,48,.10);
  border-radius:16px;
  padding:22px;
  display:flex; flex-direction:column; gap:14px;
  box-shadow:0 6px 18px rgba(12,21,48,.06);
}
.price-card h3{margin:0 0 6px; color:var(--navy)}
.price{font-size:28px; font-weight:700}
.price .amount{color:var(--navy)}
.price .per{font-weight:500; opacity:.85; margin-left:6px}
.price-card .features{margin:0; padding-left:18px; display:flex; flex-direction:column; gap:8px}
.price-card.featured{outline:2px solid var(--gold); background:rgba(202,162,77,.06)}
.price-card .btn{align-self:flex-start; margin-top:4px}

/* Responsive */
@media (max-width: 860px){
  .cards{grid-template-columns:1fr}
  .two-col{grid-template-columns:1fr}
  .contact-form .grid{grid-template-columns:1fr}
  #nav{display:none; position:absolute; right:4%; top:56px; background:rgba(255,255,255,.98); padding:12px; border-radius:10px; border:1px solid rgba(12,21,48,.08); flex-direction:column}
  .nav-toggle{display:block}
  .pricing{grid-template-columns:1fr}
  .examples{grid-template-columns:1fr}
}

/* Founder portrait */
.portrait.round{border-radius:999px}
.portrait.small{width:140px;height:140px;object-fit:cover;display:block;margin:0 auto 12px;border:2px solid var(--gold);}
.highlight.founder{text-align:center}