/* ===== AAA Martinez — shared Windows 98 shell (matches the client portal) ===== */
:root{
  --silver:#c0c0c0; --silver-hi:#dfdfdf; --silver-lo:#808080; --white:#fff; --ink:#0a0a0a;
  --navy:#000080; --navy2:#1084d0; --face:#c0c0c0;
  --ui:Tahoma,"MS Sans Serif",Geneva,Verdana,sans-serif;
  --head:"Arial Black","Arial Bold",Arial,sans-serif;
  --bevel-up: inset -1px -1px #0a0a0a, inset 1px 1px var(--white), inset -2px -2px var(--silver-lo), inset 2px 2px var(--silver-hi);
  --bevel-dn: inset 1px 1px #0a0a0a, inset -1px -1px var(--white), inset 2px 2px var(--silver-lo), inset -2px -2px var(--silver-hi);
}
*{ box-sizing:border-box; margin:0; }
html,body{ height:100%; overflow:hidden; }              /* NO SCROLL — every page is one screen */
body{ font-family:var(--ui); font-size:13px; color:var(--ink); user-select:none;
  background:radial-gradient(125% 125% at 50% 38%, #0d0d0f 0%, #000 72%); }
/* The retro pages (guestbook, leads, and the reference index/method/etc.) use
   class="desktop" — give that backdrop the same #008080 teal as the home desktop
   so nothing reads as the "old" black-background version. */
body.desktop{ background:#008080; }
a{ color:inherit; text-decoration:none; }

/* faint AAA desktop watermark */
.wm{ position:fixed; inset:0; display:grid; place-items:center; pointer-events:none; z-index:0; }
.wm b{ font-family:Georgia,"Times New Roman",serif; font-size:min(30vw,430px); font-weight:bold; color:rgba(255,255,255,.05); letter-spacing:-.04em; }

/* CRT scanlines (toggle in taskbar; on by default to match the portal) */
.crt::after{ content:""; position:fixed; inset:0; z-index:9998; pointer-events:none; opacity:.4;
  background:repeating-linear-gradient(to bottom, rgba(0,0,0,.22) 0, rgba(0,0,0,.22) 1px, transparent 1px, transparent 3px); }

/* ===== the page window (near-maximized, floats above the taskbar) ===== */
.win{ position:fixed; top:16px; bottom:46px; left:50%; transform:translateX(-50%);
  width:min(1080px, calc(100vw - 30px)); z-index:5;
  display:flex; flex-direction:column; background:var(--face); box-shadow:var(--bevel-up); padding:3px; }
.titlebar{ display:flex; align-items:center; padding:3px 3px 3px 8px; color:#fff; font-weight:bold; font-size:12.5px;
  background:linear-gradient(90deg,var(--navy),var(--navy2)); }
.titlebar .t{ flex:1; display:flex; align-items:center; gap:8px; }
.tb-btns{ display:flex; gap:2px; }
.tb-btn{ width:19px; height:16px; display:grid; place-items:center; font-size:10px; font-weight:bold; color:#000; background:var(--face); box-shadow:var(--bevel-up); }

/* toolbar nav */
.nav{ display:flex; gap:4px; padding:5px 6px; flex-wrap:wrap; border-bottom:1px solid var(--silver-lo); box-shadow:0 1px 0 var(--white); }
.nav a{ font-size:12px; padding:5px 13px; color:#000; background:var(--face); box-shadow:var(--bevel-up); }
.nav a:hover{ color:#000; }
.nav a.on{ font-weight:bold; box-shadow:var(--bevel-dn); }

/* window body */
.win-body{ flex:1; overflow:hidden; background:var(--face); display:flex; flex-direction:column; justify-content:center; padding:clamp(20px,4vw,54px); }
.win-body.center{ align-items:center; text-align:center; }

/* status bar */
.statusbar{ display:flex; align-items:center; gap:9px; padding:3px 6px; font-size:11px; color:#303030;
  border-top:1px solid var(--white); box-shadow:inset 0 1px 0 var(--silver-lo); }
.statusbar .cell{ box-shadow:var(--bevel-dn); padding:2px 8px; }
.statusbar .grow{ flex:1; }
.blink{ animation:blink 1.1s steps(1) infinite; } @keyframes blink{ 50%{ opacity:0; } }

/* ===== typography / content ===== */
.eyebrow{ font-size:12px; font-weight:bold; letter-spacing:.02em; color:#a00; text-transform:uppercase; }
h1{ font-family:var(--head); font-weight:900; color:var(--navy); line-height:1.02; letter-spacing:-.02em;
  font-size:clamp(1.9rem,5.2vw,4rem); margin:14px 0 0; max-width:18ch; }
h2{ font-family:var(--head); font-weight:900; color:var(--navy); line-height:1.04; letter-spacing:-.015em;
  font-size:clamp(1.5rem,3.8vw,2.7rem); margin:10px 0 0; max-width:20ch; }
/* hero "business" lockup — shiny WordArt: bold word, metallic red→gold shimmer sweep */
.hl{ font-family:var(--head); font-weight:900; font-size:1.9em; line-height:.85; letter-spacing:-.01em;
  color:#aa0000; /* fallback if background-clip:text is unsupported — hero red */
  background:linear-gradient(100deg,#800000 0%,#aa0000 16%,#e05a5a 30%,#ffffff 46%,#ffffff 54%,#5566bb 70%,#000080 84%,#000066 100%);
  background-size:240% 100%; -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent;
  filter:drop-shadow(2px 3px 0 rgba(0,0,0,.32));
  display:inline-block; transform:rotate(-5deg); transform-origin:center bottom;
  margin:0 .05em -.16em .06em; padding:0 .06em; position:relative; z-index:3;
  animation:hlshine 3.2s linear infinite; }
@keyframes hlshine{ from{ background-position:130% center; } to{ background-position:-150% center; } }
@media(prefers-reduced-motion:reduce){ .hl{ animation:none; } }
.lead{ margin-top:20px; font-size:clamp(.95rem,1.7vw,1.15rem); color:#1c1c1c; max-width:58ch; line-height:1.55; }
.body{ margin-top:16px; font-size:clamp(.92rem,1.5vw,1.06rem); color:#1c1c1c; max-width:62ch; line-height:1.6; }
.body.sub{ color:#3a3a3a; margin-top:10px; }
.body b, .lead b{ color:#000; }
.col{ max-width:760px; }

/* buttons */
.btns{ margin-top:30px; display:flex; flex-wrap:wrap; gap:12px; }
.btn{ display:inline-flex; align-items:center; gap:8px; font-family:var(--ui); font-size:14px; font-weight:bold; color:#000;
  padding:11px 20px; background:var(--face); box-shadow:var(--bevel-up); cursor:pointer; }
.btn:active{ box-shadow:var(--bevel-dn); }
.btn-go{ color:#053d05; background:#c9e7c9; }

/* services grid */
.grid{ margin-top:26px; display:grid; grid-template-columns:repeat(3,1fr); gap:10px; width:100%; max-width:940px; }
.cell{ background:#fff; box-shadow:var(--bevel-dn); padding:14px 15px; }
.cell b{ display:block; color:var(--navy); font-size:14px; }
.cell span{ display:block; margin-top:6px; font-size:12px; color:#333; line-height:1.45; }
@media(max-width:820px){ .grid{ grid-template-columns:repeat(2,1fr); } }

/* how-it-works steps */
.steps{ list-style:none; margin-top:22px; display:grid; grid-template-columns:1fr 1fr; gap:12px 26px; max-width:820px; }
.steps li{ display:flex; gap:12px; align-items:flex-start; }
.steps .n{ flex:none; width:26px; height:26px; display:grid; place-items:center; font-family:var(--head); color:#fff; background:var(--navy); box-shadow:var(--bevel-up); }
.steps div{ font-size:.98rem; color:#1c1c1c; } .steps b{ color:#000; }
@media(max-width:640px){ .steps{ grid-template-columns:1fr; } }

/* contact */
.mail{ display:inline-block; margin-top:22px; font-size:clamp(1.05rem,2.6vw,1.6rem); font-weight:bold; color:#0000c8; text-decoration:underline; }
.mail:hover{ color:#1084d0; }
.gb-link{ display:inline-block; margin-top:20px; font-size:13.5px; font-weight:bold; color:#0000c8; text-decoration:underline; }
.gb-link:hover{ color:#1084d0; }
.gb-link .pen{ display:inline-block; text-decoration:none; animation:blink 1.1s steps(1) infinite; }

/* ===== guestbook ===== */
.gb-body{ padding:13px clamp(14px,2.6vw,26px) 11px; justify-content:flex-start; }
.gb-intro{ font-size:12.5px; color:#2a2a2a; margin-bottom:10px; line-height:1.45; max-width:none; }
.gb-intro b{ color:#000; }
.gb{ display:grid; grid-template-columns:1.28fr .72fr; gap:18px; width:100%; flex:1; min-height:0; }
.gb-left{ display:flex; flex-direction:column; min-height:0; }
.gb-form{ flex:1; min-height:0; overflow:auto; padding-right:6px; }
.gb-grid{ display:grid; grid-template-columns:1fr 1fr; gap:9px 12px; }
.gb-field{ display:flex; flex-direction:column; gap:3px; }
.gb-field.full{ grid-column:1 / -1; }
.gb-field label{ font-size:11px; font-weight:bold; color:#000060; }
.gb-field label .req{ color:#a00; }
.gb-input,.gb-select,.gb-area{ font-family:var(--ui); font-size:12px; color:#000; background:#fff; box-shadow:var(--bevel-dn); border:0; padding:5px 7px; width:100%; }
.gb-area{ resize:none; line-height:1.4; }
.gb-form .btns{ margin-top:13px; }
/* the signatures wall */
.gb-wall{ display:flex; flex-direction:column; min-height:0; background:var(--face); box-shadow:var(--bevel-up); padding:6px; }
.gb-wall h3{ font-family:var(--head); font-size:13.5px; color:var(--navy); text-align:center; padding:3px 0 6px; }
.gb-wall-list{ flex:1; min-height:0; overflow:auto; background:#fff; box-shadow:var(--bevel-dn); padding:8px 9px; }
.gb-sig{ font-size:12px; color:#111; padding:7px 1px; border-bottom:1px dashed #d2d2d2; line-height:1.4; }
.gb-sig:last-child{ border-bottom:0; }
.gb-sig .num{ float:right; color:#aaa; font-size:10px; }
.gb-sig .who{ font-weight:bold; color:#0000a0; }
.gb-sig .whr{ color:#666; font-size:11px; }
.gb-sig .m{ display:block; margin-top:2px; color:#222; }
/* signed! confirmation */
.gb-ok{ display:none; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:10px; flex:1; min-height:0; padding:10px; }
.gb-ok h3{ font-family:var(--head); color:var(--navy); font-size:1.7rem; }
.gb-ok p{ font-size:13px; color:#222; max-width:42ch; line-height:1.55; }
.gb-ok .big{ font-size:2.4rem; }
@media(max-width:760px){ .gb{ grid-template-columns:1fr; } .gb-wall{ min-height:170px; } }

/* ===== leads console (private admin) ===== */
.lv-body{ padding:0; justify-content:flex-start; }
/* login gate */
.lv-login{ flex:1; display:flex; align-items:center; justify-content:center; }
.lv-login form{ width:min(340px,90%); background:var(--face); box-shadow:var(--bevel-up); padding:20px 22px; text-align:center; }
.lv-login .key{ font-size:2.2rem; }
.lv-login h2{ font-size:1.25rem; margin:6px 0 4px; max-width:none; }
.lv-login p{ font-size:12px; color:#444; margin-bottom:14px; }
.lv-login input{ width:100%; font-family:var(--ui); font-size:14px; background:#fff; box-shadow:var(--bevel-dn); border:0; padding:8px 9px; text-align:center; letter-spacing:.06em; }
.lv-err{ min-height:16px; margin-top:9px; font-size:12px; font-weight:bold; color:#c00; }
/* app */
.lv-app{ display:none; flex-direction:column; flex:1; min-height:0; }
.lv-toolbar{ display:flex; align-items:center; gap:8px; flex-wrap:wrap; padding:8px 10px; border-bottom:1px solid var(--silver-lo); box-shadow:0 1px 0 var(--white); }
.lv-toolbar .tb{ font-size:12px; font-weight:bold; padding:6px 12px; color:#000; background:var(--face); box-shadow:var(--bevel-up); cursor:pointer; }
.lv-toolbar .tb:active{ box-shadow:var(--bevel-dn); }
.lv-count{ font-size:12px; font-weight:bold; color:var(--navy); padding:5px 9px; box-shadow:var(--bevel-dn); background:#fff; }
.lv-grow{ flex:1; }
.lv-filter{ font-family:var(--ui); font-size:12px; background:#fff; box-shadow:var(--bevel-dn); border:0; padding:6px 8px; width:min(220px,42vw); }
.lv-list{ flex:1; min-height:0; overflow:auto; padding:12px; background:linear-gradient(180deg,#9a9a9a,#8a8a8a); }
.lv-empty{ text-align:center; color:#eee; padding:40px 10px; font-size:14px; }
.lv-card{ background:var(--face); box-shadow:var(--bevel-up); padding:12px 13px; margin-bottom:12px; }
.lv-card:last-child{ margin-bottom:0; }
.lv-head{ display:flex; align-items:baseline; gap:9px; flex-wrap:wrap; border-bottom:1px solid var(--silver-lo); box-shadow:0 1px 0 var(--white); padding-bottom:8px; margin-bottom:9px; }
.lv-head .nm{ font-family:var(--head); font-size:1.05rem; color:var(--navy); }
.lv-head .biz{ font-size:12.5px; font-weight:bold; color:#333; }
.lv-head .meta{ margin-left:auto; font-size:11px; color:#666; }
.lv-rate{ font-size:11px; font-weight:bold; padding:2px 8px; box-shadow:var(--bevel-dn); background:#fff; }
.lv-rate.hot{ background:#ffd5d5; color:#a00; } .lv-rate.warm{ background:#fff2cf; color:#7a5a00; } .lv-rate.cold{ background:#d7efd7; color:#0a5a0a; }
.lv-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px 18px; }
.lv-f{ font-size:12.5px; min-width:0; }
.lv-f.full{ grid-column:1 / -1; }
.lv-f label{ display:block; font-size:10.5px; font-weight:bold; color:#00006a; text-transform:uppercase; letter-spacing:.03em; }
.lv-f .v{ color:#161616; word-break:break-word; line-height:1.4; }
.lv-f .v a{ color:#0000c8; text-decoration:underline; }
.lv-f .v.fix{ background:#fffbe0; box-shadow:var(--bevel-dn); padding:5px 7px; margin-top:2px; }
.lv-f .muted{ color:#888; }
@media(max-width:640px){ .lv-grid{ grid-template-columns:1fr; } }

/* ===== long-form document pages (terms / privacy / refunds) =====
   The one-screen rule breaks here on purpose: policies are meant to be READ —
   the window body scrolls, and text is selectable so anyone can copy a line. */
.win-body.doc{ justify-content:flex-start; overflow-y:auto; user-select:text;
  padding:clamp(18px,3vw,40px) clamp(20px,4vw,54px); }
.doc-date{ margin-top:8px; font-size:11.5px; color:#555; }
.doc h3{ font-family:var(--head); font-weight:900; font-size:1.02rem; color:var(--navy); margin:24px 0 2px; }
.doc p, .doc li{ font-size:13px; color:#1c1c1c; line-height:1.6; max-width:74ch; }
.doc p{ margin-top:8px; }
.doc ul, .doc ol{ margin:8px 0 0 20px; }
.doc li{ margin-top:4px; }
.doc a{ color:#0000c8; text-decoration:underline; }
.doc a:hover{ color:#1084d0; }
.doc b{ color:#000; }
.doc .prices{ border-collapse:collapse; margin-top:12px; background:#fff; box-shadow:var(--bevel-dn); font-size:12.5px; }
.doc .prices th, .doc .prices td{ border:1px solid #cfcfcf; padding:5px 12px; text-align:left; }
.doc .prices th{ background:var(--face); font-size:11px; text-transform:uppercase; letter-spacing:.03em; color:#00006a; }
.doc .callout{ margin-top:12px; background:#fffbe0; box-shadow:var(--bevel-dn); padding:9px 12px; max-width:74ch; }

/* ===== taskbar ===== */
.taskbar{ position:fixed; left:0; right:0; bottom:0; height:34px; z-index:60; display:flex; align-items:center; gap:6px; padding:0 5px;
  background:var(--face); box-shadow:inset 0 1px 0 var(--white), inset 0 2px 0 var(--silver-hi); }
.start{ display:flex; align-items:center; gap:6px; font-weight:bold; font-size:13px; padding:4px 11px; color:#000; background:var(--face); box-shadow:var(--bevel-up); cursor:pointer; }
.start:active, .start.open{ box-shadow:var(--bevel-dn); }
.tasks{ display:flex; gap:5px; flex:1; padding-left:4px; }
.task{ font-size:12px; padding:4px 12px; color:#000; background:var(--face); box-shadow:var(--bevel-dn); max-width:230px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tray-btn{ font-size:12px; padding:4px 10px; color:#000; background:var(--face); box-shadow:var(--bevel-up); cursor:pointer; }
.tray-btn.on{ box-shadow:var(--bevel-dn); }
.clock{ font-size:12px; padding:4px 11px; box-shadow:var(--bevel-dn); }

/* start menu */
.startmenu{ position:fixed; left:5px; bottom:36px; z-index:65; width:230px; display:flex; padding:3px; background:var(--face); box-shadow:var(--bevel-up); }
.startmenu[hidden]{ display:none; }
.sm-side{ width:26px; background:linear-gradient(180deg,var(--navy),#4a4a8a); display:flex; align-items:flex-end; justify-content:center; padding-bottom:8px; }
.sm-side span{ writing-mode:vertical-rl; transform:rotate(180deg); color:#fff; font-weight:bold; letter-spacing:.16em; font-size:12px; }
.sm-items{ flex:1; padding:2px; }
.sm-item{ display:flex; align-items:center; gap:10px; padding:7px 9px; font-size:13px; color:#000; }
.sm-item span{ width:18px; text-align:center; }
.sm-item:hover{ background:var(--navy); color:#fff; }
.sm-rule{ height:1px; margin:3px 2px; background:var(--silver-lo); box-shadow:0 1px 0 var(--white); }

@media(prefers-reduced-motion:reduce){ *{ animation:none !important; } }
/* tiny screens: let it breathe rather than clip */
@media(max-height:560px), (max-width:480px){ html,body{ overflow:auto; } .win{ position:relative; top:0; bottom:auto; transform:none; margin:14px auto 52px; } }