/* ===== THEME ===== */
:root {
  --navy:#071A33; --navy-deep:#030C1A; --navy-light:#0E2A50;
  --gold:#D4AF37; --gold-light:#FFE28A; --gold-dark:#9A7B1C;
  --cream:#FFF8E7; --ink:#0A1628; --red:#C0392B; --red-dark:#7a1a15;
}

/* ===== BASE ===== */
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0; background: var(--navy); color: var(--cream);
  font-family: "Lora", Georgia, serif; font-size: 17px; line-height: 1.65;
}
img { max-width: 100%; display: block; }
a { color: var(--gold-light); }
.wrap { max-width: 1080px; margin: 0 auto; padding: 0 1.5rem; }
section { padding: 5rem 0; }

.display { font-family: "Playfair Display", Georgia, serif; font-weight: 900; text-transform: uppercase; letter-spacing: .04em; line-height: 1.05; }
.caps    { font-family: "Cinzel", "Playfair Display", serif; font-weight: 800; text-transform: uppercase; letter-spacing: .28em; }
.italic  { font-family: "Playfair Display", serif; font-style: italic; }

.foil {
  background: linear-gradient(180deg, var(--gold-light) 0%, var(--gold) 45%, var(--gold-dark) 55%, var(--gold-light) 100%);
  -webkit-background-clip: text; background-clip: text; color: transparent;
  filter: drop-shadow(0 2px 0 rgba(0,0,0,.55));
}
.eyebrow { color: var(--gold); font-size: .78rem; margin: 0 0 1rem; }
h2.display { font-size: clamp(2rem, 5vw, 3.2rem); text-align: center; margin: 0 0 .4em; }
.lead { font-size: 1.25rem; text-align: center; max-width: 720px; margin: 0 auto 2.5rem; opacity: .92; }

/* ===== ORNAMENTS ===== */
.stars { display: flex; align-items: center; gap: 1rem; margin: 2.5rem 0; color: var(--gold); font-size: 1.15rem; letter-spacing: .6em; }
.stars::before, .stars::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, transparent, var(--gold)); }
.stars::after { background: linear-gradient(90deg, var(--gold), transparent); }
.stars span { white-space: nowrap; padding-left: .6em; }
.stars-big span { font-size: 1.8rem; text-shadow: 0 0 12px rgba(241,215,122,.6); }
.on-cream .stars { color: var(--gold-dark); }
.on-cream .stars::before { background: linear-gradient(90deg, transparent, var(--gold-dark)); }
.on-cream .stars::after  { background: linear-gradient(90deg, var(--gold-dark), transparent); }

.plaque {
  border: 3px double var(--gold); outline: 1px solid var(--gold); outline-offset: 6px;
  padding: 3rem 2rem; position: relative;
  background: radial-gradient(ellipse at top, var(--navy-light), var(--navy) 70%);
}
.plaque::before, .plaque::after { content: "★"; color: var(--gold); position: absolute; top: -.9rem; font-size: 1.4rem; background: var(--navy); padding: 0 .4rem; }
.plaque::before { left: 1.5rem; } .plaque::after { right: 1.5rem; }

.seal {
  width: 130px; height: 130px; border-radius: 50%; flex: 0 0 auto;
  border: 3px double var(--gold); display: grid; place-items: center; text-align: center; padding: .6rem;
  color: var(--gold); font-family: "Cinzel", serif; font-weight: 800; font-size: .58rem; letter-spacing: .16em; line-height: 1.4;
  background: radial-gradient(circle, var(--navy-light), var(--navy-deep));
  box-shadow: 0 0 0 6px var(--navy), 0 0 0 7px var(--gold), 0 10px 25px rgba(0,0,0,.5);
}
.seal b { display: block; font-size: 1.45rem; letter-spacing: .05em; margin: .15em 0; }
.on-cream .seal { box-shadow: 0 0 0 6px var(--cream), 0 0 0 7px var(--gold), 0 10px 25px rgba(0,0,0,.25); }

/* ===== UI ===== */
.btn {
  display: inline-block; padding: .95rem 2.1rem; text-decoration: none;
  font-family: "Cinzel", serif; font-weight: 800; letter-spacing: .2em; text-transform: uppercase; font-size: .82rem;
  border: 2px solid var(--gold); color: var(--gold-light); transition: transform .12s, box-shadow .12s;
}
.btn:hover { transform: translateY(-2px); }
.btn-gold {
  background: linear-gradient(180deg, var(--gold-light), var(--gold) 50%, var(--gold-dark));
  color: var(--navy-deep); border-color: var(--gold-dark);
  box-shadow: 0 4px 0 var(--gold-dark), 0 8px 18px rgba(0,0,0,.45); text-shadow: 0 1px 0 rgba(255,255,255,.35);
}
.btn-red { background: var(--red); color: #fff; border-color: var(--red-dark); box-shadow: 0 4px 0 var(--red-dark), 0 8px 18px rgba(0,0,0,.45); }
.badge {
  display: inline-block; padding: .35rem .9rem; font-family: "Cinzel", serif; font-weight: 800; font-size: .68rem; letter-spacing: .2em;
  color: var(--navy-deep); background: var(--gold); transform: rotate(-2deg); box-shadow: 2px 2px 0 var(--gold-dark);
}
.badge-red { background: var(--red); color: #fff; box-shadow: 2px 2px 0 var(--red-dark); transform: rotate(2deg); }
.phone { font-family: "Playfair Display", serif; font-weight: 900; font-size: clamp(1.8rem, 5vw, 2.6rem); color: var(--gold-light); letter-spacing: .02em; }
.row { display: flex; flex-wrap: wrap; gap: 1.2rem; align-items: center; justify-content: center; }

/* ===== HERO ===== */
.hero { padding-top: 4rem; }
.hero .plaque { text-align: center; }
.hero h1 { font-size: clamp(2.4rem, 7vw, 5rem); margin: 0 0 .25em; }
.hero .tag { font-size: clamp(1.15rem, 2.6vw, 1.5rem); margin: 0 0 1rem; opacity: .92; }
.portrait-hero {
  width: min(320px, 75vw); aspect-ratio: 3/4; margin: 1.5rem auto; border: 3px solid var(--gold);
  background: linear-gradient(180deg, var(--navy-light), var(--navy-deep)); display: grid; place-items: center; overflow: hidden;
  color: var(--gold-dark); font-family: "Cinzel", serif; font-size: .7rem; letter-spacing: .2em; text-align: center;
  box-shadow: 0 0 40px rgba(201,162,39,.35), inset 0 -60px 80px rgba(0,0,0,.5);
}
.portrait-hero img { width: 100%; height: 100%; object-fit: cover; }
.hero .call { margin-top: 2.2rem; }

/* ===== AWARDS STRIP ===== */
.awards { padding: 3.5rem 0; background: var(--navy-deep); border-top: 1px solid var(--gold-dark); border-bottom: 1px solid var(--gold-dark); }
.awards .row { gap: 2.2rem; }
.awards .seal { box-shadow: 0 0 0 6px var(--navy-deep), 0 0 0 7px var(--gold), 0 10px 25px rgba(0,0,0,.5); }
.awards .eyebrow { text-align: center; margin-bottom: 2rem; }

/* ===== SERVICES ===== */
.services .grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1.6rem; }
.card { border: 1px solid var(--gold-dark); padding: 2rem 1.6rem; background: linear-gradient(180deg, rgba(255,255,255,.03), transparent); position: relative; }
.card::before { content: "★"; color: var(--gold); position: absolute; top: -.8rem; left: 50%; transform: translateX(-50%); background: var(--navy); padding: 0 .5rem; }
.card .icon { font-size: 2.4rem; text-align: center; margin-bottom: .6rem; filter: sepia(1) saturate(3) hue-rotate(5deg); }
.card h3 { font-family: "Cinzel", serif; font-size: .95rem; letter-spacing: .18em; text-transform: uppercase; color: var(--gold-light); text-align: center; margin: 0 0 .8rem; }
.card p { margin: 0; font-size: .98rem; opacity: .9; }
.card .price { display: block; margin-top: 1rem; text-align: center; font-family: "Cinzel", serif; font-size: .7rem; letter-spacing: .2em; color: var(--gold); }

/* ===== PRINCIPAL (cream) ===== */
.on-cream { background: var(--cream); color: var(--ink); }
.on-cream .eyebrow { color: var(--gold-dark); }
.on-cream h2.display { color: var(--ink); }
.principal .cols { display: grid; grid-template-columns: 1fr 1.6fr; gap: 3rem; align-items: center; }
.portrait-bio { border: 3px solid var(--gold); outline: 1px solid var(--gold); outline-offset: 6px; aspect-ratio: 3/4; overflow: hidden; background: var(--navy); display: grid; place-items: center; color: var(--gold-dark); font-family: "Cinzel", serif; font-size: .7rem; letter-spacing: .2em; text-align: center; }
.portrait-bio img { width: 100%; height: 100%; object-fit: cover; }
.principal h2.display { text-align: left; }
.principal .caption { font-size: .85rem; text-align: center; margin-top: 1rem; color: var(--gold-dark); }
.creds { list-style: none; padding: 0; margin: 1.5rem 0 0; }
.creds li { padding: .4rem 0 .4rem 1.8rem; position: relative; border-bottom: 1px dotted var(--gold); }
.creds li::before { content: "★"; color: var(--gold-dark); position: absolute; left: 0; }
@media (max-width: 760px) { .principal .cols { grid-template-columns: 1fr; } .principal h2.display { text-align: center; } }

/* ===== TESTIMONIALS ===== */
.testimonials .grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 2rem; }
.quote { font-style: italic; font-size: 1.15rem; position: relative; padding: 1.5rem 1.5rem 1.5rem 3rem; border-left: 2px solid var(--gold-dark); }
.quote::before { content: "\201C"; position: absolute; left: .6rem; top: .2rem; font-family: "Playfair Display", serif; font-size: 4rem; color: var(--gold); line-height: 1; }
.quote cite { display: block; font-style: normal; font-family: "Cinzel", serif; font-size: .68rem; letter-spacing: .2em; color: var(--gold); margin-top: .8rem; }
.quote .rating { color: var(--gold); letter-spacing: .2em; font-style: normal; font-size: .9rem; display: block; margin-top: .3rem; }

/* ===== CTA / CONTACT ===== */
.contact { text-align: center; background: radial-gradient(ellipse at center, var(--navy-light), var(--navy) 70%); }
.contact .badges { margin: 1.5rem 0 2rem; }