/* (c) 2026 Longshire Technologies Inc. All rights reserved.
   Layout: animated tree scene fixed behind; site content scrolls in a right-hand column of translucent panels (full width on phones). Single night look by choice. */
:root{
  --night:#060b15;
  --panel:rgba(12,19,32,.80);
  --panel-soft:rgba(12,19,32,.62);
  --fg:#e8edf6;
  --muted:#a3b0c5;
  --accent:#6aa3ff;
  --accent-d:#8dbaff;
  --btn:#1f5fbf;
  --btn-d:#2a6fd6;
  --line:rgba(106,163,255,.22);
  --energy:#46e3ff;
  --font:system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--night);color:var(--fg);font:16px/1.6 var(--font)}
a{color:var(--accent)}a:hover{color:var(--accent-d)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:2px solid var(--energy);outline-offset:2px}
#scene{position:fixed;inset:0;width:100%;height:100%;display:block;z-index:0}

.bar{position:fixed;top:0;left:0;right:0;z-index:5;background:rgba(6,11,21,.78);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--line);padding-top:env(safe-area-inset-top,0px)}
.bar .in{display:flex;align-items:center;justify-content:space-between;gap:12px 18px;flex-wrap:wrap;min-height:58px;padding-inline:20px;max-width:1400px;margin:0 auto}
.logo{font-weight:700;font-size:1.1rem;color:var(--fg);text-decoration:none;letter-spacing:.2px}
.logo span{color:var(--accent)}
.bar nav{display:flex;gap:6px 18px;align-items:center;flex-wrap:wrap;font-size:.95rem}
.bar nav a{color:var(--fg);text-decoration:none}.bar nav a:hover{color:var(--accent)}
.lang{border:1px solid var(--line);border-radius:6px;padding:2px 8px;font-size:.85rem}

.content{position:relative;z-index:1;pointer-events:none;padding-inline:16px;padding-block:96px 34vh;display:flex;flex-direction:column;gap:28px}
@media (min-width:900px){.content{padding-left:39vw;padding-right:4vw}}
.panel{pointer-events:auto;max-width:780px;width:100%;background:var(--panel);backdrop-filter:blur(7px);-webkit-backdrop-filter:blur(7px);border:1px solid var(--line);border-radius:14px;padding:28px}
.hero{background:var(--panel-soft);padding-block:36px}
.hero h1{font-size:clamp(1.8rem,4.2vw,2.9rem);line-height:1.15;margin:0 0 16px;text-wrap:balance}
.hero p{font-size:1.12rem;color:var(--muted);margin:0 0 24px;max-width:62ch}
.hero .tip{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.btns{display:flex;flex-wrap:wrap;gap:10px}
.btn{display:inline-block;background:var(--btn);color:#fff;padding:12px 22px;border-radius:8px;text-decoration:none;font-weight:600;border:0;font:inherit;font-weight:600;cursor:pointer}
.btn:hover{background:var(--btn-d);color:#fff}
.btn.sec{background:transparent;color:var(--accent);border:1px solid var(--accent)}
.btn.sec:hover{color:var(--accent-d);border-color:var(--accent-d);background:transparent}
h2{font-size:1.6rem;margin:0 0 8px;text-wrap:balance}
.lead{color:var(--muted);margin:0 0 24px;max-width:66ch}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:14px}
.card{background:rgba(255,255,255,.035);border:1px solid var(--line);border-radius:10px;padding:18px;min-width:0}
.card h3{margin:0 0 6px;font-size:1.03rem}
.card p{margin:0;color:var(--muted);font-size:.95rem}
.steps{counter-reset:s;list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,160px),1fr));gap:16px}
.steps li{counter-increment:s;border-top:2px solid var(--accent);padding-top:10px;min-width:0}
.steps li::before{content:counter(s);display:block;font:600 .85rem var(--mono);color:var(--accent)}
.steps b{display:block}.steps span{color:var(--muted);font-size:.94rem}
form.quote{display:grid;gap:14px}
form.quote label{display:grid;gap:6px;font-weight:600;font-size:.95rem}
form.quote input,form.quote textarea,form.quote select{font:inherit;font-weight:400;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:rgba(6,11,21,.7);color:var(--fg);width:100%}
form.quote textarea{min-height:130px;resize:vertical}
form.quote .row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:560px){form.quote .row{grid-template-columns:1fr}}
.status{margin:0;font-size:.92rem;color:var(--energy)}
.links{display:flex;gap:12px;flex-wrap:wrap;margin-top:8px}
.links a{border:1px solid var(--line);border-radius:8px;padding:8px 14px;text-decoration:none;color:var(--fg)}
.links a:hover{border-color:var(--accent);color:var(--accent)}
.note{font-size:.85rem;color:var(--muted);margin:22px 0 0}
.mail{user-select:all}
.foot{position:fixed;left:0;right:0;bottom:0;z-index:5;pointer-events:auto;margin:0;border-radius:0;background:rgba(6,11,21,.82);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-top:1px solid var(--line);padding:6px 16px calc(6px + env(safe-area-inset-bottom,0px));font-size:.74rem;line-height:1.45;color:var(--muted);display:flex;flex-wrap:wrap;gap:0 18px;justify-content:center;text-align:center}
.meter{position:fixed;left:16px;bottom:calc(var(--foot-h,34px) + 12px + env(safe-area-inset-bottom,0px));z-index:4;font:600 .8rem var(--mono);color:#04121a;background:var(--energy);border-radius:999px;padding:6px 12px;pointer-events:none;box-shadow:0 0 18px rgba(70,227,255,.55)}

form.quote .hp{position:absolute;left:-9999px}
form.quote button{justify-self:start}
.contact-mail{margin:22px 0 0}

@media (max-width:640px){.foot{font-size:.68rem}.meter{--foot-h:46px}}

/* v10.6 price table */
.prices-h{margin:30px 0 12px;font-size:1.15rem}
.prices-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:10px}
.prices{width:100%;border-collapse:collapse;font-size:.92rem;font-variant-numeric:tabular-nums}
.prices th,.prices td{padding:10px 14px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}
.prices th{font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-weight:600;background:rgba(255,255,255,.03)}
.prices tbody tr:last-child td{border-bottom:0}
.prices td:nth-child(2){color:var(--muted);width:24%}
.prices td.pr{font-weight:600;width:24%}
.prices-note{margin:10px 0 0}
@media(max-width:560px){.prices{font-size:.86rem}.prices th,.prices td{padding:8px 10px}.prices td:nth-child(2),.prices td.pr{white-space:normal}}

.pkg-lead{margin:-4px 0 12px;color:var(--muted)}
.prices.pkgs td.pr{width:18%}
.prices.pkgs td:nth-child(2){color:inherit;width:20%}
.pkg-terms{margin:10px 0 0;padding-left:18px}
.pkg-terms li{margin:4px 0}