/* Kings Trash Cleaning — MWC template mapped to the logo's own colors:
   black ground, lime #7baf15, deep navy #01122d, Georgia display with italic
   accent words, mono eyebrows, pill buttons, hard offset shadows. */
:root {
  --ground:#05070c; --panel:#0b1626; --navy:#01122d; --card:#0d1626;
  --lime:#7baf15; --lime-bright:#a8d92a; --line:rgba(168,217,42,.16);
  --ink:#eaf1e6; --text:#a7b6ac; --muted:#7e9186; --radius:16px;
  --display:Georgia,"Times New Roman",serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:120px; }
body { margin:0; background:var(--ground); color:var(--ink); font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Helvetica Neue",Arial,sans-serif; -webkit-font-smoothing:antialiased; }
body:before { content:""; position:fixed; z-index:50; top:0; left:0; width:100%; height:3px; background:var(--lime); transform:scaleX(var(--scroll-p,0)); transform-origin:left; transition:transform .1s linear; }
a { color:inherit; }

/* ticker */
.ticker { position:relative; z-index:21; display:flex; justify-content:center; gap:.5rem; padding:.55rem 1rem; background:var(--lime); color:var(--navy); font-family:var(--mono); font-size:.72rem; font-weight:700; letter-spacing:.14em; text-transform:uppercase; text-align:center; }

/* header */
.site-header { position:sticky; top:0; z-index:20; display:flex; align-items:center; gap:2rem; min-height:74px; padding:.8rem clamp(1rem,5vw,5rem); background:rgba(5,7,12,.88); border-bottom:1px solid var(--line); backdrop-filter:blur(16px); }
.wordmark { display:flex; flex-direction:column; align-items:flex-start; gap:.2rem; margin-right:auto; text-decoration:none; font-weight:900; letter-spacing:.14em; text-transform:uppercase; font-size:1.05rem; line-height:1; }
.wordmark-tag { display:flex; align-items:center; gap:.45rem; color:var(--lime-bright); font-family:var(--mono); font-size:.58rem; font-weight:600; letter-spacing:.22em; }
.wordmark-tag:before,.wordmark-tag:after { content:""; width:16px; height:1px; background:var(--lime); }
nav { display:flex; gap:1.5rem; }
nav a { text-decoration:none; font-size:.9rem; font-weight:700; }
.header-call .short { display:none; }
.skip-link { position:absolute; left:1rem; top:-100px; z-index:60; padding:.6rem 1rem; background:var(--navy); color:white; font-weight:800; text-decoration:none; }
.skip-link:focus { top:1rem; }
.hp { position:absolute; left:-9999px; width:1px; height:1px; opacity:0; }
.header-call { padding:.75rem 1.1rem; border-radius:999px; background:var(--navy); border:1px solid rgba(168,217,42,.35); color:white; text-decoration:none; font-weight:800; font-size:.86rem; }
.header-call:after { content:" ↗"; color:var(--lime-bright); }

/* type */
.eyebrow { display:flex; align-items:center; gap:.7rem; margin:0 0 1.25rem; color:var(--muted); font-family:var(--mono); font-size:.72rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; }
.eyebrow:before { content:""; width:26px; height:2px; background:var(--lime); }
h1,h2,h3,blockquote { margin-top:0; font-family:var(--display); font-weight:700; letter-spacing:-.035em; }
h1 { margin-bottom:1.5rem; font-size:clamp(3.4rem,6.4vw,6.4rem); line-height:.95; }
h1 em,h2 em,blockquote em { font-style:italic; color:var(--lime-bright); }
.hero-lead { max-width:560px; font-size:clamp(1.05rem,1.5vw,1.25rem); line-height:1.65; color:var(--text); }
h2 { margin-bottom:1.25rem; font-size:clamp(2.4rem,4.4vw,4.4rem); line-height:1.02; }

/* hero */
.hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(400px,1.05fr); align-items:center; gap:clamp(2rem,6vw,6rem); padding:clamp(3.5rem,7vw,6.5rem) clamp(1.25rem,7vw,7rem); overflow:hidden; }
.hero-copy { max-width:640px; }
.hero-actions { display:flex; flex-wrap:wrap; gap:.75rem; margin:2rem 0 1rem; }
.button { display:inline-flex; justify-content:center; align-items:center; gap:.6rem; min-height:52px; padding:.9rem 1.5rem; border:1px solid var(--lime); border-radius:999px; text-decoration:none; font:inherit; font-size:.92rem; font-weight:800; cursor:pointer; transition:transform .15s ease,box-shadow .15s ease; }
.button.primary { background:var(--lime); border-color:var(--lime); color:var(--navy); }
.button.primary:after { content:"→"; }
.button.secondary { background:transparent; color:var(--ink); border-color:rgba(168,217,42,.45); }
.button:hover { transform:translate(-2px,-2px); box-shadow:4px 4px 0 var(--navy); }
.button.primary:hover { box-shadow:4px 4px 0 rgba(168,217,42,.45); }
:focus-visible { outline:3px solid var(--lime-bright); outline-offset:3px; }
.door-note { font-size:.84rem; color:var(--muted); }
.brand-frame { position:relative; border:10px solid var(--navy); border-radius:var(--radius); background:#000; box-shadow:14px 14px 0 var(--lime); transform:rotate(-1.6deg); transition:transform .25s ease; }
.brand-frame:hover { transform:rotate(0deg); }
.brand-frame img { display:block; width:100%; height:auto; aspect-ratio:3/2; object-fit:cover; border-radius:calc(var(--radius) - 8px); }

/* trust strip */
.trust-strip { display:grid; grid-template-columns:repeat(3,1fr); border-block:1px solid var(--line); background:var(--panel); }
.trust-strip p { display:flex; flex-direction:column; gap:.4rem; margin:0; padding:1.5rem clamp(1rem,5vw,5rem); border-right:1px solid var(--line); }
.trust-strip p:last-child { border-right:0; }
.trust-strip strong { font-family:var(--display); font-size:1.35rem; }
.trust-strip span { color:var(--muted); font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; }

.section { padding:clamp(4.5rem,8vw,7.5rem) clamp(1.25rem,7vw,7rem); }
.section-heading { max-width:820px; margin-bottom:3rem; }
.section-heading>p:last-child,.quote-copy>p,.promise>p:last-child { max-width:600px; color:var(--text); font-size:1.05rem; line-height:1.7; }

/* services: numbered colour blocks */
.service-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }
.service-grid article { display:flex; flex-direction:column; min-height:300px; padding:1.6rem; border:1px solid var(--line); border-radius:var(--radius); background:var(--panel); }
.service-grid article:nth-child(1) { background:var(--lime); border-color:var(--lime); color:var(--navy); }
.service-grid article:nth-child(1) p { color:#123018; }
.service-grid article:nth-child(3) { background:var(--navy); border-color:var(--navy); }
.service-grid article:nth-child(3) p { color:#9db4c9; }
.service-grid span { font-family:var(--mono); font-size:.72rem; font-weight:600; letter-spacing:.1em; color:var(--lime-bright); }
.service-grid article:nth-child(1) span { color:var(--navy); }
.service-grid h3 { margin:auto 0 .75rem; padding-top:2.5rem; font-size:1.5rem; }
.service-grid p { margin:0; color:var(--text); line-height:1.6; }
.service-grid article:hover { transform:translate(-2px,-2px); box-shadow:6px 6px 0 rgba(123,175,21,.55); transition:transform .15s ease,box-shadow .15s ease; }

/* promise band — lime on the dark site, drip edge below */
.promise { position:relative; padding-block:clamp(4rem,7vw,6rem); background:var(--lime); color:var(--navy); }
.promise:after { content:""; position:absolute; z-index:1; left:0; right:0; bottom:-22px; height:22px; pointer-events:none; background:radial-gradient(circle at 14px -14px, #7baf15 24px, transparent 25px) 0 0/117px 30px repeat-x, radial-gradient(circle at 51px -4px, #7baf15 12px, transparent 13px) 0 0/117px 30px repeat-x, radial-gradient(circle at 79px -10px, #7baf15 17px, transparent 18px) 0 0/117px 30px repeat-x, radial-gradient(circle at 103px -16px, #7baf15 21px, transparent 22px) 0 0/117px 30px repeat-x; }
.promise .eyebrow { color:#1d3a10; }
.promise .eyebrow:before { background:var(--navy); }
.promise blockquote em { color:var(--navy); }
blockquote { max-width:20ch; margin:0 0 1.5rem; font-size:clamp(2.2rem,4.6vw,4.6rem); line-height:1.05; }
.promise>p:last-child { color:#1d3a10; }

/* faq */
.faq { padding-top:3.5rem; }
.faq .section-heading { margin-bottom:1.5rem; }
.faq-list { max-width:820px; border-top:1px solid var(--line); }
.faq-list details { border-bottom:1px solid var(--line); }
.faq-list summary { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1.1rem 0; cursor:pointer; list-style:none; font-family:var(--display); font-size:1.2rem; font-weight:700; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary:after { content:"+"; flex:none; width:28px; height:28px; display:grid; place-items:center; border:1px solid var(--lime); border-radius:999px; color:var(--lime-bright); font-family:var(--mono); font-weight:400; }
.faq-list details[open] summary:after { content:"−"; }
.faq-list p { margin:0 0 1.25rem; max-width:640px; color:var(--text); line-height:1.7; }

/* quote form */
.quote { display:grid; grid-template-columns:minmax(0,.8fr) minmax(440px,1fr); gap:clamp(3rem,7vw,7rem); align-items:start; background:var(--panel); }
.quote-copy { position:sticky; top:120px; }
.quote-copy>a { font-weight:800; }
.route-form { position:relative; display:grid; grid-template-columns:1fr 1fr; gap:1rem; padding:clamp(1.5rem,4vw,2.75rem); border:1px solid var(--line); border-radius:var(--radius); background:var(--card); box-shadow:12px 12px 0 rgba(123,175,21,.85); }
.form-chip { grid-column:1/-1; justify-self:start; margin:0; padding:.3rem .6rem; background:var(--lime); color:var(--navy); font-family:var(--mono); font-size:.7rem; font-weight:700; letter-spacing:.12em; }
.route-form label { display:grid; gap:.5rem; font-size:.82rem; font-weight:800; }
.route-form label small { font-weight:400; color:var(--muted); }
.route-form input,.route-form textarea { width:100%; border:1px solid rgba(168,217,42,.3); border-radius:var(--radius); background:#060d18; color:var(--ink); padding:.9rem; font:inherit; }
.route-form input:focus,.route-form textarea:focus { outline:3px solid rgba(168,217,42,.4); border-color:var(--lime); }
.route-form fieldset { grid-column:1/-1; margin:0; padding:1rem; border:1px solid var(--line); border-radius:var(--radius); }
.route-form legend { padding:0 .4rem; font-size:.82rem; font-weight:800; }
.choice-row { display:flex; flex-wrap:wrap; gap:.5rem 1.25rem; }
.choice-row label { display:flex; align-items:center; gap:.5rem; font-weight:600; font-size:.9rem; }
.choice-row input { width:auto; accent-color:var(--lime); }
.route-form .full,.route-form .button,.form-note,.form-error,.form-success { grid-column:1/-1; }
.form-note,.form-error,.form-success { margin:.2rem 0 0; font-size:.8rem; line-height:1.5; }
.form-note { color:var(--muted); }
.form-error { color:#ff9d8a; font-weight:700; }
.form-success { padding:.9rem 1rem; border:1px solid var(--lime); border-radius:var(--radius); background:rgba(123,175,21,.12); color:var(--lime-bright); font-weight:700; }

/* footer */
footer { display:grid; grid-template-columns:1fr auto; align-items:center; gap:2rem; padding:2.5rem clamp(1.25rem,7vw,7rem); background:#000; border-top:1px solid var(--line); }
footer div { display:flex; flex-direction:column; gap:.4rem; }
footer span { color:var(--muted); font-size:.85rem; }
footer a { text-underline-offset:.25em; font-family:var(--mono); font-size:.85rem; letter-spacing:.06em; color:var(--lime-bright); }

.mobile-bar { display:none; }
@keyframes rise { from { opacity:.35; transform:translateY(36px); } to { opacity:1; transform:none; } }
@supports (animation-timeline:view()) {
  .section-heading,.service-grid article,.promise blockquote,.quote .route-form {
    animation:rise linear both;
    animation-timeline:view();
    animation-range:entry 0% cover 32%;
  }
  .service-grid article:nth-child(2) { animation-range:entry 5% cover 37%; }
  .service-grid article:nth-child(3) { animation-range:entry 10% cover 42%; }
  .service-grid article:nth-child(4) { animation-range:entry 15% cover 47%; }
}
@media (max-width:980px) {
  .hero { grid-template-columns:1fr; }
  .service-grid { grid-template-columns:1fr 1fr; }
  .quote { grid-template-columns:1fr; }
  .quote-copy { position:static; }
}
@media (max-width:640px) {
  nav { display:none; }
  .wordmark { font-size:.85rem; }
  .wordmark-tag { font-size:.52rem; letter-spacing:.18em; }
  .header-call { padding:.65rem .8rem; }
  .header-call .short { display:inline; }
  .header-call .long { display:none; }
  .ticker { font-size:.66rem; }
  .ticker-tail { display:none; }
  .hero { padding-top:2.5rem; }
  h1 { font-size:clamp(2.9rem,14vw,4.4rem); }
  .brand-frame { border-width:8px; box-shadow:8px 8px 0 var(--lime); transform:rotate(-1deg); }
  .trust-strip { grid-template-columns:1fr; }
  .trust-strip p { border-right:0; border-bottom:1px solid var(--line); }
  .trust-strip p:last-child { border-bottom:0; }
  .service-grid { grid-template-columns:1fr; }
  .service-grid article { min-height:auto; }
  .service-grid h3 { padding-top:1.5rem; }
  .route-form { grid-template-columns:1fr; box-shadow:8px 8px 0 rgba(123,175,21,.85); }
  .route-form label { grid-column:1/-1; }
  footer { grid-template-columns:1fr; align-items:start; padding-bottom:6.5rem; }
  .mobile-bar { position:fixed; z-index:30; bottom:0; left:0; right:0; display:grid; grid-template-columns:1fr 2fr; gap:.6rem; padding:.7rem 1rem calc(.7rem + env(safe-area-inset-bottom)); background:rgba(5,7,12,.92); border-top:1px solid var(--line); backdrop-filter:blur(16px); }
  .mobile-bar .button { min-height:48px; }
}
@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  .section-heading,.service-grid article,.promise blockquote,.quote .route-form { animation:none; }
  .button:hover,.service-grid article:hover { transform:none; }
}