/* Rethemed 2026-11-02 onto Brenda's navy and gold. Only colour VALUES changed;
   every token name, selector, component and layout rule is untouched, which is
   why all seven service pages follow at once without anything moving.
   The one rule change is .aalp__btn--solid taking navy text rather than white:
   white on the old blue was about 5.5:1, white on the gold is 3.3:1 and fails
   normal text. aal-brenda.css already solves it the same way.
   Previous values are in ~/backups/aal-preview.css.bak-20261102-retheme. */
/* ==========================================================================
   All American Limousine — home page, staging
   Accent is the client's own #075ba1, taken off their live site where it is
   used 31 times. Neutrals are a blue-biased ramp built around the #1c2430 and
   #5b6672 they already use, rather than a default grey. Contrast measured:
   see the note at the foot of this file.
   ========================================================================== */
.aalp {
  --ground:#fbfaf8; --panel:#f3efe8; --char:#001c38; --ink:#00122a;
  --slate:#26384c; --mid:#5d6b7a; --line:#e3ddd3; --line-ui:#98a1aa;
  --accent:#b87c3c; --accent-ink:#b87c3c; --accent-hover:#a06a30;
  --accent-wash:#f3efe8;

  /* 1.25 from 17px */
  --t0:17px; --t1:21px; --t2:27px; --t3:33px; --t4:42px; --t5:52px; --t6:65px;

  /* 4 8 12 16 24 32 48 64 96 128 */
  --s1:4px; --s2:8px; --s3:12px; --s4:16px; --s5:24px; --s6:32px;
  --s7:48px; --s8:64px; --s9:96px; --s10:128px;

  --display:"Instrument Serif",Georgia,"Times New Roman",serif;
  --body:"Geist",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,sans-serif;

  font-family:var(--body);
  font-size:var(--t0);
  line-height:1.6;
  color:var(--slate);
  background:var(--ground);
  -webkit-font-smoothing:antialiased;
}
.aalp *,.aalp *::before,.aalp *::after{box-sizing:border-box}
.aalp img{max-width:100%;height:auto;display:block}

.aalp h1,.aalp h2,.aalp h3{
  font-family:var(--display);
  font-weight:400;
  color:var(--char);
  line-height:1.12;
  letter-spacing:-0.01em;
  text-wrap:balance;
  margin:0;
}
.aalp h1{font-size:clamp(var(--t4),7vw,var(--t6))}
.aalp h2{font-size:clamp(var(--t3),5vw,var(--t5))}
.aalp h3{font-size:var(--t1);font-family:var(--body);font-weight:600;letter-spacing:0}
.aalp p{margin:0}

.aalp__wrap{max-width:1180px;margin:0 auto;padding:0 var(--s4)}
@media(min-width:768px){.aalp__wrap{padding:0 var(--s6)}}

.aalp__sec{padding:var(--s7) 0}
@media(min-width:768px){.aalp__sec{padding:var(--s9) 0}}
.aalp__sec--panel{background:var(--panel)}
.aalp__sec--dark{background:var(--char);color:#fff}
.aalp__sec--dark h2,.aalp__sec--dark h3{color:#fff}

.aalp__eyebrow{
  font-size:13px;font-weight:600;letter-spacing:0.08em;text-transform:uppercase;
  color:var(--accent-ink);margin:0 0 var(--s4)
}
.aalp__sec--dark .aalp__eyebrow{color:#d9a862}
.aalp__lede{font-size:var(--t1);line-height:1.5;color:var(--mid);max-width:60ch}
.aalp__sec--dark .aalp__lede{color:#c9d4e0}

/* Buttons ---------------------------------------------------------------- */
.aalp__btns{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s6)}
.aalp__btn{
  display:inline-block;padding:var(--s4) var(--s6);border-radius:3px;
  font-family:var(--body);font-size:var(--t0);font-weight:600;
  text-decoration:none;border:1px solid transparent;transition:background .15s,border-color .15s
}
.aalp__btn--solid{background:var(--accent);color:var(--char)}
.aalp__btn--solid:hover,.aalp__btn--solid:focus-visible{background:var(--accent-hover);color:#fff}
.aalp__btn--line{background:transparent;color:var(--accent-ink);border-color:var(--line-ui)}
.aalp__btn--line:hover,.aalp__btn--line:focus-visible{border-color:var(--accent);background:var(--accent-wash)}
.aalp__sec--dark .aalp__btn--line{color:#fff;border-color:rgba(255,255,255,.45)}
.aalp__sec--dark .aalp__btn--line:hover{background:rgba(255,255,255,.1);border-color:#fff}
.aalp a:focus-visible,.aalp button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}

/* Header ----------------------------------------------------------------- */
.aalp__bar{border-bottom:1px solid var(--line);background:var(--ground)}
.aalp__bar-in{display:flex;align-items:center;gap:var(--s5);flex-wrap:wrap;padding-top:var(--s4);padding-bottom:var(--s4)}  /* block only: the side gutter belongs to .aalp__wrap */
.aalp__logo{display:block;flex:0 0 auto}
.aalp__logo img{height:42px;width:auto}
@media(max-width:767px){.aalp__logo img{height:34px}}
.aalp__nav{display:flex;gap:var(--s5);margin-left:auto;flex-wrap:wrap}
.aalp__nav a{color:var(--slate);text-decoration:none;font-size:15px;font-weight:500}
.aalp__nav a:hover{color:var(--accent-ink)}
.aalp__tel{color:var(--char);text-decoration:none;font-weight:600;font-size:15px;white-space:nowrap}
.aalp__tel:hover{color:var(--accent-ink)}
@media(max-width:767px){
  .aalp__bar-in{gap:var(--s3)}
  /* Logo and Book Now hold the top row; the number drops down beside the nav,
     otherwise three items fight for 390px and the button ends up alone. */
  .aalp__logo{order:1}
  .aalp__tel{order:2}
  .aalp__nav{order:3;width:100%;margin-left:0;gap:var(--s4);padding-top:var(--s3);border-top:1px solid var(--line)}
}

/* Hero ------------------------------------------------------------------- */
.aalp__hero{display:grid;gap:var(--s7);align-items:center}
@media(min-width:900px){.aalp__hero{grid-template-columns:1.05fr .95fr;gap:var(--s8)}}

/* Trust row -------------------------------------------------------------- */
.aalp__trust{display:grid;gap:var(--s5);grid-template-columns:1fr}
@media(min-width:560px){.aalp__trust{grid-template-columns:1fr 1fr}}
@media(min-width:960px){.aalp__trust{grid-template-columns:repeat(4,1fr);gap:var(--s6)}}
.aalp__trust-i{padding-top:var(--s4);border-top:2px solid var(--accent)}
.aalp__trust-i strong{display:block;font-size:var(--t0);color:var(--char);font-weight:600;margin-bottom:var(--s1)}
.aalp__trust-i span{font-size:15px;color:var(--mid);line-height:1.45;display:block}
.aalp__trust-foot{
  margin-top:var(--s7);padding-top:var(--s5);border-top:1px solid var(--line);
  font-size:16px;color:var(--mid)
}

/* Cards ------------------------------------------------------------------ */
.aalp__grid{display:grid;gap:var(--s5);grid-template-columns:1fr;margin-top:var(--s7)}
@media(min-width:640px){.aalp__grid{grid-template-columns:1fr 1fr}}
@media(min-width:1000px){.aalp__grid--3{grid-template-columns:repeat(3,1fr)}}
.aalp__card{
  background:var(--ground);border:1px solid var(--line);border-radius:3px;padding:var(--s6);
  display:block;text-decoration:none;transition:border-color .15s,box-shadow .15s
}
a.aalp__card:hover,a.aalp__card:focus-visible{border-color:var(--accent);box-shadow:0 2px 14px rgba(16,24,32,.07)}
a.aalp__card:hover h3{color:var(--accent-ink)}
.aalp__card h3{margin-bottom:var(--s3)}
.aalp__card p{font-size:16px;color:var(--mid);line-height:1.55}

/* Steps ------------------------------------------------------------------ */
.aalp__steps{display:grid;gap:var(--s6);grid-template-columns:1fr;margin-top:var(--s7);counter-reset:aalp}
@media(min-width:640px){.aalp__steps{grid-template-columns:1fr 1fr}}
@media(min-width:1000px){.aalp__steps{grid-template-columns:repeat(3,1fr)}}
.aalp__step{counter-increment:aalp;padding-left:var(--s8);position:relative}
.aalp__step::before{
  content:counter(aalp);position:absolute;left:0;top:-2px;
  font-family:var(--display);font-size:var(--t3);color:var(--accent);line-height:1
}
.aalp__step strong{display:block;color:var(--char);font-size:var(--t0);font-weight:600;margin-bottom:var(--s2)}
.aalp__step span{color:var(--mid);font-size:16px;line-height:1.55}

/* Fleet table ------------------------------------------------------------ */
.aalp__tablewrap{margin-top:var(--s7);overflow-x:auto;-webkit-overflow-scrolling:touch}
.aalp__table{width:100%;border-collapse:collapse;min-width:30rem;font-size:16px}
.aalp__table caption{text-align:left;color:var(--mid);font-size:15px;padding-bottom:var(--s4)}
.aalp__table th,.aalp__table td{text-align:left;padding:var(--s4) var(--s5);border-bottom:1px solid var(--line)}
.aalp__table th{
  font-size:13px;font-weight:600;letter-spacing:0.06em;text-transform:uppercase;
  color:var(--slate);border-bottom:1px solid var(--line-ui)
}
.aalp__table td:first-child{color:var(--char);font-weight:500}
.aalp__table tr:last-child td{border-bottom:0}
.aalp__note{margin-top:var(--s5);font-size:16px;color:var(--mid)}
.aalp__note a{color:var(--accent-ink);font-weight:600}
/* Below 640 the table stops being a table. A side-scrolling fleet list is the
   one thing on this page a customer would actually miss content in. */
@media(max-width:639px){
  .aalp__tablewrap{overflow-x:visible}
  .aalp__table{min-width:0}
  .aalp__table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .aalp__table tr{display:block;border:1px solid var(--line);border-radius:3px;padding:var(--s5);margin-bottom:var(--s3)}
  .aalp__table td{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s4);border:0;padding:var(--s2) 0}
  .aalp__table td::before{content:attr(data-l);color:var(--mid);font-size:14px}
  .aalp__table td:first-child{
    display:block;font-size:var(--t1);font-family:var(--display);color:var(--char);font-weight:400;
    padding:0 0 var(--s3);margin-bottom:var(--s2);border-bottom:1px solid var(--line)
  }
  .aalp__table td:first-child::before{content:none}
  .aalp__table tr:last-child td{border-bottom:0}
  .aalp__table tr:last-child td:first-child{border-bottom:1px solid var(--line)}
}

/* Pull panel ------------------------------------------------------------- */
.aalp__legacy{display:grid;gap:var(--s7);align-items:center}
@media(min-width:900px){.aalp__legacy{grid-template-columns:1fr 1fr;gap:var(--s8)}}
.aalp__pull{background:var(--char);color:#fff;padding:var(--s8) var(--s7);border-radius:3px}
.aalp__pull b{
  display:block;font-size:13px;letter-spacing:0.08em;text-transform:uppercase;
  color:#d9a862;font-weight:600;margin-bottom:var(--s5)
}
.aalp__pull p{font-family:var(--display);font-size:var(--t2);line-height:1.25;color:#fff}

/* Image placeholders ----------------------------------------------------- */
.aalp__ph{
  background:var(--accent-wash);border:1px dashed var(--line-ui);border-radius:3px;
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  text-align:center;padding:var(--s6);min-height:17rem;gap:var(--s2)
}
.aalp__ph b{font-size:15px;color:var(--accent-ink);font-weight:600}
.aalp__ph span{font-size:14px;color:var(--mid);max-width:34ch;line-height:1.45}
.aalp__ph--tall{min-height:25rem}
/* 2026-11-02: the placeholders those boxes described were replaced with
   photographs we already hold. Same slot, same minimum height, so nothing
   around them moves. object-fit:cover rather than a fixed aspect, because the
   library is a mix of landscape and portrait and a fixed ratio would letterbox
   half of it. */
.aalp__heroimg{display:block;width:100%;min-height:25rem;max-height:34rem;
  object-fit:cover;border-radius:6px;background:var(--panel)}

/* Staging bar — delete this block and the markup when promoting ---------- */
.aalp__staging{background:#8a6d1f;color:#fff;font-size:14px;padding:var(--s3) var(--s4);text-align:center}

/* Sticky Book Now. Phone only: it takes the top strip and stays there, so the
   booking action is never more than a thumb away however far down you are.
   On desktop the one in the header does the job and this is hidden. */
.aalp__cta-sticky{display:none}
@media(max-width:767px){
  .aalp__cta-sticky{
    display:block;position:sticky;top:0;z-index:60;
    background:var(--accent);color:#fff;text-align:center;text-decoration:none;
    font-family:var(--body);font-size:var(--t0);font-weight:600;
    padding:var(--s4);width:100%;box-shadow:0 2px 10px rgba(16,24,32,.18)
  }
  .aalp__cta-sticky:hover,.aalp__cta-sticky:focus-visible{background:var(--accent-hover);color:#fff}
  /* the header copy would be a duplicate */
  .aalp__bar-in > .aalp__btn--solid{display:none}
}
.aalp__staging b{font-weight:600}

/* Footer ----------------------------------------------------------------- */
.aalp__foot{border-top:1px solid var(--line);padding:var(--s7) 0;font-size:15px;color:var(--mid)}
.aalp__foot a{color:var(--accent-ink);text-decoration:none;font-weight:500}

/* ==========================================================================
   Service pages
   ========================================================================== */
.aalp__crumb{font-size:14px;color:var(--mid);padding:var(--s5) 0 0}
.aalp__crumb a{color:var(--accent-ink);text-decoration:none}
.aalp__crumb a:hover{text-decoration:underline}

.aalp__shero{display:grid;gap:var(--s6);align-items:center}
@media(min-width:900px){.aalp__shero{grid-template-columns:1.1fr .9fr;gap:var(--s8)}}

.aalp__points{display:grid;gap:var(--s5);grid-template-columns:1fr;margin-top:var(--s7)}
@media(min-width:700px){.aalp__points{grid-template-columns:1fr 1fr;gap:var(--s6)}}
.aalp__point{padding-top:var(--s4);border-top:2px solid var(--accent)}
.aalp__point strong{display:block;color:var(--char);font-size:var(--t0);font-weight:600;margin-bottom:var(--s2)}
.aalp__point span{display:block;color:var(--mid);font-size:16px;line-height:1.55}

.aalp__faq{margin-top:var(--s7);border-top:1px solid var(--line)}
.aalp__faq details{border-bottom:1px solid var(--line)}
.aalp__faq summary{
  cursor:pointer;list-style:none;padding:var(--s5) var(--s6) var(--s5) 0;position:relative;
  font-size:var(--t0);font-weight:600;color:var(--char)
}
.aalp__faq summary::-webkit-details-marker{display:none}
.aalp__faq summary::after{
  content:"";position:absolute;right:var(--s2);top:50%;width:9px;height:9px;
  border-right:2px solid var(--accent);border-bottom:2px solid var(--accent);
  transform:translateY(-70%) rotate(45deg);transition:transform .15s
}
.aalp__faq details[open] summary::after{transform:translateY(-30%) rotate(225deg)}
.aalp__faq p{padding:0 0 var(--s5);color:var(--mid);font-size:16px;line-height:1.6;max-width:68ch}

.aalp__vehicles{display:flex;flex-wrap:wrap;gap:var(--s3);margin-top:var(--s6)}
.aalp__chip{
  border:1px solid var(--line-ui);border-radius:999px;padding:var(--s2) var(--s5);
  font-size:15px;color:var(--slate);background:var(--ground)
}
.aalp__sec--panel .aalp__chip{background:var(--ground)}

.aalp__sibs{display:grid;gap:var(--s4);grid-template-columns:1fr;margin-top:var(--s6)}
@media(min-width:640px){.aalp__sibs{grid-template-columns:1fr 1fr}}
@media(min-width:1000px){.aalp__sibs{grid-template-columns:repeat(3,1fr)}}
.aalp__sib{
  display:block;text-decoration:none;padding:var(--s5);border:1px solid var(--line);
  border-radius:3px;background:var(--ground);color:var(--char);font-weight:600;font-size:16px
}
.aalp__sib:hover{border-color:var(--accent);color:var(--accent-ink)}


/* ==========================================================================
   Photographic hero
   Scrim is a FLAT layer, not a left-to-right gradient. Measured against the
   real image: a gradient fading to .35 drops white text to 3.04:1 over the
   bright sunset sky, which fails. A flat .70 floor holds 7.29:1 everywhere
   the text runs. The gradient on top is for depth only and nothing relies
   on it for legibility.
   ========================================================================== */
.aalp__hero-photo{
  position:relative;background:#001c38;
  background-image:url("https://carservice-atlanta.com/wp-content/uploads/2026/10/hero-c-bluehour.jpg");
  background-size:cover;background-position:center 62%;
}
.aalp__hero-photo::before{
  content:"";position:absolute;inset:0;
  background:
    linear-gradient(100deg, rgba(10,16,22,.38) 0%, rgba(10,16,22,0) 62%),
    linear-gradient(to top, rgba(10,16,22,.45) 0%, rgba(10,16,22,0) 42%),
    rgba(10,16,22,.70);
}
.aalp__hero-photo > *{position:relative;z-index:1}
.aalp__hero-photo h1{color:#fff}
.aalp__hero-photo .aalp__eyebrow{color:#d9a862}
.aalp__hero-photo .aalp__lede{color:#c9d4e0}
.aalp__hero-photo .aalp__btn--line{color:#fff;border-color:rgba(255,255,255,.55)}
.aalp__hero-photo .aalp__btn--line:hover{background:rgba(255,255,255,.12);border-color:#fff}

/* the fleet cutouts that sit over the city */
.aalp__fleetcut{align-self:end}
.aalp__ph--cut{
  background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.45);
  min-height:14rem
}
.aalp__ph--cut b{color:#fff}
.aalp__ph--cut span{color:#c9d4e0}
@media(min-width:900px){
  .aalp__hero-photo .aalp__hero{min-height:34rem;align-items:center}
}