/* ====== Legality Static (based on latest Containers JSON) ====== */
:root{
  --brand-red:#8f1e1f;
  --brand-navy:#213f8d;
  --brand-light:#f5f7fb;
  --ink:#22313f;
  --muted:#5f6f82;
  --stone:#e7ecf3;
  --radius:12px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#fff;color:var(--ink);font-family:'DM Sans',system-ui,Arial,sans-serif;line-height:1.7}
h1,h2,h3{font-family:'Playfair Display',serif;color:var(--brand-navy);margin:0 0 .4em}
p{margin:0 0 1em;color:var(--muted)}
a{color:var(--brand-navy);text-decoration:none}

/* Layout helpers */
.wrap{max-width:1140px;margin:auto;padding:0 20px}
.center{text-align:center}
.narrow{max-width:820px;margin-left:auto;margin-right:auto}
.section{padding:96px 0}
.soft{background:var(--brand-light)}
.full {
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
}

/* Header */
.site-header {
  background: #fff;
  border-bottom: 1px solid #e7ecf3;
  position: sticky;
  top: 0;
  z-index: 100;
}
.site-header .wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 16px;
  padding-block: 12px;
}
.site-logo {
  height: 60px;
  width: auto;
}
.main-nav a {
  margin: 0 12px;
  color: var(--brand-navy);
  font-weight: 700;
  text-decoration: none;
}
.main-nav .btn-outline {
  border: 2px solid var(--brand-red);
  border-radius: 12px;
  color: var(--brand-red);
  padding: 8px 18px;
  transition: 0.2s ease;
}
.main-nav .btn-outline:hover {
  background: var(--brand-red);
  color: #fff;
}

/* Hero */
.hero{background:linear-gradient(180deg,var(--brand-light),#fff)}
.hero-logo{height:96px;width:auto;object-fit:contain;display:block;margin:0 auto 10px}
.lead{font-size:1.05rem}
.cta-row{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-top:8px}

/* ---- Hero buttons: override parent/Elementor defaults ---- */
.hero-legality .elementor-button,
.hero-legality .elementor-button:before,
.hero-legality .elementor-button:after {
  background-image: none !important;
  box-shadow: none !important;
  text-shadow: none !important;
}

/* Primary (solid red) */
.hero-legality .cta-primary.elementor-button,
.hero-legality .cta-primary.elementor-button.elementor-size-md {
  background: var(--brand-red) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 12px 22px !important;
  font-weight: 700 !important;
}
.hero-legality .cta-primary.elementor-button:hover {
  background: #751717 !important;
}

/* Secondary (outline red) */
.hero-legality .cta-outline.elementor-button {
  background: transparent !important;
  color: var(--brand-red) !important;
  border: 2px solid var(--brand-red) !important;
  border-radius: 12px !important;
  padding: 12px 22px !important;
  font-weight: 700 !important;
}
.hero-legality .cta-outline.elementor-button:hover {
  background: var(--brand-red) !important;
  color: #fff !important;
}

/* Make sure inner text inherits our color */
.hero-legality .elementor-button .elementor-button-text {
  color: inherit !important;
}

/* Cards */
.cards{display:grid;gap:16px;margin-top:18px}
.cards.four{grid-template-columns:repeat(4,1fr)}
.cards.three{grid-template-columns:repeat(3,1fr)}
.card{background:#fff;border:1px solid var(--stone);border-radius:18px;padding:20px;box-shadow:0 8px 24px rgba(17,31,61,.06)}
.card h3{font:700 18px/1.3 'DM Sans',sans-serif;color:var(--brand-navy);margin:0 0 6px}
.card.quote p{font-style:italic;position:relative;padding-left:14px}
.card.quote p::before{content:'“';position:absolute;left:-4px;top:-10px;font-size:44px;color:var(--brand-red);opacity:.2}
.card:hover{transform:translateY(-4px);transition:transform .25s ease}

/* Contact */
.contact-grid{display:grid;grid-template-columns:1fr .9fr;gap:24px;margin-top:20px}
.panel{background:#fff;border:1px solid var(--stone);border-radius:18px;padding:18px;box-shadow:0 8px 20px rgba(17,31,61,.05)}
label{font-size:14px;color:#516274;display:block;margin-bottom:6px}
input,textarea{width:100%;padding:12px 14px;border-radius:12px;border:1px solid #d7dde3;font:inherit}
textarea{min-height:120px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px}
.panel.info h3{margin-top:0;color:var(--brand-navy)}
.panel hr{border:none;border-top:1px solid var(--stone);margin:12px 0}

/* Footer */
.site-footer {
  background: var(--brand-navy);
  color: #dfe6ff;
  text-align: center;
  padding-block: 32px;
	max-width:100%!important;
}
.site-footer .wrap {
  max-width: 1140px;
}
.site-footer a {
  color: #fff;
  text-decoration: none;
}
.site-footer a:hover {
  text-decoration: underline;
}

/* Responsive */
@media (max-width:1000px){
  .cards.four{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
  .contact-grid{grid-template-columns:1fr}
}
@media (max-width:560px){
  .cards.four{grid-template-columns:1fr}
  .cards.three{grid-template-columns:1fr}
  .site-logo{height:36px}
}


/* ===== HERO CTA FIX (alignment + brand colors) ===== */

/* Align both buttons in one row */
.hero-legality .elementor-widget-button {
  display: inline-block;
  margin: 0 6px; /* gap */
}

.hero-legality .elementor-widget-wrap {
  text-align: center;
}

/* Remove Elementor's default gradient/bg */
.hero-legality .elementor-button,
.hero-legality .elementor-button:before,
.hero-legality .elementor-button:after {
  background: none !important;
  box-shadow: none !important;
}

/* Primary */
.hero-legality .cta-primary .elementor-button {
  background: var(--brand-red) !important;
  color: #fff !important;
  border: none !important;
  border-radius: 12px !important;
  padding: 12px 22px !important;
  font-weight: 700 !important;
  transition: 0.2s ease;
}
.hero-legality .cta-primary .elementor-button:hover {
  background: #721717 !important;
}

/* Secondary */
.hero-legality .cta-outline .elementor-button {
  background: transparent !important;
  color: var(--brand-red) !important;
  border: 2px solid var(--brand-red) !important;
  border-radius: 12px !important;
  padding: 12px 22px !important;
  font-weight: 700 !important;
}
.hero-legality .cta-outline .elementor-button:hover {
  background: var(--brand-red) !important;
  color: #fff !important;
}

/* Ensure button text inherits */
.hero-legality .elementor-button-text {
  color: inherit !important;
}