/* California Business Opportunities, LLC — site styles
   Palette matches the print collateral: maroon #7B0F17, navy #1F3864. */

:root{
  --maroon:#7B0F17;
  --maroon-dark:#5E0B11;
  --navy:#1F3864;
  --navy-light:#2E4F86;
  --ink:#22262B;
  --body:#3F464E;
  --muted:#6B7280;
  --rule:#D9DCE1;
  --bg:#FFFFFF;
  --bg-soft:#F5F6F8;
  --max:1080px;
}

*,*::before,*::after{box-sizing:border-box;}

html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;}

body{
  margin:0;
  background:var(--bg);
  color:var(--body);
  font:400 17px/1.65 -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}

img{max-width:100%;height:auto;display:block;}

a{color:var(--navy);text-decoration:none;}
a:hover{text-decoration:underline;}

h1,h2,h3,h4{
  font-family:Georgia,"Times New Roman",Times,serif;
  color:var(--ink);
  line-height:1.22;
  margin:0 0 .5em;
  font-weight:700;
}
h1{font-size:2.35rem;}
h2{font-size:1.65rem;}
h3{font-size:1.2rem;}
p{margin:0 0 1em;}

.wrap{max-width:var(--max);margin:0 auto;padding:0 22px;}

/* ---------- Header ---------- */
.topbar{background:var(--navy);color:#fff;font-size:.85rem;}
.topbar .wrap{display:flex;flex-wrap:wrap;gap:6px 22px;align-items:center;
  justify-content:space-between;padding-top:8px;padding-bottom:8px;}
.topbar a{color:#fff;}
.topbar .lic{color:#C3CCDD;}

.masthead{border-bottom:3px solid var(--maroon);background:#fff;}
.masthead .wrap{display:flex;flex-wrap:wrap;gap:14px 24px;
  align-items:center;justify-content:space-between;padding-top:20px;padding-bottom:18px;}
.brand{display:block;}
.brand .name{
  font-family:Georgia,"Times New Roman",Times,serif;
  font-size:1.55rem;font-weight:700;color:var(--navy);
  letter-spacing:.01em;line-height:1.15;display:block;
}
.brand .tag{
  display:block;margin-top:4px;font-size:.72rem;letter-spacing:.16em;
  text-transform:uppercase;color:var(--maroon);font-weight:700;
}
.calltag{text-align:right;}
.calltag .num{
  font-family:Georgia,serif;font-size:1.45rem;color:var(--maroon);
  font-weight:700;display:block;
}
.calltag .sub{font-size:.8rem;color:var(--muted);}

nav.main{background:var(--bg-soft);border-bottom:1px solid var(--rule);}
nav.main ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;}
nav.main a{
  display:block;padding:13px 18px;font-size:.82rem;font-weight:700;
  letter-spacing:.1em;text-transform:uppercase;color:var(--navy);
}
nav.main a:hover{background:#E8EAEF;text-decoration:none;}
nav.main a.active{color:#fff;background:var(--navy);}

/* ---------- Hero ---------- */
.hero{background:var(--navy);color:#fff;padding:52px 0 48px;}
.hero h1{color:#fff;max-width:20ch;}
.hero p{font-size:1.12rem;color:#D7DEEA;max-width:62ch;margin-bottom:0;}
.hero .eyebrow{
  font-size:.74rem;letter-spacing:.18em;text-transform:uppercase;
  color:#9FB3D4;font-weight:700;margin-bottom:12px;
}

.pagehead{background:var(--bg-soft);border-bottom:1px solid var(--rule);padding:38px 0 32px;}
.pagehead h1{margin-bottom:.2em;}
.pagehead p{color:var(--muted);margin:0;max-width:66ch;}

/* ---------- Sections ---------- */
section{padding:46px 0;}
section.soft{background:var(--bg-soft);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);}
.lead{font-size:1.1rem;max-width:68ch;}

.grid{display:grid;gap:24px;}
.grid.g3{grid-template-columns:repeat(3,1fr);}
.grid.g2{grid-template-columns:repeat(2,1fr);}

.card{
  border:1px solid var(--rule);border-top:4px solid var(--maroon);
  background:#fff;padding:22px 22px 24px;
}
.card h3{margin-bottom:.4em;}
.card p{font-size:.97rem;margin-bottom:.8em;}
.card .more{font-size:.85rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;}

.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
  padding:26px 0;margin:6px 0 0;}
.stat .n{font-family:Georgia,serif;font-size:2rem;color:var(--maroon);font-weight:700;line-height:1;}
.stat .l{font-size:.86rem;color:var(--muted);margin-top:6px;}

ul.ticks{list-style:none;padding:0;margin:0 0 1em;}
ul.ticks li{padding-left:20px;position:relative;margin-bottom:.55em;}
ul.ticks li::before{content:"";position:absolute;left:0;top:.55em;
  width:8px;height:8px;background:var(--maroon);}

.callout{border:1px solid var(--navy);background:var(--bg-soft);padding:20px 22px;margin:26px 0;}
.callout p:last-child{margin-bottom:0;}

.btn{
  display:inline-block;background:var(--maroon);color:#fff;
  padding:12px 24px;font-size:.85rem;font-weight:700;
  letter-spacing:.09em;text-transform:uppercase;border:0;
}
.btn:hover{background:var(--maroon-dark);text-decoration:none;color:#fff;}
.btn.alt{background:var(--navy);}
.btn.alt:hover{background:var(--navy-light);}

.cta{background:var(--maroon);color:#fff;padding:40px 0;}
.cta h2{color:#fff;margin-bottom:.3em;}
.cta p{color:#F2D9DB;max-width:60ch;}
.cta a.btn{background:#fff;color:var(--maroon);margin-top:8px;}
.cta a.btn:hover{background:#F2D9DB;color:var(--maroon-dark);}

.person{border:1px solid var(--rule);padding:24px;background:#fff;}
.person h3{margin-bottom:.15em;}
.person .role{font-size:.85rem;color:var(--maroon);font-weight:700;
  letter-spacing:.08em;text-transform:uppercase;margin-bottom:.9em;}
.person p{font-size:.97rem;}
.person .contact{font-size:.9rem;border-top:1px solid var(--rule);
  padding-top:12px;margin-top:14px;color:var(--muted);}

dl.facts{margin:0;}
dl.facts dt{font-weight:700;color:var(--ink);margin-top:14px;font-size:.95rem;}
dl.facts dd{margin:2px 0 0;}

/* ---------- Footer ---------- */
footer{background:var(--ink);color:#B9BFC7;padding:34px 0 28px;font-size:.9rem;}
footer a{color:#fff;}
footer .cols{display:grid;grid-template-columns:2fr 1fr 1fr;gap:26px;}
footer h4{color:#fff;font-size:.78rem;letter-spacing:.14em;
  text-transform:uppercase;margin-bottom:.7em;font-family:inherit;}
footer ul{list-style:none;padding:0;margin:0;}
footer li{margin-bottom:.4em;}
footer .legal{border-top:1px solid #3A4048;margin-top:26px;padding-top:16px;
  font-size:.82rem;color:#8B929B;}

/* ---------- Responsive ---------- */
@media (max-width:820px){
  .grid.g3,.grid.g2,footer .cols{grid-template-columns:1fr;}
  .stats{grid-template-columns:1fr;gap:14px;text-align:left;}
  h1{font-size:1.85rem;}
  h2{font-size:1.4rem;}
  .hero{padding:40px 0 36px;}
}

@media (max-width:620px){
  body{font-size:16px;}
  .masthead .wrap{flex-direction:column;align-items:flex-start;gap:10px;}
  .calltag{text-align:left;}
  .topbar .wrap{flex-direction:column;align-items:flex-start;gap:2px;}
  nav.main ul{display:grid;grid-template-columns:1fr 1fr;}
  nav.main a{padding:11px 14px;font-size:.74rem;border-bottom:1px solid var(--rule);}
  nav.main li:nth-child(odd) a{border-right:1px solid var(--rule);}
  section{padding:34px 0;}
  .btn{display:block;text-align:center;}
}

@media print{
  .topbar,nav.main,.cta,.btn{display:none;}
  body{font-size:11pt;color:#000;}
}

/* ---------- Hero proof panel ---------- */
.herogrid{display:grid;grid-template-columns:1.5fr 1fr;gap:38px;align-items:start;}
.hero h1{font-size:2.5rem;max-width:16ch;}
.herocta{margin-top:24px;display:flex;gap:12px;flex-wrap:wrap;}
.hero .herocta .btn.alt{background:transparent;border:1px solid #6B82AC;}
.hero .herocta .btn.alt:hover{background:var(--navy-light);}

.proof{background:rgba(255,255,255,.07);border:1px solid #3B5party;}
.proof{border:1px solid #3B5285;padding:6px 20px 14px;}
.proofrow{padding:12px 0;border-bottom:1px solid #354C7B;display:flex;
  align-items:baseline;gap:12px;}
.proofrow:last-child{border-bottom:0;}
.proofrow .n{font-family:Georgia,serif;font-size:1.75rem;font-weight:700;
  color:#fff;line-height:1;min-width:84px;}
.proofrow .l{font-size:.85rem;color:#C2CEE3;line-height:1.35;}
.proofrow.lic .l{font-size:.8rem;color:#9FB3D4;}

/* ---------- Affiliations strip ---------- */
.affil{background:var(--bg-soft);border-bottom:1px solid var(--rule);}
.affil .wrap{display:flex;flex-wrap:wrap;gap:8px 26px;align-items:center;
  padding-top:14px;padding-bottom:14px;font-size:.82rem;color:var(--muted);}
.affil .label{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--maroon);font-weight:700;}
.affil span:not(.label){border-left:1px solid var(--rule);padding-left:26px;}
.affil span:nth-child(2){border-left:0;padding-left:0;}

/* ---------- Broker portrait ---------- */
.whogrid{display:grid;grid-template-columns:1.6fr 1fr;gap:34px;align-items:start;
  margin-bottom:10px;}
figure.broker{margin:0;border:1px solid var(--rule);padding:14px;background:#fff;}
figure.broker img{width:100%;aspect-ratio:4/5;object-fit:cover;background:var(--bg-soft);}
figure.broker figcaption{font-size:.88rem;color:var(--body);padding-top:12px;line-height:1.45;}
figure.broker.noimg img{display:none;}
figure.broker.noimg::before{
  content:"Photograph of Angelo Izzo goes here";
  display:flex;align-items:center;justify-content:center;text-align:center;
  aspect-ratio:4/5;background:var(--bg-soft);border:1px dashed var(--rule);
  color:var(--muted);font-size:.82rem;padding:16px;
}

@media (max-width:820px){
  .herogrid,.whogrid{grid-template-columns:1fr;gap:26px;}
  .hero h1{font-size:1.9rem;max-width:none;}
  figure.broker{max-width:300px;}
  .affil .wrap{gap:4px 0;}
  .affil span:not(.label){border-left:0;padding-left:0;}
}

/* portrait: keep it compact so it doesn't open a gap beside short copy */
.whogrid{grid-template-columns:1fr 260px;gap:40px;}
figure.broker img,figure.broker.noimg::before{aspect-ratio:1/1;}

/* ---------- Two-product cards ---------- */
.card .tagline{font-size:.72rem;letter-spacing:.12em;text-transform:uppercase;
  font-weight:700;color:var(--muted);margin-bottom:6px;}
.card.free{border-top-color:var(--navy);}
.card.free .tagline{color:var(--navy);}
.card.paid .tagline{color:var(--maroon);}
.card ul.ticks{margin-top:14px;}
.card ul.ticks li{font-size:.94rem;}
.card .btn{margin-top:16px;}
.card.free .btn{background:var(--navy);}
.card.free .btn:hover{background:var(--navy-light);}

/* hero headline: keep it to three lines on desktop */
.hero h1{font-size:2.2rem;max-width:24ch;}
/* equal-height product cards with buttons aligned */
.grid.g2 .card.free,.grid.g2 .card.paid{display:flex;flex-direction:column;}
.grid.g2 .card.free .btn,.grid.g2 .card.paid .btn{margin-top:auto;align-self:flex-start;}

/* equal-weight primary service cards */
.card.big{border-top-width:5px;padding:26px 24px 28px;}
.card.big h3{font-size:1.35rem;}
.card.big p{font-size:1rem;}
.grid.primary{margin-bottom:4px;}
.person.solo{max-width:720px;}

/* ---------- Individualised-service band ---------- */
.band{background:var(--navy);color:#fff;padding:44px 0;}
.band h2{color:#fff;margin-bottom:.3em;}
.band .bandlead{color:#C9D5E8;max-width:70ch;font-size:1.06rem;margin-bottom:26px;}
.band .bandgrid h3{color:#fff;font-size:1.08rem;margin-bottom:.35em;}
.band .bandgrid p{color:#C2CEE3;font-size:.97rem;margin-bottom:0;}
.band .bandgrid > div{border-top:3px solid var(--maroon);padding-top:14px;}
.band .bandgrid{gap:26px 34px;}
