/* Center the container on the page */
.roofr-widget-container {
    width: 100%; /* Full width of its container */
    max-width: 800px; /* Limit width on larger screens */
    margin: 0 auto; /* Center horizontally */
    text-align: center; /* Align content */
}

/* Make the iframe responsive */
.roofr-widget-container iframe {
    width: 100%; /* Adjust width dynamically */
    height: auto; /* Scale height proportionally */
    max-width: 100%; /* Prevent overflow */
    border: none; /* Remove borders */
}

/* Adjust for smaller screens (mobile) */
@media (max-width: 768px) {
    .roofr-widget-container {
        padding: 0 10px; /* Add padding for small screens */
    }

    .roofr-widget-container iframe {
        height: 500px; /* Adjust height for mobile */
    }
}
/* ===== Roof Revival • Christmas Lights Landing (CSS) ===== */

/* Fonts (serif headings + clean sans body) */
@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:wght@700&family=Inter:wght@400;600&display=swap');

:root{
  --rr-bg:#FAF7F2;         /* warm cream */
  --rr-text:#111111;       /* near-black */
  --rr-muted:#6b6b6b;
  --rr-border:#E6E1D9;
  --rr-dark:#111111;
  --rr-white:#ffffff;
}

html,body{
  background:var(--rr-bg) !important;
  color:var(--rr-text);
  font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
}

/* Utility containers */
.rr-container{
  max-width: 980px;
  margin: 0 auto;
  padding: 0 22px;
}

.rr-hero-lights{
  background:var(--rr-bg);
}
.rr-hero-lights svg{
  width:100%;
  height:auto;
  display:block;
}

/* Hero */
.rr-hero{
  text-align:center;
  padding: clamp(48px, 10vw, 96px) 0 32px;
}
.rr-hero h1{
  font-family:"Playfair Display", Georgia, serif;
  font-weight:700;
  font-size: clamp(28px, 5vw, 48px);
  line-height:1.15;
  margin:0 0 10px;
  color:var(--rr-text);
}
.rr-sub{
  font-size: clamp(15px, 2.4vw, 18px);
  color:var(--rr-text);
  opacity:.85;
  margin:0 0 22px;
}

/* Buttons */
.rr-btn{
  display:inline-block;
  font-weight:600;
  text-decoration:none;
  padding:14px 24px;
  border-radius:8px;
  transition:transform .06s ease, opacity .2s ease, background .2s ease, color .2s ease, border-color .2s ease;
}
.rr-btn:active{ transform: translateY(1px); }

.rr-btn-dark{ background:var(--rr-dark); color:var(--rr-white); }
.rr-btn-dark:hover{ opacity:.9; }

.rr-btn-light{ background:var(--rr-white); color:var(--rr-dark); border:1px solid var(--rr-border); }
.rr-btn-light:hover{ background:#f4f2ee; }

.rr-btn-outline{ background:transparent; color:var(--rr-white); border:1px solid rgba(255,255,255,.7); }
.rr-btn-outline:hover{ background:rgba(255,255,255,.08); }

/* Quote (form) */
.rr-quote{
  padding: 18px 0 12px;
  text-align:center;
}
.rr-quote h2{
  font-family:"Playfair Display", Georgia, serif;
  font-weight:700;
  font-size: clamp(22px, 3.6vw, 34px);
  margin: 6px 0 18px;
}
.rr-card{
  background:var(--rr-white);
  border:1px solid var(--rr-border);
  border-radius:12px;
  padding: clamp(16px, 4vw, 28px);
  box-shadow: 0 8px 24px rgba(17,17,17,.06);
  max-width: 720px;
  margin: 0 auto;
  text-align:left;
}
.rr-note{
  display:block;
  margin-top:10px;
  color:var(--rr-muted);
}

