/* =========================================================
   Lanky Services — Rubbish Removal & Local Services
   Dark theme matched to the logo: black + lime-green + cyan
   ========================================================= */

:root {
  --bg: #0a0c0a;
  --bg-2: #0f120e;
  --surface: rgba(255,255,255,.045);
  --surface-2: rgba(255,255,255,.07);
  --panel: #12150f;
  --line: rgba(255,255,255,.10);
  --line-strong: rgba(255,255,255,.18);

  --ink: #eef3ea;
  --ink-soft: #c4ccbf;
  --stone: #8b968a;

  --green: #8ed029;
  --green-2: #a6e63a;
  --green-dk: #7cc422;
  --cyan: #24b5d6;
  --cyan-2: #4fd0ec;

  --accent: #8ed029;
  --accent-dark: #7cc422;
  --sand: #8ed029;
  --tan: #24b5d6;

  --radius-lg: 28px;
  --radius: 18px;
  --radius-sm: 12px;
  --radius-pill: 999px;

  --shadow-sm: 0 2px 10px rgba(0,0,0,.4);
  --shadow: 0 16px 40px rgba(0,0,0,.5);
  --shadow-lg: 0 36px 80px rgba(0,0,0,.6);
  --glow: 0 8px 30px rgba(142,208,41,.30);

  --maxw: 1200px;
  --gap: clamp(14px, 2.4vw, 24px);

  --font-display: "Space Grotesk", system-ui, sans-serif;
  --font-body: "Manrope", system-ui, -apple-system, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin:0; font-family: var(--font-body); color: var(--ink-soft); background: var(--bg); line-height:1.65; -webkit-font-smoothing: antialiased; overflow-x:hidden; }
img { max-width:100%; display:block; }
a { color: inherit; text-decoration: none; }
::selection { background: rgba(142,208,41,.35); color:#0a0c0a; }

h1,h2,h3,h4 { font-family: var(--font-display); line-height:1.05; letter-spacing:-.025em; margin:0 0 .5em; font-weight:700; color: var(--ink); }
h1 { font-size: clamp(2.6rem,6vw,4.6rem); }
h2 { font-size: clamp(1.9rem,4vw,3rem); }
h3 { font-size: clamp(1.15rem,2vw,1.45rem); }
p { margin:0 0 1rem; color: var(--ink-soft); }

.container { width:100%; max-width: var(--maxw); margin-inline:auto; padding-inline: clamp(18px,4vw,40px); }
section { padding: clamp(40px,5.5vw,78px) 0; }

.eyebrow { display:inline-flex; align-items:center; gap:8px; font-family: var(--font-display); font-size:.78rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color: var(--cyan); margin-bottom:18px; }
.eyebrow::before { content:""; width:22px; height:2px; background: linear-gradient(90deg,var(--green),var(--cyan)); display:inline-block; border-radius:2px; }
.section-head { max-width:680px; margin-bottom: clamp(22px,3.5vw,40px); }
.section-head.center { margin-inline:auto; text-align:center; }
.section-head.center .eyebrow::before { display:none; }
.lead { font-size: clamp(1.05rem,1.5vw,1.2rem); color: var(--stone); }

/* Buttons */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:10px; padding:15px 28px; border-radius: var(--radius-pill); font-family: var(--font-display); font-weight:700; font-size:.98rem; border:1px solid transparent; cursor:pointer; transition: transform .25s ease, box-shadow .25s, background .25s, color .25s, border-color .25s; white-space:nowrap; }
.btn svg { width:18px; height:18px; }
.btn-primary, .btn-accent { background: linear-gradient(135deg,var(--green),var(--green-dk)); color:#0a1a06; box-shadow: var(--glow); }
.btn-primary:hover, .btn-accent:hover { background: linear-gradient(135deg,var(--green-2),var(--green)); transform: translateY(-2px); box-shadow: 0 14px 36px rgba(142,208,41,.5); }
.btn-outline { background: transparent; color: var(--ink); border-color: var(--line-strong); }
.btn-outline:hover { border-color: var(--green); color: var(--green); transform: translateY(-2px); }
.btn-ghost-light { background: rgba(255,255,255,.06); color:#fff; border-color: rgba(255,255,255,.2); }
.btn-ghost-light:hover { background: rgba(255,255,255,.12); border-color: var(--green); }
.btn-lg { padding:18px 34px; font-size:1.05rem; }

/* Header */
.site-header { position:sticky; top:0; z-index:50; background: rgba(10,12,10,.82); backdrop-filter: saturate(150%) blur(16px); border-bottom:1px solid var(--line); }
.nav { display:flex; align-items:center; justify-content:space-between; height:80px; gap:20px; }
.brand { display:flex; align-items:center; gap:12px; }
.brand .brand-logo { height:52px; width:auto; display:block; }
.brand .brand-mark { width:44px; height:44px; flex:0 0 auto; }
.brand span { font-family: var(--font-display); font-weight:700; color: var(--ink); }
.brand small { display:block; font-size:.6rem; letter-spacing:.16em; text-transform:uppercase; color: var(--green); margin-top:2px; }
.nav-links { display:flex; align-items:center; gap:2px; }
.nav-links a { position:relative; font-family: var(--font-display); font-weight:500; font-size:.95rem; padding:10px 15px; border-radius: var(--radius-pill); color: rgba(238,243,234,.82); transition: color .25s; }
.nav-links a::after { content:""; position:absolute; left:15px; right:15px; bottom:5px; height:2px; background: linear-gradient(90deg,var(--green),var(--cyan)); border-radius:2px; transform: scaleX(0); transform-origin:left; transition: transform .3s ease; }
.nav-links a:hover { color:#fff; }
.nav-links a:hover::after, .nav-links a.active::after { transform: scaleX(1); }
.nav-links a.active { color:#fff; }
.nav-cta { display:flex; align-items:center; gap:12px; }
.nav-phone { display:inline-flex; align-items:center; gap:8px; font-family: var(--font-display); font-weight:700; color:#fff; }
.nav-phone svg { width:18px; height:18px; color: var(--green); }
.nav-social { display:inline-flex; width:42px; height:42px; align-items:center; justify-content:center; border-radius:50%; border:1px solid var(--line-strong); color:#fff; transition:.25s; }
.nav-social:hover { border-color: var(--cyan); color: var(--cyan); }
.nav-social svg { width:18px; height:18px; }
.nav-toggle { display:none; width:46px; height:46px; border-radius:12px; border:1px solid var(--line-strong); background:transparent; cursor:pointer; align-items:center; justify-content:center; }
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after { content:""; display:block; width:20px; height:2px; background:#fff; position:relative; transition:.25s; }
.nav-toggle span::before { position:absolute; top:-6px; } .nav-toggle span::after { position:absolute; top:6px; }
body.nav-open .nav-toggle span { background:transparent; }
body.nav-open .nav-toggle span::before { top:0; transform: rotate(45deg); }
body.nav-open .nav-toggle span::after { top:0; transform: rotate(-45deg); }

/* Hero */
.hero { position:relative; padding: clamp(40px,6vw,80px) 0 clamp(30px,5vw,60px); overflow:hidden; }
.hero::before { content:""; position:absolute; width:520px; height:520px; top:-180px; right:-120px; border-radius:50%; background: radial-gradient(circle, rgba(142,208,41,.28), transparent 62%); filter: blur(40px); pointer-events:none; }
.hero::after { content:""; position:absolute; width:420px; height:420px; bottom:-200px; left:-140px; border-radius:50%; background: radial-gradient(circle, rgba(36,181,214,.22), transparent 62%); filter: blur(40px); pointer-events:none; }
.hero .container { position:relative; z-index:1; }
.hero-grid { display:grid; grid-template-columns: 1.02fr .98fr; gap: clamp(28px,5vw,60px); align-items:center; }
.hero-badge { display:inline-flex; align-items:center; gap:10px; background: var(--surface); border:1px solid var(--line); padding:8px 16px; border-radius: var(--radius-pill); box-shadow: var(--shadow-sm); font-size:.85rem; font-weight:600; color: var(--ink-soft); margin-bottom:24px; backdrop-filter: blur(6px); }
.hero-badge .stars { color: var(--green); letter-spacing:2px; }
.hero-badge .pill { background: var(--cyan); color:#04222a; border-radius: var(--radius-pill); padding:4px 12px; font-size:.75rem; font-weight:700; }
.hero h1 span { background: linear-gradient(100deg,var(--cyan),var(--green)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.hero p.lead { max-width:520px; color: var(--ink-soft); }
.hero .slogan { font-family: var(--font-display); font-weight:600; color: var(--cyan); font-style:italic; margin:2px 0 14px; font-size:1.05rem; }
.hero-actions { display:flex; flex-wrap:wrap; gap:14px; margin-top:30px; }
.hero-trust { display:flex; flex-wrap:wrap; gap:30px; margin-top:38px; }
.hero-trust strong { font-family: var(--font-display); font-size:1.6rem; display:block; color: var(--ink); }
.hero-trust span { font-size:.85rem; color: var(--stone); }
.hero-visual { position:relative; border-radius: var(--radius-lg); overflow:hidden; aspect-ratio:4/4.2; background: linear-gradient(160deg,#16351b,#0c1f10 60%,#080d08); box-shadow: var(--shadow-lg); border:1px solid var(--line); }
.hero-visual > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero-visual .float-tag { position:absolute; z-index:3; top:20px; right:20px; background: var(--green); color:#0a1a06; padding:10px 16px; border-radius: var(--radius-pill); font-family: var(--font-display); font-weight:700; font-size:.85rem; box-shadow: var(--glow); display:flex; align-items:center; gap:8px; }
.float-tag .dot { width:8px; height:8px; border-radius:50%; background:#0a1a06; }
.hero-visual .glass-card { position:absolute; z-index:2; left:20px; right:20px; bottom:20px; background: rgba(8,12,9,.6); border:1px solid rgba(142,208,41,.35); backdrop-filter: blur(10px); border-radius: var(--radius); padding:18px 20px; box-shadow: var(--shadow); }
.hero-visual .glass-card .glass-title, .hero-visual .glass-card h3 { color:#fff; margin-bottom:2px; font-size:1.05rem; font-weight:700; }
.hero-visual .glass-card p { color: rgba(255,255,255,.82); margin:0; font-size:.9rem; }

/* Quote form card */
.quote-hero { position:relative; z-index:5; margin-top: clamp(-40px,-4vw,-28px); }
.quote-hero .qcard { background: var(--panel); border:1px solid var(--line); border-radius: var(--radius); box-shadow: var(--shadow); padding: clamp(20px,3vw,30px); }
.quote-hero .qhead { display:flex; align-items:center; gap:10px; font-family: var(--font-display); font-weight:700; color: var(--ink); margin-bottom:16px; }
.quote-hero .qhead .badge { width:34px; height:34px; border-radius:10px; background: linear-gradient(135deg,var(--green),var(--green-dk)); display:flex; align-items:center; justify-content:center; color:#0a1a06; }
.quote-hero .qhead svg { width:18px; height:18px; }
.qgrid { display:grid; grid-template-columns: repeat(4,1fr); gap:12px; }
.qgrid input, .qgrid select { width:100%; padding:14px 16px; border-radius: var(--radius-sm); border:1px solid var(--line-strong); background: rgba(255,255,255,.03); font-family: var(--font-body); font-size:.95rem; color: var(--ink); }
.qgrid input::placeholder { color:#7c857a; }
.qgrid input:focus, .qgrid select:focus { outline:none; border-color: var(--green); box-shadow:0 0 0 3px rgba(142,208,41,.2); }
.qgrid .full { grid-column:1 / -1; }
.qgrid button { grid-column:1 / -1; padding:16px; border:0; border-radius: var(--radius-pill); background: linear-gradient(135deg,var(--green),var(--green-dk)); color:#0a1a06; font-family: var(--font-display); font-weight:700; font-size:1rem; cursor:pointer; transition:.25s; }
.qgrid button:hover { background: linear-gradient(135deg,var(--green-2),var(--green)); }

/* Trust bar */
.trustbar { padding:26px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background: var(--bg-2); }
.trustbar .container { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:20px; }
.trustbar p { margin:0; font-size:.78rem; letter-spacing:.14em; text-transform:uppercase; color: var(--stone); font-weight:700; }
.trustbar ul { list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap: clamp(18px,4vw,44px); }
.trustbar li { font-family: var(--font-display); font-weight:600; color: var(--ink-soft); display:flex; align-items:center; gap:8px; }
.trustbar li svg { width:20px; height:20px; color: var(--green); }

/* Grid + cards */
.grid { display:grid; gap: var(--gap); }
.grid-3 { grid-template-columns: repeat(3,1fr); }
.grid-2 { grid-template-columns: repeat(2,1fr); }
.grid-4 { grid-template-columns: repeat(4,1fr); }
.card { background: var(--surface); border:1px solid var(--line); border-radius: var(--radius); padding:30px; transition: transform .25s ease, box-shadow .25s, border-color .25s, background .25s; height:100%; backdrop-filter: blur(4px); }
.card:hover { transform: translateY(-5px); box-shadow: var(--shadow); border-color: rgba(142,208,41,.5); background: rgba(142,208,41,.05); }
.card .icon { width:56px; height:56px; border-radius:16px; display:flex; align-items:center; justify-content:center; background: linear-gradient(135deg, rgba(142,208,41,.2), rgba(36,181,214,.16)); color: var(--green); margin-bottom:20px; border:1px solid rgba(142,208,41,.3); transition: transform .25s; }
.card:hover .icon { transform: scale(1.06) rotate(-3deg); }
.card .icon svg { width:28px; height:28px; }
.card h3 { margin-bottom:8px; }
.card p { margin:0; font-size:.96rem; color: var(--stone); }
.card .card-link { display:inline-flex; align-items:center; gap:6px; margin-top:16px; font-family: var(--font-display); font-weight:700; font-size:.9rem; color: var(--cyan); }
.card .card-link svg { width:16px; height:16px; transition: transform .25s; }
.card:hover .card-link svg { transform: translateX(4px); }
.card.feature { background: linear-gradient(135deg, rgba(142,208,41,.14), rgba(36,181,214,.08)); border-color: rgba(142,208,41,.4); }

/* Alt sections */
.dark { background: var(--bg-2); position:relative; }
.dark::before { content:""; position:absolute; inset:0; background: radial-gradient(600px 260px at 12% 0%, rgba(142,208,41,.08), transparent 60%), radial-gradient(600px 260px at 100% 100%, rgba(36,181,214,.08), transparent 60%); pointer-events:none; }
.dark > .container { position:relative; z-index:1; }
.dark h1,.dark h2,.dark h3 { color:#fff; }
.dark p { color: rgba(255,255,255,.72); }
.dark .eyebrow { color: var(--cyan); }

.stats { display:grid; grid-template-columns: repeat(4,1fr); gap: var(--gap); }
.stat { text-align:center; padding:22px; border-radius: var(--radius); background: var(--surface); border:1px solid var(--line); }
.stat strong { font-family: var(--font-display); font-size: clamp(2rem,4vw,3rem); display:block; letter-spacing:-.03em; background: linear-gradient(120deg,var(--green),var(--cyan)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.stat span { color: var(--stone); font-size:.95rem; }

/* Process */
.steps { display:grid; grid-template-columns: repeat(4,1fr); gap: var(--gap); }
.step { position:relative; padding:26px; border-radius: var(--radius); background: var(--surface); border:1px solid var(--line); transition: transform .25s, border-color .25s; }
.step:hover { transform: translateY(-4px); border-color: rgba(142,208,41,.4); }
.step .num { font-family: var(--font-display); font-weight:700; font-size:1rem; width:44px; height:44px; border-radius:50%; background: linear-gradient(135deg,var(--green),var(--green-dk)); color:#0a1a06; display:flex; align-items:center; justify-content:center; margin-bottom:18px; }
.step h3 { font-size:1.12rem; }
.step p { font-size:.94rem; margin:0; color: var(--stone); }

/* Split feature */
.split { display:grid; grid-template-columns:1fr 1fr; gap: clamp(28px,5vw,64px); align-items:center; }
.feature-img { border-radius: var(--radius-lg); overflow:hidden; aspect-ratio:5/4; background: linear-gradient(160deg,#1c4522,#0e2612 60%,#080d08); box-shadow: var(--shadow-lg); position:relative; border:1px solid var(--line); }
.feature-img::after { content:""; position:absolute; inset:0; background: radial-gradient(300px 200px at 30% 20%, rgba(142,208,41,.22), transparent 60%); }
.feature-img img { width:100%; height:100%; object-fit:cover; position:relative; z-index:1; }
.check-list { list-style:none; margin:24px 0 0; padding:0; display:grid; gap:14px; }
.check-list li { display:flex; gap:12px; align-items:flex-start; font-weight:500; color: var(--ink-soft); }
.check-list li svg { flex:0 0 auto; width:24px; height:24px; color: var(--green); margin-top:1px; }

/* Gallery */
.gallery { display:grid; grid-template-columns: repeat(3,1fr); gap:16px; }
.shot { position:relative; border-radius: var(--radius); overflow:hidden; aspect-ratio:4/3; border:1px solid var(--line); background: linear-gradient(160deg,#121a13,#0b110c); box-shadow: var(--shadow-sm); transition: transform .25s, box-shadow .25s; }
.shot:hover { transform: translateY(-4px); box-shadow: var(--shadow); }
.shot img { width:100%; height:100%; object-fit:cover; }
.shot .ph { position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:8px; text-align:center; color: var(--stone); padding:16px; }
.shot .ph svg { width:34px; height:34px; color: var(--green); opacity:.7; }
.shot .ph code { font-size:.72rem; color: var(--cyan); background: rgba(36,181,214,.1); padding:3px 8px; border-radius:6px; }
.shot .tag { position:absolute; top:12px; left:12px; z-index:3; background: var(--green); color:#0a1a06; font-family: var(--font-display); font-weight:700; font-size:.72rem; padding:5px 12px; border-radius: var(--radius-pill); }

/* Reviews */
.reviews-grid { display:grid; grid-template-columns: repeat(3,1fr); gap: var(--gap); }
.review { background: var(--surface); border:1px solid var(--line); border-radius: var(--radius); padding:28px; }
.review:hover { transform: translateY(-4px); border-color: rgba(142,208,41,.4); }
.review .stars { color: var(--green); letter-spacing:2px; margin-bottom:14px; }
.review p { color: var(--ink-soft); font-size:1rem; }
.review .who { display:flex; align-items:center; gap:12px; margin-top:18px; }
.review .avatar { width:44px; height:44px; border-radius:50%; background: linear-gradient(135deg,var(--green),var(--cyan)); color:#0a1a06; display:flex; align-items:center; justify-content:center; font-family: var(--font-display); font-weight:700; }
.review .who strong { font-family: var(--font-display); font-size:.95rem; display:block; color: var(--ink); }
.review .who span { font-size:.82rem; color: var(--stone); }
.google-badge { display:inline-flex; align-items:center; gap:12px; background: var(--surface); border:1px solid var(--line-strong); border-radius: var(--radius-pill); padding:12px 24px; font-weight:700; color: var(--ink); transition:.25s; }
.google-badge:hover { border-color: var(--green); transform: translateY(-2px); }
.google-badge .g { font-family: var(--font-display); font-weight:700; font-size:1.1rem; }
.google-badge .stars { color: var(--green); letter-spacing:2px; }

/* FAQ accordion */
.faq-list { max-width:860px; margin-inline:auto; display:grid; gap:12px; }
.faq-item { background: var(--surface); border:1px solid var(--line); border-radius: var(--radius-sm); overflow:hidden; transition: border-color .25s; }
.faq-item[open] { border-color: rgba(142,208,41,.5); }
.faq-item summary { list-style:none; cursor:pointer; padding:20px 24px; font-family: var(--font-display); font-weight:600; color: var(--ink); display:flex; align-items:center; justify-content:space-between; gap:16px; }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary::after { content:"+"; font-size:1.4rem; color: var(--green); transition: transform .25s; line-height:1; }
.faq-item[open] summary { background: var(--green); color:#0a1a06; }
.faq-item[open] summary::after { content:"\2212"; color:#0a1a06; }
.faq-item .faq-a { padding:0 24px 22px; color: var(--ink-soft); }
.faq-item[open] .faq-a { padding-top:18px; }

/* Locations */
.area-search { width:100%; max-width:560px; margin:0 auto 8px; display:block; padding:16px 22px; border-radius: var(--radius-pill); border:1px solid var(--line-strong); background: rgba(255,255,255,.04); color: var(--ink); font-family: var(--font-body); font-size:1.05rem; }
.area-search:focus { outline:none; border-color: var(--green); box-shadow:0 0 0 4px rgba(142,208,41,.18); }
.area-search::placeholder { color:#7c857a; }
.area-none { text-align:center; color: var(--stone); padding:20px; display:none; }
.loc-grid { display:grid; grid-template-columns: repeat(4,1fr); gap:14px; }
.loc-chip { background: var(--surface); border:1px solid var(--line); border-radius: var(--radius-sm); padding:16px 18px; display:flex; align-items:center; justify-content:space-between; gap:10px; transition: transform .25s, box-shadow .25s, border-color .25s, background .25s; }
.loc-chip:hover { transform: translateY(-3px); box-shadow: var(--shadow); border-color: rgba(142,208,41,.5); background: rgba(142,208,41,.05); }
.loc-chip strong { font-family: var(--font-display); font-weight:700; font-size:1rem; color: var(--ink); }
.loc-chip span { font-size:.8rem; color: var(--stone); display:block; }
.loc-chip svg { width:18px; height:18px; color: var(--green); flex:0 0 auto; }

/* CTA band */
.cta-band { border-radius: var(--radius-lg); background: linear-gradient(135deg,#12160f,#0a0c0a); color:#eef3ea; padding: clamp(40px,6vw,72px); text-align:center; box-shadow: var(--shadow-lg); position:relative; overflow:hidden; border:1px solid rgba(142,208,41,.28); }
.cta-band::after { content:""; position:absolute; inset:0; background: radial-gradient(600px 240px at 50% -20%, rgba(142,208,41,.28), transparent 70%); pointer-events:none; }
.cta-band > * { position:relative; z-index:1; }
.cta-band h2 { color:#fff; }
.cta-band .eyebrow { color: var(--green-2); }
.cta-band p { color: rgba(255,255,255,.85); max-width:560px; margin-inline:auto; }
.cta-band .hero-actions { justify-content:center; }

/* Contact */
.contact-grid { display:grid; grid-template-columns:1fr 1.1fr; gap: clamp(28px,5vw,56px); align-items:start; }
.contact-info { display:grid; gap:16px; }
.info-row { display:flex; gap:16px; align-items:flex-start; background: var(--surface); border:1px solid var(--line); border-radius: var(--radius); padding:22px; transition: transform .25s, border-color .25s; }
.info-row:hover { transform: translateY(-4px); border-color: rgba(142,208,41,.4); }
.info-row .icon { width:48px; height:48px; border-radius:14px; background: linear-gradient(135deg, rgba(142,208,41,.2), rgba(36,181,214,.16)); color: var(--green); display:flex; align-items:center; justify-content:center; flex:0 0 auto; border:1px solid rgba(142,208,41,.3); }
.info-row .icon svg { width:24px; height:24px; }
.info-row .info-label, .info-row h3 { font-size:1.05rem; margin-bottom:2px; font-weight:700; }
.info-row p { margin:0; color: var(--stone); }
.info-row a { color: var(--cyan); font-weight:700; }

form.quote { background: var(--panel); border:1px solid var(--line); border-radius: var(--radius-lg); padding: clamp(24px,4vw,40px); box-shadow: var(--shadow); }
.field { margin-bottom:18px; }
.field label { display:block; font-family: var(--font-display); font-weight:600; font-size:.9rem; margin-bottom:8px; color: var(--ink); }
.field input, .field select, .field textarea { width:100%; padding:14px 16px; border-radius: var(--radius-sm); border:1px solid var(--line-strong); background: rgba(255,255,255,.03); font-family: var(--font-body); font-size:1rem; color: var(--ink); transition: border-color .25s, box-shadow .25s; }
.field input::placeholder, .field textarea::placeholder { color:#7c857a; }
.field input:focus, .field select:focus, .field textarea:focus { outline:none; border-color: var(--green); box-shadow:0 0 0 4px rgba(142,208,41,.18); }
.field textarea { min-height:120px; resize:vertical; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.form-note { font-size:.82rem; color: var(--stone); margin-top:6px; }

/* Inner page hero */
.loc-hero { background: var(--bg-2); position:relative; padding: clamp(48px,7vw,86px) 0; overflow:hidden; }
.loc-hero::before { content:""; position:absolute; width:440px; height:440px; top:-170px; right:-110px; border-radius:50%; background: radial-gradient(circle, rgba(142,208,41,.22), transparent 62%); filter: blur(30px); pointer-events:none; }
.loc-hero .container { position:relative; z-index:1; }
.loc-hero .eyebrow { color: var(--cyan); }
.loc-hero h1 { color:#fff; max-width:820px; }
.loc-hero h1 span { background: linear-gradient(100deg,var(--cyan),var(--green)); -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.loc-hero p { color: rgba(255,255,255,.82); max-width:640px; }
.breadcrumb { font-size:.85rem; color: var(--stone); margin-bottom:20px; }
.breadcrumb a { color: var(--cyan); }
.breadcrumb a:hover { color:#fff; }

/* Footer */
.site-footer { background: #060806; color: rgba(238,243,234,.72); padding: clamp(48px,7vw,84px) 0 32px; position:relative; }
.site-footer::before { content:""; display:block; height:6px; background: linear-gradient(90deg,var(--green),var(--cyan)); margin-bottom: clamp(40px,6vw,64px); border-radius:2px; }
.footer-top { display:grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: var(--gap); }
.site-footer h4 { color:#fff; font-family: var(--font-display); font-size:.95rem; letter-spacing:.05em; text-transform:uppercase; margin-bottom:18px; }
.site-footer a { color: rgba(238,243,234,.72); display:block; padding:5px 0; transition: color .25s, transform .25s; }
.site-footer a:hover { color: var(--green); transform: translateX(3px); }
.site-footer .brand { margin-bottom:16px; }
.site-footer .brand .brand-logo { height:50px; }
.footer-cols-links { columns:2; }
.footer-social { display:flex; gap:10px; margin-top:14px; }
.footer-social a { display:inline-flex; width:42px; height:42px; align-items:center; justify-content:center; border-radius:50%; border:1px solid rgba(255,255,255,.2); color:#fff; padding:0; transition:.25s; }
.footer-social a:hover { border-color: var(--green); color: var(--green); transform: translateY(-3px); }
.footer-social svg { width:18px; height:18px; }
.footer-bottom { display:flex; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-top:48px; padding-top:24px; border-top:1px solid rgba(255,255,255,.12); font-size:.85rem; color: rgba(238,243,234,.5); }

/* Sticky mobile call bar */
.mobile-cta { position:fixed; left:0; right:0; bottom:0; z-index:60; display:none; gap:10px; padding:10px 12px calc(10px + env(safe-area-inset-bottom)); background: rgba(10,12,10,.92); backdrop-filter: blur(12px); border-top:1px solid var(--line); }
.mobile-cta a { flex:1; text-align:center; padding:14px; border-radius: var(--radius-pill); font-family: var(--font-display); font-weight:700; font-size:.95rem; }
.mobile-cta .call { background: rgba(255,255,255,.08); color:#fff; border:1px solid var(--line-strong); }
.mobile-cta .quote { background: linear-gradient(135deg,var(--green),var(--green-dk)); color:#0a1a06; }

/* Skip link + focus */
.skip-link { position:absolute; left:12px; top:-60px; z-index:100; background: var(--green); color:#0a1a06; font-family: var(--font-display); font-weight:700; padding:12px 18px; border-radius: var(--radius-pill); transition: top .2s; }
.skip-link:focus { top:12px; outline:none; box-shadow: var(--glow); }
a:focus-visible, button:focus-visible, .btn:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible { outline:2px solid var(--cyan); outline-offset:2px; }

/* Reveal */
.reveal { opacity:0; transform: translateY(26px); transition: opacity .7s ease, transform .7s cubic-bezier(.2,.7,.3,1); }
.reveal.in { opacity:1; transform:none; }

/* Responsive */
@media (max-width: 960px) {
  .hero-grid { grid-template-columns:1fr; }
  .hero-visual { aspect-ratio:16/11; max-height:420px; }
  .grid-3,.grid-4,.stats,.steps,.reviews-grid,.gallery { grid-template-columns: repeat(2,1fr); }
  .loc-grid { grid-template-columns: repeat(2,1fr); }
  .split,.contact-grid { grid-template-columns:1fr; }
  .footer-top { grid-template-columns:1fr 1fr; }
  .qgrid { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 720px) {
  .nav-links,.nav-phone { display:none; }
  .nav-toggle { display:flex; }
  body.nav-open .nav-links { display:flex; flex-direction:column; align-items:stretch; position:absolute; top:80px; left:0; right:0; background: rgba(10,12,10,.98); backdrop-filter: blur(16px); padding:16px; gap:4px; border-bottom:1px solid var(--line); box-shadow: var(--shadow); }
  body.nav-open .nav-links a { padding:14px 16px; font-size:1.05rem; color: rgba(238,243,234,.9); }
  body.nav-open .nav-links a::after { display:none; }
  .grid-3,.grid-4,.stats,.steps,.reviews-grid,.loc-grid,.gallery { grid-template-columns:1fr; }
  .form-row,.qgrid { grid-template-columns:1fr; }
  .footer-top { grid-template-columns:1fr; }
  .hero-trust { gap:20px; }
  .mobile-cta { display:flex; }
  body { padding-bottom:74px; }
}
@media (prefers-reduced-motion: reduce) { *{scroll-behavior:auto !important; animation:none !important;} .reveal{opacity:1; transform:none; transition:none;} }

/* footer headings (h3.foot-h) — keep the small uppercase label look + correct heading order */
.site-footer h3.foot-h { color:#fff; font-family: var(--font-display); font-size:.95rem; letter-spacing:.05em; text-transform:uppercase; margin-bottom:18px; }

/* Dropdown readability — force dark list with light text */
.qgrid select, .field select { color-scheme: dark; }
.qgrid select option, .field select option { background:#12170f; color:#f3f6ef; }
.post-links{list-style:none;margin:8px 0 0;padding:0;display:grid;gap:12px;max-width:760px}
.post-links li{padding-left:22px;position:relative;color:var(--muted);line-height:1.6}
.post-links li::before{content:"";position:absolute;left:0;top:10px;width:8px;height:8px;border-radius:50%;background:var(--green)}
.post-links a{color:var(--cyan);font-weight:600;text-decoration:none}
.post-links a:hover{text-decoration:underline}
.dad-jokes{list-style:none;margin:0;padding:0;display:grid;gap:14px;max-width:820px}
.dad-jokes li{position:relative;padding-left:32px;font-size:1.05rem;color:var(--muted);font-style:italic;line-height:1.55}
.dad-jokes li::before{content:"\201C";position:absolute;left:0;top:2px;font-size:2rem;color:var(--green);font-style:normal;line-height:.7}
.map-embed{border-radius:18px;overflow:hidden;border:1px solid var(--line,rgba(255,255,255,.08));line-height:0;max-width:960px}
.map-embed iframe{width:100%;height:360px;border:0;display:block;filter:grayscale(.15)}

/* Quote confirmation screen */
.quote-confirm{
  background:linear-gradient(180deg,rgba(126,217,87,.06),rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.10);
  border-radius:22px;
  padding:36px 30px;
  max-width:600px;
  margin:0 auto;
  outline:none;
  animation:qcIn .5s cubic-bezier(.2,.8,.2,1) both;
}
@keyframes qcIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.quote-confirm .qc-head{text-align:center;margin-bottom:26px;}
.quote-confirm .qc-tick{
  width:64px;height:64px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;margin:0 auto 16px;
  background:radial-gradient(circle at 50% 40%,#8ae95f,#5fbf3a);color:#0d1408;
  box-shadow:0 8px 22px rgba(126,217,87,.32);
  animation:qcPop .45s .12s cubic-bezier(.2,1.3,.4,1) both;
}
@keyframes qcPop{from{transform:scale(0)}to{transform:scale(1)}}
.quote-confirm .qc-tick svg{width:30px;height:30px;}
.quote-confirm h2{margin:0 0 6px;font-size:1.55rem;line-height:1.2;}
.quote-confirm .qc-head p{margin:0;color:var(--stone,#b9bdb8);}
.quote-confirm h3{margin:0 0 14px;font-size:.78rem;letter-spacing:.09em;text-transform:uppercase;color:var(--tan,#d8b98a);}

.quote-confirm .qc-steps{list-style:none;margin:0 0 24px;padding:0;display:flex;flex-direction:column;gap:14px;}
.quote-confirm .qc-steps li{display:flex;gap:14px;align-items:flex-start;}
.quote-confirm .qc-num{
  flex:0 0 30px;width:30px;height:30px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  background:rgba(126,217,87,.14);color:#8ae95f;font-weight:700;font-size:.95rem;
  border:1px solid rgba(126,217,87,.35);
}
.quote-confirm .qc-step-b{display:flex;flex-direction:column;gap:2px;padding-top:2px;}
.quote-confirm .qc-step-b strong{color:#f2f5ef;font-weight:600;font-size:1rem;}
.quote-confirm .qc-step-b span{color:var(--stone,#b9bdb8);font-size:.9rem;}

.quote-confirm .qc-card{
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);
  border-radius:14px;padding:16px 18px;margin-bottom:24px;
}
.quote-confirm .qc-summary{list-style:none;margin:0;padding:0;}
.quote-confirm .qc-summary li{
  display:flex;justify-content:space-between;gap:12px;
  padding:9px 0;border-bottom:1px solid rgba(255,255,255,.07);color:#e9ece8;font-size:.95rem;
}
.quote-confirm .qc-summary li:last-child{border-bottom:none;}
.quote-confirm .qc-summary strong{color:var(--stone,#b9bdb8);font-weight:600;}

.quote-confirm .qc-cta{
  display:flex;align-items:center;gap:14px;flex-wrap:wrap;justify-content:center;
  padding-top:4px;
}
.quote-confirm .qc-btn{
  display:inline-flex;align-items:center;gap:9px;
  background:#7ed957;color:#0d1408;font-weight:700;text-decoration:none;
  padding:13px 22px;border-radius:12px;box-shadow:0 6px 18px rgba(126,217,87,.28);
}
.quote-confirm .qc-btn:hover{filter:brightness(1.06);}
.quote-confirm .qc-btn svg{width:18px;height:18px;}
.quote-confirm .qc-or{color:var(--stone,#b9bdb8);font-size:.92rem;}
.quote-confirm .qc-tip{text-align:center;color:var(--stone,#b9bdb8);font-size:.88rem;margin:22px 0 0;}
.quote-confirm a{color:var(--tan,#d8b98a);font-weight:600;}
.quote-confirm .qc-btn{color:#0d1408;}
.price-cards .card{text-align:center;display:flex;flex-direction:column}
.price-cards .price{font-family:var(--font-display);font-weight:700;font-size:2.1rem;color:var(--green);margin:8px 0 10px;line-height:1}
.price-cards .card.featured{border-color:var(--green);box-shadow:0 0 0 1px var(--green),var(--shadow-lg);position:relative}
.price-cards .card.featured::before{content:"Most common";position:absolute;top:-11px;left:50%;transform:translateX(-50%);background:var(--green);color:#0a1a06;font-family:var(--font-display);font-weight:700;font-size:.72rem;padding:3px 12px;border-radius:var(--radius-pill);white-space:nowrap}
.price-cards .card p{flex:1}
.price-note{margin-top:18px;color:var(--muted);text-align:center;max-width:640px;margin-left:auto;margin-right:auto}
.benefits-list{display:grid;grid-template-columns:1fr 1fr;gap:14px 34px;max-width:900px;margin-left:auto;margin-right:auto}
.benefits-list li{align-items:flex-start}
@media(max-width:640px){.benefits-list{grid-template-columns:1fr}}
.author-box{display:flex;gap:18px;align-items:center;max-width:760px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius-lg);padding:20px 22px;box-shadow:var(--shadow-sm)}
.author-box img{width:90px;height:90px;border-radius:50%;object-fit:cover;flex:0 0 90px;border:2px solid var(--green)}
.author-box h3{margin:2px 0 6px;font-size:1.15rem}
.author-box p{margin:0;color:var(--muted);font-size:.95rem;line-height:1.55}
@media(max-width:520px){.author-box{flex-direction:column;text-align:center}.author-box img{margin:0 auto}}
.mobile-cta .text{background:var(--cyan);color:#04121a;border:1px solid var(--cyan)}