/* Prestige Lawn & Landscaping skin for the customer pages (book, login, account, approve, pay, autopay, my project, crew setup, SMS terms).
   Loaded after base.css and site.css. Dark Prestige frame, light cards for forms and money so everything stays easy to read. */
@font-face { font-family: "Archivo"; src: url("/fonts/archivo.woff2") format("woff2"); font-weight: 100 900; font-stretch: 62% 125%; font-display: swap; }
@font-face { font-family: "Inter"; src: url("/fonts/inter.woff2") format("woff2"); font-weight: 100 900; font-display: swap; }
:root {
  --serif: "Archivo", "Arial Narrow", system-ui, sans-serif;
  --sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --ink: #0f1711; --ink-2: #26332a; --paper: #eef2ea; --stone: #e6ece1; --sand: #dfe6d8;
  --accent: #3d7612; --accent-ink: #ffffff; --accent-soft: #e5f2d4;
  --lime: #8dc63f; --sun: #8dc63f; --bloom: #56b8ec;
}
body.site { background: linear-gradient(180deg, #090e0a 0, #090e0a 420px, var(--paper) 420px); }
h1, h2, h3, .form h1, .inq-hero h1, .inq-side h2, .success h2 { font-family: var(--serif); font-stretch: 108%; font-weight: 800; letter-spacing: -.01em; }
.inq-hero h1 em, .form h1 em { font-style: normal; }

/* Header */
.nav { background: rgba(9,14,10,.92); border-bottom: 1px solid rgba(237,242,234,.12); }
.nav-in { height: 78px; }
.logo { gap: 12px; color: #fff; }
.logo img { height: 58px; width: auto; }
.logo b { font: 800 19px/1 var(--serif); font-stretch: 118%; letter-spacing: .08em; display: block; }
.logo small { font: 600 10.5px/1.3 var(--serif); font-stretch: 115%; letter-spacing: .18em; text-transform: uppercase; color: var(--lime); }
.nav-links a { color: #dfe8dc; }
.nav-links a:hover, .nav-links a[aria-current="page"] { color: var(--lime); border-color: var(--lime); }
.nav .btn.primary { background: var(--lime); color: #0b1408; border-radius: 999px; font-family: var(--serif); font-stretch: 110%; font-weight: 700; }
.burger { background: transparent; border-color: rgba(255,255,255,.25); }
.burger span { background: #fff; }
@media (max-width: 900px) {
  .nav.is-open .nav-links { background: #0b110c; border-color: rgba(237,242,234,.12); }
  .nav.is-open .nav-links a { color: #e8efe5; border-color: rgba(237,242,234,.1); }
  .logo img { height: 48px; }
}
@media (max-width: 560px) { .logo span { display: none; } }

/* Page hero: their lawn, darkened */
.inq-hero { background: linear-gradient(90deg, rgba(6,10,7,.94) 0%, rgba(6,10,7,.78) 50%, rgba(6,10,7,.55) 100%), url("/img/lawn-stripes.webp") center 40% / cover no-repeat; padding: 56px 0 120px; }
.inq-hero h1 { font-size: clamp(32px, 4.6vw, 56px); line-height: 1.04; }
.inq-hero h1 em { color: var(--lime); }
.inq-hero p { color: #d5dfd2; }
.inq-hero .perks span { border-color: rgba(255,255,255,.22); }
.inq-hero .perks span:first-child { background: var(--lime); color: #0b1408; }
.inq { padding-top: 0; margin-top: -76px; position: relative; z-index: 3; }
.form, .inq > div > .card, #ac > * { border-radius: 20px; }
.form { box-shadow: 0 30px 70px -40px rgba(0,0,0,.6), 0 0 0 1px rgba(15,23,17,.06); }

/* Buttons */
.btn.primary { background: var(--accent); border-color: var(--accent); border-radius: 999px; }
.btn.primary:hover { background: #2f5e0c; }
.bk-types button[aria-pressed="true"] { background: var(--ink); color: #fff; }

/* Footer */
.foot { background: #060a07; border-top: 0; color: #9fb09e; position: relative; }
.foot::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 2px; background: linear-gradient(90deg, transparent, #56b8ec, #8dc63f, transparent); }
.foot a { color: #c7d3c4; }
.foot-bottom { color: #8a9a89; }
.scrollbar { background: linear-gradient(90deg, #56b8ec, #8dc63f); }

/* No falling leaves; side panels read as cards */
.leaf { display: none !important; }
.inq > aside, .inq .side { background: #fff; border-radius: 20px; padding: 24px; box-shadow: 0 30px 70px -40px rgba(0,0,0,.5), 0 0 0 1px rgba(15,23,17,.06); color: var(--ink); }
.inq > aside h3 { font-family: var(--serif); font-weight: 800; font-size: 20px; margin: 0 0 8px; }
.inq > aside a { color: var(--accent); font-weight: 600; }
