/* Randy's Towing — Location Page Styles */
:root {
    --rly-black:  #0a0a0a;
    --rly-blue:   #1565c0;
    --rly-gold:   #e8b84b;
    --rly-gray:   #f5f5f5;
    --rly-white:  #ffffff;
    --rly-text:   #222222;
    --font-head:  'Oswald', sans-serif;
    --font-body:  'Open Sans', sans-serif;
}

#randys-location-page * { box-sizing: border-box; }
#randys-location-page { font-family: var(--font-body); color: var(--rly-text); }

/* ── BUTTONS ── */
.rly-btn {
    display: inline-block;
    font-family: var(--font-head);
    font-weight: 600;
    font-size: 0.875rem;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    text-decoration: none;
    padding: 0.75rem 1.5rem;
    border-radius: 0.1875rem;
    border: 2px solid transparent;
    transition: background 0.2s, color 0.2s;
    cursor: pointer;
}
/* color forced with !important: Elementor's global link color otherwise wins the cascade on these <a> buttons */
.rly-btn--primary { background: var(--rly-gold); color: var(--rly-black) !important; }
.rly-btn--primary:hover { background: #d4a73a; color: var(--rly-black) !important; }
.rly-btn--outline  { background: transparent; color: var(--rly-white) !important; border-color: var(--rly-white); }
.rly-btn--outline:hover { background: var(--rly-white); color: var(--rly-black) !important; }
.rly-btn--gold     { background: var(--rly-gold); color: var(--rly-black) !important; }
.rly-btn--gold:hover { background: #d4a73a; color: var(--rly-black) !important; }
.rly-btn--lg { font-size: 1rem; padding: 1rem 2rem; }

/* ── SECTIONS ── */
.rly-section { padding: 4rem 2rem; max-width: 75rem; margin: 0 auto; }
.rly-section--light { background: var(--rly-white); max-width: 100%; padding: 4rem 2rem; }
.rly-section--light > * { max-width: 75rem; margin-left: auto; margin-right: auto; }
.rly-section--gray  { background: var(--rly-gray);  max-width: 100%; padding: 4rem 2rem; }
.rly-section--gray > * { max-width: 75rem; margin-left: auto; margin-right: auto; }
.rly-section__title { font-family: var(--font-head); font-size: 1.875rem; font-weight: 700; text-transform: uppercase; margin-bottom: 0.75rem; }
.rly-section__sub   { color: #555; margin-bottom: 2rem; font-size: 1rem; }
.rly-center { text-align: center; }
.rly-mt { margin-top: 2rem; }

/* ── HERO ── */
.rly-hero {
    position: relative;
    min-height: 45rem;
    display: flex;
    flex-direction: column;
    justify-content: center;
    overflow: hidden;
    background: var(--rly-black);
}
.rly-hero__bg {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
}
.rly-hero__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(90deg, rgba(0,0,0,0.88) 0%, rgba(0,0,0,0.55) 60%, rgba(0,0,0,0.15) 100%);
}
.rly-hero__content {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 75rem;          /* align to the site container instead of hugging the edge */
    margin: 0 auto;
    padding: 5rem 2.5rem 2.5rem;
}
.rly-hero__content > * { max-width: 38.75rem; }  /* keep the text column narrow, left-aligned within the container */
.rly-hero__badge {
    display: inline-block;
    background: var(--rly-blue);
    color: var(--rly-white);
    font-family: var(--font-head);
    font-size: 1rem;
    font-weight: 600;
    letter-spacing: 0.125rem;
    text-transform: uppercase;
    padding: 0.4375rem 1.125rem;
    border-radius: 0.125rem;
    margin-bottom: 1.125rem;
    margin-top: 5rem;
}
.rly-hero__h1 {
    font-family: var(--font-head);
    font-size: 1.875rem;
    font-weight: 700;
    line-height: 1.2;
    color: var(--rly-white);
    text-transform: uppercase;
    margin-bottom: 1rem;
}
.rly-hero__sub {
    color: rgba(255,255,255,0.85);
    font-size: 1rem;
    line-height: 1.6;
    margin-bottom: 1.75rem;
}
.rly-cta-group { display: flex; gap: 1rem; flex-wrap: wrap; }
.rly-hero__stats {
    position: relative;
    z-index: 1;
    display: flex;
    gap: 0;
    background: rgba(0,0,0,0.7);
    padding: 1.25rem 2.5rem;
    margin-top: auto;
}
.rly-stat { flex: 1; text-align: center; border-right: 1px solid rgba(255,255,255,0.15); padding: 0 1rem; }
.rly-stat:last-child { border-right: none; }
.rly-stat__val { display: block; font-family: var(--font-head); font-size: 1.5rem; font-weight: 700; color: var(--rly-gold); }
.rly-stat__lbl { display: block; font-size: 0.75rem; color: rgba(255,255,255,0.7); letter-spacing: 0.05em; text-transform: uppercase; margin-top: 0.25rem; }

/* ── TRUST ── */
.rly-trust { display: grid; grid-template-columns: 1fr 1fr; gap: 3rem; align-items: start; }
.rly-trust h2 { font-family: var(--font-head); font-size: 1.625rem; font-weight: 700; text-transform: uppercase; margin-bottom: 1.25rem; }
.rly-trust__attrs { display: flex; flex-direction: column; gap: 1rem; }
.rly-trust__attr { display: flex; align-items: center; gap: 0.875rem; padding: 1rem; background: var(--rly-gray); border-radius: 0.25rem; }
.rly-trust__attr img { flex-shrink: 0; }
.rly-trust__attr span { font-weight: 600; font-size: 0.9375rem; }

/* Reviews */
.reviews-summary { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1.25rem; }
.rating-score { font-family: var(--font-head); font-size: 2rem; font-weight: 700; color: var(--rly-blue); }
.rating-stars  { color: var(--rly-gold); font-size: 1.25rem; }
.rating-count  { color: #666; font-size: 0.875rem; }
.review-card   { background: var(--rly-gray); padding: 1rem; border-radius: 0.25rem; margin-bottom: 0.75rem; }
.review-card strong { display: block; font-size: 0.9375rem; margin-bottom: 0.25rem; }
.review-card span   { color: var(--rly-gold); font-size: 0.875rem; }
.review-card p      { font-size: 0.875rem; color: #444; margin-top: 0.5rem; }
.review-placeholder { padding: 1rem; background: var(--rly-gray); border-radius: 0.25rem; }

/* ── CTA BANNER ── */
.rly-cta-banner {
    background: var(--rly-black);
    color: var(--rly-white);
    text-align: center;
    padding: 3.5rem 2rem;
}
.rly-cta-banner__eyebrow {
    display: block;
    font-family: var(--font-head);
    font-size: 0.8125rem;
    font-weight: 600;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.55);
    margin-bottom: 1rem;
}
.rly-cta-banner__title {
    font-family: var(--font-head);
    font-size: 2rem;
    font-weight: 700;
    text-transform: uppercase;
    margin: 0 0 0.75rem;
}
.rly-cta-banner p { margin: 0 auto 1.75rem; font-weight: 400; font-size: 1.0625rem; color: rgba(255,255,255,0.8); max-width: 40rem; }
.rly-cta-banner__actions { justify-content: center; }

/* Trust section review widget */
.rly-trust__review { margin-top: 1.5rem; padding: 1.25rem; background: var(--rly-gray); border-left: 3px solid var(--rly-gold); border-radius: 0.25rem; font-size: 0.9375rem; color: #444; line-height: 1.6; }
.rly-trust__review :last-child { margin-bottom: 0; }

/* ── SERVICES ── */
.rly-services__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(13rem, 1fr));
    gap: 1rem;
    margin-bottom: 0.5rem;
}
.rly-service-card {
    background: var(--rly-white);
    border: 1px solid #e0e0e0;
    border-top: 3px solid var(--rly-blue);
    padding: 1.25rem;
    border-radius: 0.1875rem;
    display: flex;
    flex-direction: column;
    gap: 0.75rem;
}
.rly-service-card h3 { font-family: var(--font-head); font-size: 1rem; font-weight: 600; text-transform: uppercase; margin: 0; }
.rly-service-card__link { font-size: 0.8125rem; color: var(--rly-blue); font-weight: 600; text-decoration: none; margin-top: auto; }
.rly-service-card__link:hover { text-decoration: underline; }

/* ── SERVICE AREA ── */
.rly-area__inner { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; align-items: start; }
.rly-area__map iframe { width: 100%; height: 22.5rem; border: 0; border-radius: 0.25rem; }
.rly-area__lists { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 1.5rem; }
.rly-area__col h4 { font-family: var(--font-head); font-size: 0.8125rem; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; margin-bottom: 0.75rem; color: var(--rly-blue); }
.rly-area__col ul { list-style: none; padding: 0; margin: 0; }
.rly-area__col li { font-size: 0.875rem; padding: 0.25rem 0; border-bottom: 1px solid #e0e0e0; }
.rly-area__col p  { font-size: 0.875rem; color: #555; }

/* ── REVIEWS ── */
.rly-reviews { text-align: center; }  /* center the reviews widget/embed, not just the title */
.rly-reviews .rly-section__title { text-align: center; }
.rly-reviews__frame { width: 100%; max-width: 60rem; height: 18rem; border: 0; margin: 0 auto; display: block; }
.rly-trust__review .rly-reviews__frame { height: 17rem; }

/* ── CONDITIONS ── */
.rly-conditions__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem; margin-bottom: 1.5rem; }
.rly-conditions__traffic h3,
.rly-conditions__weather h3 { font-family: var(--font-head); font-size: 1rem; font-weight: 600; text-transform: uppercase; margin-bottom: 0.75rem; }
#traffic-map { width: 100%; height: 15rem; border-radius: 0.25rem; background: #e5e5e5; }
.weather-widget { background: var(--rly-white); border: 1px solid #e0e0e0; border-radius: 0.25rem; padding: 1.5rem; text-align: center; }
.weather-temp { font-family: var(--font-head); font-size: 3rem; font-weight: 700; color: var(--rly-blue); }
.weather-desc { font-size: 1rem; font-weight: 600; margin: 0.25rem 0; }
.weather-meta { font-size: 0.8125rem; color: #666; margin-top: 0.5rem; }
.rly-conditions__note { font-size: 0.9375rem; color: #555; }
.rly-conditions__note a { color: var(--rly-blue); }

/* ── FAQ ── */
.rly-faq .rly-section__title { text-align: center; }
.rly-faq__list { display: flex; flex-direction: column; gap: 1.25rem; max-width: 50rem; margin: 0 auto; }
.rly-faq__item { border: 1px solid #e0e0e0; border-radius: 0.25rem; padding: 1.25rem 1.5rem; }
.rly-faq__q { font-family: var(--font-head); font-size: 1.0625rem; font-weight: 600; text-transform: uppercase; margin: 0 0 0.625rem; color: var(--rly-black); }
.rly-faq__a { font-size: 0.9375rem; color: #444; line-height: 1.7; margin: 0; }

/* ── SAFETY TIPS ── */
.rly-wtd__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(14rem, 1fr)); gap: 1.5rem; }
.rly-wtd__item { display: flex; flex-direction: column; align-items: flex-start; gap: 0.625rem; background: var(--rly-white); border: 1px solid #e0e0e0; border-top: 3px solid var(--rly-blue); border-radius: 0.1875rem; padding: 1.5rem; }
.rly-wtd__num { font-family: var(--font-head); font-size: 2rem; font-weight: 700; color: var(--rly-blue); line-height: 1; }
.rly-wtd__item p { font-size: 0.9375rem; color: #444; line-height: 1.6; margin: 0; }

/* ── FINAL CTA ── */
.rly-final-cta {
    background: var(--rly-black);
    color: var(--rly-white);
    text-align: center;
    padding: 5rem 2rem;
}
.rly-final-cta h2 { font-family: var(--font-head); font-size: 2rem; font-weight: 700; text-transform: uppercase; margin-bottom: 1rem; }
.rly-final-cta p  { color: rgba(255,255,255,0.8); font-size: 1rem; margin-bottom: 2rem; max-width: 37.5rem; margin-left: auto; margin-right: auto; }

/* ── RESPONSIVE ── */
@media (max-width: 62rem) {
    .rly-trust { grid-template-columns: 1fr; }
    .rly-area__inner { grid-template-columns: 1fr; }
    .rly-area__lists { grid-template-columns: 1fr 1fr; }
    .rly-conditions__grid { grid-template-columns: 1fr; }
}
@media (max-width: 40rem) {
    .rly-hero__h1 { font-size: 1.75rem; }
    .rly-hero__stats { flex-wrap: wrap; }
    .rly-stat { flex: 0 0 50%; border-right: none; border-bottom: 1px solid rgba(255,255,255,0.15); }
    .rly-area__lists { grid-template-columns: 1fr; }
    .rly-cta-banner { flex-direction: column; gap: 1rem; }
}

/* ── GOOGLE REVIEWS BADGE (reviews-source switch) ── */
.rly-reviews #google-review-info { display: flex; flex-direction: column; align-items: center; gap: 0.25rem; max-width: 18.75rem; margin: 0 auto; background: #fff; padding: 1.25rem 1.875rem; border-radius: 0.5rem; }
.rly-reviews #google-review-info .greview-title { display: flex; align-items: center; gap: 0.625rem; font-size: 1.125rem; font-weight: 700; }
.rly-reviews #google-review-info .greview-title img { width: 1.875rem; height: 1.875rem; }
.rly-reviews #google-review-info .greview-rating { font-size: 2.5rem; font-weight: 600; line-height: 1; }
.rly-reviews #google-review-info #greview-stars { position: relative; display: inline-block; font-size: 1.875rem; line-height: 1; }
.rly-reviews #google-review-info #greview-stars::before { content: "\2605\2605\2605\2605\2605"; color: #ccc; }
.rly-reviews #google-review-info #greview-stars::after { content: "\2605\2605\2605\2605\2605"; color: gold; position: absolute; top: 0; left: 0; width: var(--percent); overflow: hidden; white-space: nowrap; }
.rly-reviews #google-review-info .greview-rating-total { font-size: 1rem; }
