:root {
  --burgundy: #5e0914;
  --burgundy-2: #7a1424;
  --wine-deep: #3d060f;
  --gold: #c08d58;
  --gold-deep: #a67a45;
  --cream: #faf5eb;
  --paper: #fffdf8;
  --ink: #26190f;
  --body: #4c3d2e;
  --muted: #7a6a58;
  --line: #e7dcc4;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: "Jost", system-ui, -apple-system, "Segoe UI", sans-serif;
  background: var(--cream);
  color: var(--ink);
  line-height: 1.55;
  -webkit-font-smoothing: antialiased;
}
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* ---------- hero ---------- */
.hero { text-align: center; padding: 54px 20px 6px; }
.eyebrow {
  font-size: 12px; font-weight: 600; letter-spacing: .34em; text-transform: uppercase;
  color: var(--gold-deep);
}
.plaque {
  display: inline-block; background: #fff; margin-top: 22px;
  padding: 26px 34px 20px;
  border: 1px solid var(--gold);
  outline: 1px solid rgba(192, 141, 88, .45); outline-offset: 5px;
  box-shadow: 0 24px 50px rgba(94, 9, 20, .10);
}
.hero-logo { width: 424px; max-width: 76vw; height: auto; display: block; }
.tagline {
  margin-top: 32px;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 600; font-size: clamp(28px, 4.6vw, 41px); line-height: 1.15;
  color: var(--burgundy);
}
.grule {
  position: relative; width: 132px; height: 2px; margin: 22px auto 0;
  background: var(--gold);
  animation: drawIn 1.1s .5s cubic-bezier(.22, .61, .21, 1) backwards;
}
.grule::after {
  content: "◆"; position: absolute; left: 50%; top: 50%;
  transform: translate(-50%, -50%);
  background: var(--cream); padding: 0 9px;
  color: var(--gold-deep); font-size: 9px;
}
.intro { max-width: 648px; margin: 22px auto 0; font-size: 17.5px; line-height: 1.68; color: var(--body); }
.rise { animation: riseIn .95s cubic-bezier(.22, .61, .21, 1) backwards; animation-delay: var(--d, 0s); }
@keyframes riseIn { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
@keyframes drawIn { from { transform: scaleX(0); } to { transform: scaleX(1); } }

/* ---------- creed band ---------- */
.creed {
  margin-top: 60px; text-align: center; padding: 54px 22px 58px;
  background: linear-gradient(160deg, #4a060f 0%, #751527 55%, #4a060f 100%);
  color: #f6ead2;
}
.eyebrow-light { color: #d9b878; }
.values {
  margin-top: 16px;
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 600; font-size: clamp(24px, 4.4vw, 37px); line-height: 1.3;
}
.values .dia { color: var(--gold); font-size: .42em; vertical-align: .55em; padding: 0 .3em; }
.creed-line { margin: 16px auto 0; max-width: 620px; color: #e8d5ae; font-size: 16.5px; line-height: 1.65; }

/* ---------- companies ---------- */
.companies { max-width: 1140px; margin: 0 auto; padding: 66px 20px 6px; }
.sec-head { text-align: center; }
.sec-head h2 {
  font-family: "Cormorant Garamond", Georgia, serif;
  font-weight: 700; font-size: clamp(31px, 5vw, 43px); color: var(--burgundy);
}
.lede {
  margin-top: 4px;
  font-family: "Cormorant Garamond", Georgia, serif; font-style: italic;
  font-size: 20.5px; color: var(--muted);
}
.cards { margin-top: 38px; display: grid; grid-template-columns: repeat(2, 1fr); gap: 26px; max-width: 920px; margin-left: auto; margin-right: auto; }
.card {
  position: relative; overflow: hidden;
  display: flex; flex-direction: column; text-align: center;
  background: var(--paper); border: 1px solid var(--line); border-radius: 14px;
  padding: 30px 26px 28px;
  box-shadow: 0 10px 26px rgba(94, 9, 20, .06);
  transition: transform .55s cubic-bezier(.22, .61, .21, 1), box-shadow .55s ease;
}
.card .bar {
  position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: var(--accent); opacity: .9;
  transform: scaleX(.3); transform-origin: left;
  transition: transform .65s cubic-bezier(.22, .61, .21, 1);
}
.tile {
  display: flex; align-items: center; justify-content: center;
  height: 148px; padding: 12px; margin-bottom: 19px;
  background: #fff; border: 1px solid #f0e7d3; border-radius: 10px;
}
.tile-dark { background: #101010; border-color: #101010; }
.tile-photo { padding: 0; overflow: hidden; }
.tile-photo img { width: 100%; height: 100%; max-width: none; max-height: none; object-fit: cover; object-position: 50% 28%; }
.tile img { max-height: 100%; max-width: 100%; width: auto; object-fit: contain; transition: transform .6s cubic-bezier(.22, .61, .21, 1); }
.card h3 { font-family: "Cormorant Garamond", Georgia, serif; font-weight: 700; font-size: 28px; line-height: 1.1; }
.card h3 a { color: var(--ink); text-decoration: none; }
.card h3 a:hover { color: var(--burgundy); }
.what { margin-top: 6px; font-size: 12.5px; font-weight: 600; letter-spacing: .17em; text-transform: uppercase; color: var(--gold-deep); }
.line { margin-top: 10px; font-family: "Cormorant Garamond", Georgia, serif; font-style: italic; font-weight: 600; font-size: 19.5px; color: var(--burgundy); }
.desc { margin-top: 9px; font-size: 15px; line-height: 1.62; color: var(--body); flex: 1; }
.phone { margin-top: 16px; font-weight: 600; font-size: 16.5px; }
.phone a { color: var(--ink); text-decoration: none; border-bottom: 1px solid rgba(192, 141, 88, .55); padding-bottom: 1px; }
.phone a:hover { color: var(--burgundy); border-bottom-color: var(--burgundy); }
.visit {
  display: inline-block; margin-top: 15px; padding-top: 14px;
  border-top: 1px solid var(--line);
  font-size: 13px; font-weight: 600; letter-spacing: .15em; text-transform: uppercase;
  color: var(--burgundy); text-decoration: none;
}
.visit .arr { display: inline-block; transition: transform .45s cubic-bezier(.22, .61, .21, 1); }
@media (hover: hover) and (pointer: fine) {
  .card:hover { transform: translateY(-4px); box-shadow: 0 20px 40px rgba(94, 9, 20, .12); }
  .card:hover .bar { transform: scaleX(1); }
  .card:hover .tile img { transform: scale(1.04); }
  .visit:hover .arr { transform: translateX(4px); }
}

/* ---------- more under the standard ---------- */
.more { max-width: 730px; margin: 62px auto 0; padding: 0 22px; text-align: center; }
.more-text { margin-top: 14px; font-size: 16.5px; line-height: 1.72; color: var(--body); }
.more-text a { color: var(--burgundy); font-weight: 500; text-decoration: none; border-bottom: 1px solid rgba(192, 141, 88, .6); }
.more-text a:hover { border-bottom-color: var(--burgundy); }

/* ---------- footer ---------- */
.site-footer {
  margin-top: 68px; padding: 40px 20px 36px; text-align: center;
  background: var(--wine-deep);
  color: #cdbb96; font-size: 14px;
}
.site-footer p + p { margin-top: 6px; }
.foot-brand {
  font-family: "Cormorant Garamond", Georgia, serif; font-weight: 700;
  font-size: 18px; letter-spacing: .26em; text-transform: uppercase; color: #f2e3c2;
}
.foot-brand .dia { color: var(--gold); font-size: .5em; vertical-align: .5em; padding: 0 .2em; }

/* ---------- scroll reveal (JS-gated; content is visible without JS) ---------- */
.js .rv { opacity: 0; }
.js .rv.in { opacity: 1; animation: riseIn .85s cubic-bezier(.22, .61, .21, 1) backwards; animation-delay: var(--d, 0s); }

@media (max-width: 980px) {
  .cards { grid-template-columns: 1fr; max-width: 560px; margin-left: auto; margin-right: auto; }
  .plaque { padding: 20px 20px 14px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .js .rv { opacity: 1; }
}
