azcomputerguru/claudetools
1
0
Fork 0
Code Issues 58 Pull Requests Actions Packages Projects Releases Wiki Activity

acg-website: educational expandable sub-index + radio number fix

Browse Source 
Sub-index expand (Opus): each service detail page's "What's included" list is now
a pretty accordion (extends the contact FAQ disclosure — rotating +/x, accent
rule, dark-band styling). Click an item to reveal a plain-English explanation
written for a non-technical business owner: define the term (patch, EDR, MFA,
SSL, vCIO, e911, porting...), why it matters in real terms, and a soft
"that's what a free consultation is for" nudge on ~1 item/page. All 41 items
rewritten; default-collapsed; keyboard + reduced-motion accessible.

Data fix: radio show call-in number corrected 520-790-2020 -> 520-790-2040
across all 14 pages (display + tel: links). Forum theme was already clean.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>
This commit is contained in:
Mike Swanson
2026-07-23 11:51:50 -07:00
parent e51469779a
commit c87ff8824a
17 changed files with 455 additions and 272 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
projects/acg-website/TODO.md
View File

@@ -20,6 +20,8 @@
- [x] **Real ACG logo integrated** — the power-button "G" mark faithfully vectorized (`v2/assets/acg-g-mark.svg`, geometry measured off the real logo) as the header icon + theme-adaptive SVG favicon on all 6 pages; Anton wordmark kept. Source wordmark logos (full-color/dark/white/header) saved to `v2/assets/brand/`. Mark recolored to the v2 palette (orange `#E24A12` + ink) vs the logo's original orange `#F58921` + navy `#244878` — 2-line swap if the original inks are wanted. - [x] **Real ACG logo integrated** — the power-button "G" mark faithfully vectorized (`v2/assets/acg-g-mark.svg`, geometry measured off the real logo) as the header icon + theme-adaptive SVG favicon on all 6 pages; Anton wordmark kept. Source wordmark logos (full-color/dark/white/header) saved to `v2/assets/brand/`. Mark recolored to the v2 palette (orange `#E24A12` + ink) vs the logo's original orange `#F58921` + navy `#244878` — 2-line swap if the original inks are wanted.
- [x] **Expandable "what's included" sub-index (Opus)** — each detail page's included-items list is a pretty accordion; clicking an item expands a plain-English, non-technical explanation of what it is + why it matters (educate the layperson), with a soft "that's what a free consultation is for" nudge (~1 item/page). Reuses the FAQ disclosure pattern; keyboard + reduced-motion accessible; all 41 items rewritten for a non-technical owner.
- [x] **Radio call-in number corrected** site-wide 520-790-2020 → **520-790-2040** (all 14 pages + tel: links; forum theme was clean).
- [x] **Service detail sub-pages (Opus)** — 8 per-service pages (`managed-it`, `backup-recovery`, `projects-block-time`, `cybersecurity`, `vcio-compliance`, `microsoft-365`, `business-phones`, `web-hosting`) in the v2 design language, straightforward-IT + warm/personal voice. Every index card (homepage THE INDEX + `services.html`) is now clickable through to its page. All 200, verified live. - [x] **Service detail sub-pages (Opus)** — 8 per-service pages (`managed-it`, `backup-recovery`, `projects-block-time`, `cybersecurity`, `vcio-compliance`, `microsoft-365`, `business-phones`, `web-hosting`) in the v2 design language, straightforward-IT + warm/personal voice. Every index card (homepage THE INDEX + `services.html`) is now clickable through to its page. All 200, verified live.
## In progress / next ## In progress / next

2
projects/acg-website/v2/about.html
View File

@@ -177,7 +177,7 @@
<span class="trust__tag mono" aria-hidden="true">AIR.02</span> <span class="trust__tag mono" aria-hidden="true">AIR.02</span>
</div> </div>
<div class="onair-cell"> <div class="onair-cell">
<div class="trust__num trust__num--dial">520-790-2020</div> <div class="trust__num trust__num--dial">520-790-2040</div>
<div class="trust__label">Call in live with any tech question</div> <div class="trust__label">Call in live with any tech question</div>
<span class="trust__tag mono" aria-hidden="true">AIR.03</span> <span class="trust__tag mono" aria-hidden="true">AIR.03</span>
</div> </div>

74
projects/acg-website/v2/backup-recovery.html
View File

@@ -110,42 +110,56 @@
<p class="kicker mono">What's included / the concrete list</p> <p class="kicker mono">What's included / the concrete list</p>
</div> </div>
<h2 id="inc-h" class="band-title reveal">Copies you can count on.</h2> <h2 id="inc-h" class="band-title reveal">Copies you can count on.</h2>
<div class="svc-index"> <div class="svc-index svc-index--fold">
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">01</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">01</span>
<h3 class="svc__name">Tested restores</h3> <span class="svc__name">Tested restores</span>
<p class="svc__desc">We verify recoveries on a schedule, not just that a backup ran. When you need the data back, we already know it comes back.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">A backup is only useful if the data actually comes back when you need it, and plenty of businesses find out too late that theirs never really worked. We regularly test restoring your files, not just check that a backup ran, so on the day it matters we already know the recovery works.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">02</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">02</span>
<h3 class="svc__name">Offsite copies</h3> <span class="svc__name">Offsite copies</span>
<p class="svc__desc">Your data lives in more than one location, so a single fire, flood, or stolen server never takes the whole business with it.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">We keep copies of your data in more than one place, including somewhere other than your office. That way a single fire, flood, theft, or failed server cannot wipe out your only copy and take the business down with it.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">03</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">03</span>
<h3 class="svc__name">Local and cloud</h3> <span class="svc__name">Local and cloud</span>
<p class="svc__desc">Fast local restores for the everyday oops, cloud copies for the real disasters. You get speed and safety, not one or the other.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">We keep a copy on-site for the everyday problems, like a deleted file you need back in five minutes, and a copy in the cloud for the real disasters. You get fast recoveries for small mistakes and a safety net for the big ones, instead of having to pick one.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">04</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">04</span>
<h3 class="svc__name">Ransomware rollback</h3> <span class="svc__name">Ransomware rollback</span>
<p class="svc__desc">When something encrypts a machine, we roll it back to a clean point in time instead of negotiating with a stranger.</p> <span class="svc__tail"><span class="svc__meta mono">GPS-Advanced</span><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__meta mono">GPS-Advanced</div> <div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">Ransomware is a type of attack that locks up your files and demands payment to unlock them. Instead of negotiating with a stranger, we roll the affected machines back to a clean copy from just before the attack, so you get your data back without paying a ransom. If you are not sure whether your current backups could actually do that, it is worth a conversation.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">05</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">05</span>
<h3 class="svc__name">A written recovery plan</h3> <span class="svc__name">A written recovery plan</span>
<p class="svc__desc">Everyone knows what gets restored first and roughly how long it takes, decided calmly ahead of time, not invented during the emergency.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">We decide ahead of time, in writing, what gets restored first and roughly how long it takes, worked out calmly in advance rather than invented in the middle of a crisis. When something does go wrong, everyone already knows the plan instead of guessing under pressure.</p>
</div></div>
</article> </article>
</div> </div>
<p class="band-punch reveal">We would rather prove a restore on a quiet Tuesday than promise one on the worst day of your year.</p> <p class="band-punch reveal">We would rather prove a restore on a quiet Tuesday than promise one on the worst day of your year.</p>
@@ -234,13 +248,13 @@
<aside class="ticker" aria-label="The Computer Guru Show radio information"> <aside class="ticker" aria-label="The Computer Guru Show radio information">
<div class="ticker__track" aria-hidden="true"> <div class="ticker__track" aria-hidden="true">
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
</div> </div>
<p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2020. Tucson's trusted tech talk since 2001.</p> <p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2040. Tucson's trusted tech talk since 2001.</p>
</aside> </aside>
</main> </main>

73
projects/acg-website/v2/business-phones.html
View File

@@ -110,41 +110,56 @@
<p class="kicker mono">What's included / the concrete list</p> <p class="kicker mono">What's included / the concrete list</p>
</div> </div>
<h2 id="inc-h" class="band-title reveal">A phone system that keeps up.</h2> <h2 id="inc-h" class="band-title reveal">A phone system that keeps up.</h2>
<div class="svc-index"> <div class="svc-index svc-index--fold">
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">01</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">01</span>
<h3 class="svc__name">Desk, desktop, and mobile</h3> <span class="svc__name">Desk, desktop, and mobile</span>
<p class="svc__desc">The same number rings your desk phone, your computer, and your cell. Work from the office, the couch, or the truck on one line.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">Your business number rings on your desk phone, your computer, and your cell phone, all at once. You can take and make calls from the office, home, or the road on the same line, and callers only ever see your one business number.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">02</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">02</span>
<h3 class="svc__name">Auto-attendants and ring groups</h3> <span class="svc__name">Auto-attendants and ring groups</span>
<p class="svc__desc">"Press one for sales" and "ring the whole front desk" set up the way your business actually answers the phone.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">An auto-attendant is the friendly menu that greets callers and points them to the right place, like "press one for sales." A ring group rings several people at once, such as the whole front desk, so calls actually get answered. We set both up around how your business really handles the phone.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">03</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">03</span>
<h3 class="svc__name">Free number porting</h3> <span class="svc__name">Free number porting</span>
<p class="svc__desc">Keep the number your customers have called for years. For managed clients, moving it over is on us.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">Porting means moving your existing phone number over to the new system, so you keep the number your customers have called for years. For managed clients we handle the move at no charge, and nothing changes on your cards, signs, or online listings.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">04</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">04</span>
<h3 class="svc__name">Unlimited US calling</h3> <span class="svc__name">Unlimited US calling</span>
<p class="svc__desc">A flat rate per user with no metering, so a busy month does not turn into a scary invoice.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">You pay one flat rate per person with no per-minute charges on calls within the US. A busy month full of calls costs the same as a quiet one, so the bill stays predictable and there are no surprises to explain later.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">05</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">05</span>
<h3 class="svc__name">e911 and call recording</h3> <span class="svc__name">e911 and call recording</span>
<p class="svc__desc">Emergency location handled correctly, and a call record where you need one, included on the tiers that call for it.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">e911 makes sure that if someone dials 911, emergency responders get your correct address, which internet phones have to be set up carefully to do. Call recording keeps a record of calls where you need one, and both come included on the plans that call for them.</p>
</div></div>
</article> </article>
</div> </div>
<p class="band-punch reveal">The number your customers know does not change. Everything behind it just gets better.</p> <p class="band-punch reveal">The number your customers know does not change. Everything behind it just gets better.</p>
@@ -234,13 +249,13 @@
<aside class="ticker" aria-label="The Computer Guru Show radio information"> <aside class="ticker" aria-label="The Computer Guru Show radio information">
<div class="ticker__track" aria-hidden="true"> <div class="ticker__track" aria-hidden="true">
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
</div> </div>
<p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2020. Tucson's trusted tech talk since 2001.</p> <p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2040. Tucson's trusted tech talk since 2001.</p>
</aside> </aside>
</main> </main>

6
projects/acg-website/v2/calculator.html
View File

@@ -157,13 +157,13 @@
<aside class="ticker" aria-label="The Computer Guru Show radio information"> <aside class="ticker" aria-label="The Computer Guru Show radio information">
<div class="ticker__track" aria-hidden="true"> <div class="ticker__track" aria-hidden="true">
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
</div> </div>
<p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2020. Tucson's trusted tech talk since 2001.</p> <p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2040. Tucson's trusted tech talk since 2001.</p>
</aside> </aside>
</main> </main>

8
projects/acg-website/v2/contact.html
View File

@@ -87,7 +87,7 @@
<div><span class="k">Office</span><span class="v">7437 E. 22nd St, Tucson, AZ 85710</span></div> <div><span class="k">Office</span><span class="v">7437 E. 22nd St, Tucson, AZ 85710</span></div>
<div><span class="k">Hours</span><span class="v">Mon&ndash;Fri 9&ndash;5 / 24/7 emergency for Priority clients</span></div> <div><span class="k">Hours</span><span class="v">Mon&ndash;Fri 9&ndash;5 / 24/7 emergency for Priority clients</span></div>
<div><span class="k">On the radio</span><span class="v">The Computer Guru Show / Sat 9AM / KVOI 1030AM</span></div> <div><span class="k">On the radio</span><span class="v">The Computer Guru Show / Sat 9AM / KVOI 1030AM</span></div>
<div><span class="k">Call the show</span><a class="v" href="tel:+15207902020">520-790-2020</a></div> <div><span class="k">Call the show</span><a class="v" href="tel:+15207902040">520-790-2040</a></div>
</div> </div>
<figure class="story__figure frame frame--duo reveal" style="margin-top:2.4rem;"> <figure class="story__figure frame frame--duo reveal" style="margin-top:2.4rem;">
<img src="assets/story.png" width="1248" height="832" alt="Warm afternoon desert light raking across a white stucco wall meeting a clean wooden windowsill." loading="lazy" /> <img src="assets/story.png" width="1248" height="832" alt="Warm afternoon desert light raking across a white stucco wall meeting a clean wooden windowsill." loading="lazy" />
@@ -125,13 +125,13 @@
<aside class="ticker" aria-label="The Computer Guru Show radio information"> <aside class="ticker" aria-label="The Computer Guru Show radio information">
<div class="ticker__track" aria-hidden="true"> <div class="ticker__track" aria-hidden="true">
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
</div> </div>
<p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2020. Tucson's trusted tech talk since 2001.</p> <p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2040. Tucson's trusted tech talk since 2001.</p>
</aside> </aside>
<!-- ============ FAQ ============ --> <!-- ============ FAQ ============ -->

49
projects/acg-website/v2/css/v2.css
View File

@@ -565,6 +565,55 @@ html:not(.js) .city-word--final .city-word__t::after { transform: scaleX(1); }
.svc__meta { grid-column: 2; text-align: left; } .svc__meta { grid-column: 2; text-align: left; }
} }
/* Accordion variant of the numbered ledger: the service-detail "What's
included" list. Same disclosure pattern as the FAQ (a button toggles the
max-height of the panel that immediately follows it, aria-expanded drives a
rotating +), adapted to the dark band. Collapse is gated on html.js so the
descriptions stay readable with JS off, and reduced motion falls back to an
instant open/close via the global reduced-motion rule. */
.svc-index--fold .svc {
display: block;
padding-block: 0;
transition: border-color var(--t-med) var(--ease-out);
}
.svc-index--fold .svc:hover { background: none; }
.svc-index--fold .svc:has(.svc__q[aria-expanded="true"]) { border-bottom-color: var(--band-accent); }
.svc__q {
width: 100%;
display: grid;
grid-template-columns: 4.5rem 1fr auto;
gap: 1.4rem;
align-items: baseline;
padding: 1.15rem 0;
background: none; border: 0;
text-align: left; cursor: pointer;
color: inherit; font: inherit;
transition: background var(--t-med) var(--ease-out);
}
.svc__q:hover { background: color-mix(in srgb, var(--band-ink) 5%, transparent); }
.svc__q:hover .svc__name { color: var(--band-accent-ink); }
.svc__q:focus-visible { outline: 3px solid var(--band-accent); outline-offset: -3px; }
.svc__tail { display: inline-flex; align-items: baseline; gap: 1.1rem; white-space: nowrap; }
.svc__tail .svc__meta { font-size: 0.82rem; }
.svc__q .pm {
font-family: var(--f-mono); font-size: 1.4rem; line-height: 1;
color: var(--band-accent-ink); flex-shrink: 0;
transition: transform var(--t-med) var(--ease-out);
}
.svc__q[aria-expanded="true"] .pm { transform: rotate(45deg); }
.svc__panel { overflow: hidden; }
html.js .svc__panel {
max-height: 0; opacity: 0;
transition: max-height 0.32s var(--ease-out), opacity 0.26s var(--ease-out);
}
.svc__q[aria-expanded="true"] + .svc__panel { opacity: 1; }
.svc__panel-inner { padding: 0 2.5rem 1.4rem calc(4.5rem + 1.4rem); }
.svc__panel-inner .svc__desc { margin-top: 0; max-width: 62ch; }
@media (max-width: 680px) {
.svc-index--fold .svc__q { grid-template-columns: 2.6rem 1fr auto; gap: 1rem; }
.svc__panel-inner { padding-left: calc(2.6rem + 1rem); }
}
/* ---- Pricing -------------------------------------------------------------- */ /* ---- Pricing -------------------------------------------------------------- */
.pricing { .pricing {
padding-block: clamp(4.5rem, 9vw, 8rem) clamp(3.5rem, 7vw, 6.5rem); padding-block: clamp(4.5rem, 9vw, 8rem) clamp(3.5rem, 7vw, 6.5rem);

73
projects/acg-website/v2/cybersecurity.html
View File

@@ -110,41 +110,56 @@
<p class="kicker mono">What's included / the concrete list</p> <p class="kicker mono">What's included / the concrete list</p>
</div> </div>
<h2 id="inc-h" class="band-title reveal">Layers that actually stack.</h2> <h2 id="inc-h" class="band-title reveal">Layers that actually stack.</h2>
<div class="svc-index"> <div class="svc-index svc-index--fold">
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">01</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">01</span>
<h3 class="svc__name">Advanced EDR</h3> <span class="svc__name">Advanced EDR</span>
<p class="svc__desc">Behavior-based detection that catches the attack antivirus misses, and can isolate a machine before whatever is on it spreads.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">EDR stands for endpoint detection and response, a smarter layer of protection that watches how programs behave rather than just matching known viruses. If something starts acting like an attack, it can catch it and cut that machine off from the rest of your network before the problem spreads.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">02</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">02</span>
<h3 class="svc__name">Email security</h3> <span class="svc__name">Email security</span>
<p class="svc__desc">The front door for most attacks. We filter it hard and flag the wire-transfer request that looks just a little too much like your boss.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">Most attacks arrive by email, often a message dressed up to look like your bank, a vendor, or even your own boss asking for a payment. We filter your email hard to keep the dangerous ones out, and flag the ones trying to trick someone into wiring money or handing over a password.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">03</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">03</span>
<h3 class="svc__name">Dark-web monitoring</h3> <span class="svc__name">Dark-web monitoring</span>
<p class="svc__desc">We watch for your company credentials turning up in breaches, so a leaked password is a heads-up to you instead of a way in for someone else.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">When another company gets hacked, stolen passwords often end up for sale in the hidden corners of the internet. We watch for your company's logins showing up in those leaks, so an exposed password becomes an early warning to you instead of an open door for someone else.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">04</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">04</span>
<h3 class="svc__name">Security-awareness training</h3> <span class="svc__name">Security-awareness training</span>
<p class="svc__desc">Short, regular training so your team learns to spot the phish and hesitate before the click. The cheapest security you can buy.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">Short, regular lessons that help your team recognize scam emails and think twice before clicking. Your people are who attackers actually target, so teaching them what to watch for is some of the cheapest and most effective protection you can put in place.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">05</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">05</span>
<h3 class="svc__name">MFA and hardening</h3> <span class="svc__name">MFA and hardening</span>
<p class="svc__desc">The unglamorous settings that stop most attacks cold, turned on across your accounts and kept on.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">MFA, or multi-factor authentication, is the second step, like a one-time code from your phone, that stops a stolen password on its own from getting anyone in. Hardening just means turning on the safer settings across your accounts and systems. Together they quietly block the large majority of attacks. If you are not certain what is switched on today, a consultation is a good place to start.</p>
</div></div>
</article> </article>
</div> </div>
<p class="band-punch reveal">Most breaches walk through an unlocked door. Our job is to quietly lock the doors and keep them locked.</p> <p class="band-punch reveal">Most breaches walk through an unlocked door. Our job is to quietly lock the doors and keep them locked.</p>
@@ -233,13 +248,13 @@
<aside class="ticker" aria-label="The Computer Guru Show radio information"> <aside class="ticker" aria-label="The Computer Guru Show radio information">
<div class="ticker__track" aria-hidden="true"> <div class="ticker__track" aria-hidden="true">
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
</div> </div>
<p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2020. Tucson's trusted tech talk since 2001.</p> <p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2040. Tucson's trusted tech talk since 2001.</p>
</aside> </aside>
</main> </main>

6
projects/acg-website/v2/index.html
View File

@@ -109,13 +109,13 @@
<aside class="ticker" aria-label="The Computer Guru Show radio information"> <aside class="ticker" aria-label="The Computer Guru Show radio information">
<div class="ticker__track" aria-hidden="true"> <div class="ticker__track" aria-hidden="true">
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
</div> </div>
<p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2020. Tucson's trusted tech talk since 2001.</p> <p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2040. Tucson's trusted tech talk since 2001.</p>
</aside> </aside>
<!-- ============ TRUST STATS ============ --> <!-- ============ TRUST STATS ============ -->

44
projects/acg-website/v2/js/v2.js
View File

@@ -121,25 +121,35 @@
document.addEventListener("keydown", function (e) { if (e.key === "Escape") closeNav(); }); document.addEventListener("keydown", function (e) { if (e.key === "Escape") closeNav(); });
} }
/* ---- FAQ accordion (contact.html) --------------------------------------- */ /* ---- Disclosure accordions --------------------------------------------- */
$$(".faq__q").forEach(function (q, i) { /* One pattern, two placements: the FAQ (contact.html) and the "What's
var panel = q.nextElementSibling; included" ledger on each service page. A button toggles the max-height of
var inner = panel ? panel.firstElementChild : null; the panel that immediately follows it; aria-expanded rotates the +. Enter
if (panel) { and Space come free with the native <button>. */
var pid = "faq-a-" + (i + 1), qid = "faq-q-" + (i + 1); function initAccordion(btnSel, prefix) {
panel.id = pid; q.id = qid; $$(btnSel).forEach(function (q, i) {
panel.setAttribute("role", "region"); var panel = q.nextElementSibling;
panel.setAttribute("aria-labelledby", qid); var inner = panel ? panel.firstElementChild : null;
q.setAttribute("aria-controls", pid); if (panel) {
} var pid = prefix + "-a-" + (i + 1);
q.addEventListener("click", function () { panel.id = pid;
var open = q.getAttribute("aria-expanded") === "true"; if (!q.id) q.id = prefix + "-q-" + (i + 1);
q.setAttribute("aria-expanded", String(!open)); panel.setAttribute("role", "region");
if (panel && inner) panel.style.maxHeight = open ? "0px" : (inner.scrollHeight + 8) + "px"; panel.setAttribute("aria-labelledby", q.id);
q.setAttribute("aria-controls", pid);
}
q.addEventListener("click", function () {
var open = q.getAttribute("aria-expanded") === "true";
q.setAttribute("aria-expanded", String(!open));
if (panel && inner) panel.style.maxHeight = open ? "0px" : (inner.scrollHeight + 8) + "px";
});
}); });
}); }
initAccordion(".faq__q", "faq");
initAccordion(".svc__q", "svc");
/* Keep an open panel sized correctly when the viewport reflows. */
window.addEventListener("resize", function () { window.addEventListener("resize", function () {
$$('.faq__q[aria-expanded="true"]').forEach(function (q) { $$('.faq__q[aria-expanded="true"], .svc__q[aria-expanded="true"]').forEach(function (q) {
var panel = q.nextElementSibling, inner = panel ? panel.firstElementChild : null; var panel = q.nextElementSibling, inner = panel ? panel.firstElementChild : null;
if (panel && inner) panel.style.maxHeight = (inner.scrollHeight + 8) + "px"; if (panel && inner) panel.style.maxHeight = (inner.scrollHeight + 8) + "px";
}); });

86
projects/acg-website/v2/managed-it.html
View File

@@ -110,48 +110,66 @@
<p class="kicker mono">What's included / the concrete list</p> <p class="kicker mono">What's included / the concrete list</p>
</div> </div>
<h2 id="inc-h" class="band-title reveal">Everything under the hood.</h2> <h2 id="inc-h" class="band-title reveal">Everything under the hood.</h2>
<div class="svc-index"> <div class="svc-index svc-index--fold">
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">01</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">01</span>
<h3 class="svc__name">24/7 monitoring</h3> <span class="svc__name">24/7 monitoring</span>
<p class="svc__desc">Every server, workstation, and critical device watched around the clock. Alerts reach us before they reach you.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">Monitoring means we keep an eye on every computer, server, and important device for you, day and night, using software that watches how they are running. When a hard drive starts to fail or something stops working, we get the alert and start on it, often before you have noticed anything is wrong.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">02</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">02</span>
<h3 class="svc__name">Automated patching</h3> <span class="svc__name">Automated patching</span>
<p class="svc__desc">Operating systems and core software kept current on a schedule, so the holes attackers use get closed before anyone can reach them.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">A patch is a small update that software makers release to fix bugs and close security holes. We install those updates for you on a regular schedule, so the weaknesses attackers look for get sealed up quickly instead of sitting open for months on a machine nobody got around to updating.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">03</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">03</span>
<h3 class="svc__name">A help desk that knows you</h3> <span class="svc__name">A help desk that knows you</span>
<p class="svc__desc">Call, email, or remote in and reach a Tucson tech who already has your setup documented. No re-explaining your network every single time.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">When something goes wrong you call, email, or let us connect in remotely, and you reach a real Tucson technician who already has your setup written down. No phone tree, no starting over, and no explaining your network again every time you need a hand.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">04</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">04</span>
<h3 class="svc__name">Managed antivirus</h3> <span class="svc__name">Managed antivirus</span>
<p class="svc__desc">Business-grade protection installed, updated, and watched on every endpoint. Not the free tool that shipped with the machine.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">Antivirus is the software that catches and blocks malicious programs before they can do damage. We install a business-grade version on every machine, keep it updated, and actually watch its alerts, rather than leaving you with the free tool that came with the computer and hoping someone notices when it flags something.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">05</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">05</span>
<h3 class="svc__name">Monthly health reports</h3> <span class="svc__name">Monthly health reports</span>
<p class="svc__desc">A plain-English summary of what we watched, what we patched, and what we fixed before it could become your problem.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">Once a month you get a short, plain-English summary of what we watched, what we updated, and what we quietly fixed before it could turn into your problem. It is an easy way to see exactly what you are paying for without needing to be technical.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">06</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">06</span>
<h3 class="svc__name">Onsite when it counts</h3> <span class="svc__name">Onsite when it counts</span>
<p class="svc__desc">Remote for the fast stuff, boots on the ground for the rest. Local clients typically see us within an hour or two.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">Most issues we solve remotely in minutes. When something genuinely needs hands on the hardware, a local technician comes to you, and for Tucson clients that is usually within an hour or two. If you are weighing whether an IT company can really cover you in person, a quick consultation is the easiest way to get a straight answer.</p>
</div></div>
</article> </article>
</div> </div>
<p class="band-punch reveal">You pay per endpoint, so the bill follows your actual headcount. Add a person, add an endpoint. Downsize, and it drops the next month.</p> <p class="band-punch reveal">You pay per endpoint, so the bill follows your actual headcount. Add a person, add an endpoint. Downsize, and it drops the next month.</p>
@@ -240,13 +258,13 @@
<aside class="ticker" aria-label="The Computer Guru Show radio information"> <aside class="ticker" aria-label="The Computer Guru Show radio information">
<div class="ticker__track" aria-hidden="true"> <div class="ticker__track" aria-hidden="true">
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
</div> </div>
<p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2020. Tucson's trusted tech talk since 2001.</p> <p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2040. Tucson's trusted tech talk since 2001.</p>
</aside> </aside>
</main> </main>

73
projects/acg-website/v2/microsoft-365.html
View File

@@ -110,41 +110,56 @@
<p class="kicker mono">What's included / the concrete list</p> <p class="kicker mono">What's included / the concrete list</p>
</div> </div>
<h2 id="inc-h" class="band-title reveal">Set up the way it should be.</h2> <h2 id="inc-h" class="band-title reveal">Set up the way it should be.</h2>
<div class="svc-index"> <div class="svc-index svc-index--fold">
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">01</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">01</span>
<h3 class="svc__name">Migrations</h3> <span class="svc__name">Migrations</span>
<p class="svc__desc">Moved off an old host or another provider with the mail, contacts, and calendars intact, and almost no downtime for your team.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">Switching email or file systems sounds risky, and done badly it means lost messages and downtime. We move you off your old host or provider with your mail, contacts, and calendars intact and almost no interruption, so your team barely notices the change happened.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">02</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">02</span>
<h3 class="svc__name">The right license</h3> <span class="svc__name">The right license</span>
<p class="svc__desc">Basic, Standard, or Premium, matched to what your team actually uses instead of whichever bundle is biggest.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">Microsoft 365 comes in several plans, and it is easy to overpay for features you never touch or come up short on the ones you need. We match you to the plan that fits how your team actually works, rather than defaulting to the biggest bundle.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">03</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">03</span>
<h3 class="svc__name">Hosted email option</h3> <span class="svc__name">Hosted email option</span>
<p class="svc__desc">If you do not need the full Microsoft suite, straightforward IMAP or POP email starting at $2 a mailbox, priced by storage.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">If you do not need the full Microsoft suite, we also offer straightforward business email on its own, starting at $2 a mailbox and priced by how much storage you use. It is a clean, affordable option when all you really want is reliable email. Not sure which route fits you? That is an easy call to make together.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">04</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">04</span>
<h3 class="svc__name">Security from day one</h3> <span class="svc__name">Security from day one</span>
<p class="svc__desc">MFA, safe-sender rules, and email filtering configured up front, not bolted on after something goes wrong.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">We turn on the important protections when your email is first set up, not after something goes wrong. That includes MFA (a second login step beyond your password), sensible spam and phishing filtering, and rules that make it harder for a scammer to slip in or impersonate your company.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">05</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">05</span>
<h3 class="svc__name">A human on support</h3> <span class="svc__name">A human on support</span>
<p class="svc__desc">Locked out, a bad autocomplete, an inbox rule gone sideways. You call a person who can fix it, not a chatbot that cannot.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">Locked out, a message that will not send, an inbox rule quietly filing mail in the wrong place. You call a real person who can get into it and fix it, instead of a chatbot or a support queue that sends you in circles.</p>
</div></div>
</article> </article>
</div> </div>
<p class="band-punch reveal">We match you to the license you need, not the one with the best margin. Fewer surprises on the bill and in the inbox.</p> <p class="band-punch reveal">We match you to the license you need, not the one with the best margin. Fewer surprises on the bill and in the inbox.</p>
@@ -234,13 +249,13 @@
<aside class="ticker" aria-label="The Computer Guru Show radio information"> <aside class="ticker" aria-label="The Computer Guru Show radio information">
<div class="ticker__track" aria-hidden="true"> <div class="ticker__track" aria-hidden="true">
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
</div> </div>
<p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2020. Tucson's trusted tech talk since 2001.</p> <p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2040. Tucson's trusted tech talk since 2001.</p>
</aside> </aside>
</main> </main>

6
projects/acg-website/v2/pricing.html
View File

@@ -250,13 +250,13 @@
<aside class="ticker" aria-label="The Computer Guru Show radio information"> <aside class="ticker" aria-label="The Computer Guru Show radio information">
<div class="ticker__track" aria-hidden="true"> <div class="ticker__track" aria-hidden="true">
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
</div> </div>
<p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2020. Tucson's trusted tech talk since 2001.</p> <p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2040. Tucson's trusted tech talk since 2001.</p>
</aside> </aside>
</main> </main>

73
projects/acg-website/v2/projects-block-time.html
View File

@@ -110,41 +110,56 @@
<p class="kicker mono">What we do / the concrete list</p> <p class="kicker mono">What we do / the concrete list</p>
</div> </div>
<h2 id="inc-h" class="band-title reveal">The work, scoped and named.</h2> <h2 id="inc-h" class="band-title reveal">The work, scoped and named.</h2>
<div class="svc-index"> <div class="svc-index svc-index--fold">
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">01</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">01</span>
<h3 class="svc__name">Migrations</h3> <span class="svc__name">Migrations</span>
<p class="svc__desc">Email, servers, files, or a whole office moved with a plan and a rollback, usually after hours so nobody loses a working day.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">A migration is moving your technology from one place to another: email to a new system, files to a new server, or a whole office to a new setup. We plan it out, do the heavy lifting after hours where we can, and keep a way to undo it, so your team rarely loses a working day.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">02</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">02</span>
<h3 class="svc__name">Network buildouts</h3> <span class="svc__name">Network buildouts</span>
<p class="svc__desc">Cabling, switches, firewalls, and Wi-Fi that actually reaches the back office and the warehouse, not just the front desk.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">Your network is the cabling, switches, firewall, and Wi-Fi that connect everything and get you online. We design and install it so the connection is solid everywhere you work, not just strong at the front desk and useless in the back office or the warehouse.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">03</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">03</span>
<h3 class="svc__name">New-office setups</h3> <span class="svc__name">New-office setups</span>
<p class="svc__desc">From an empty suite to a working office: internet, phones, workstations, printers, and the network that ties it together.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">Opening or moving to a new space, we take it from an empty suite to a working office: internet, phones, computers, printers, and the network that ties them together. You walk in on day one ready to do business instead of waiting on installers.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">04</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">04</span>
<h3 class="svc__name">Hardware and rollouts</h3> <span class="svc__name">Hardware and rollouts</span>
<p class="svc__desc">Specced, ordered, imaged, and deployed. New machines that show up ready to work instead of ready to configure.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">When you need new computers or equipment, we pick the right gear, order it, set it up, and hand it over ready to use. Your team gets machines that already have the right software and settings, instead of spending their first day configuring them.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">05</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">05</span>
<h3 class="svc__name">Block time</h3> <span class="svc__name">Block time</span>
<p class="svc__desc">Pre-paid hours banked at a better rate and drawn down whenever you need them. No expiry, no use-it-or-lose-it.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">Block time is a bank of support hours you pay for up front at a better rate and use whenever you need them. The hours never expire, so it is a simple way to keep expert help on tap without a monthly contract. Not sure how many hours you would actually use? That is an easy thing to size up together.</p>
</div></div>
</article> </article>
</div> </div>
<p class="band-punch reveal">A fixed scope and a real number, every time. If it is not on the estimate, we will quote it before we do it.</p> <p class="band-punch reveal">A fixed scope and a real number, every time. If it is not on the estimate, we will quote it before we do it.</p>
@@ -233,13 +248,13 @@
<aside class="ticker" aria-label="The Computer Guru Show radio information"> <aside class="ticker" aria-label="The Computer Guru Show radio information">
<div class="ticker__track" aria-hidden="true"> <div class="ticker__track" aria-hidden="true">
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
</div> </div>
<p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2020. Tucson's trusted tech talk since 2001.</p> <p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2040. Tucson's trusted tech talk since 2001.</p>
</aside> </aside>
</main> </main>

6
projects/acg-website/v2/services.html
View File

@@ -193,13 +193,13 @@
<aside class="ticker" aria-label="The Computer Guru Show radio information"> <aside class="ticker" aria-label="The Computer Guru Show radio information">
<div class="ticker__track" aria-hidden="true"> <div class="ticker__track" aria-hidden="true">
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
</div> </div>
<p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2020. Tucson's trusted tech talk since 2001.</p> <p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2040. Tucson's trusted tech talk since 2001.</p>
</aside> </aside>
</main> </main>

73
projects/acg-website/v2/vcio-compliance.html
View File

@@ -110,41 +110,56 @@
<p class="kicker mono">What's included / the concrete list</p> <p class="kicker mono">What's included / the concrete list</p>
</div> </div>
<h2 id="inc-h" class="band-title reveal">Strategy you can actually use.</h2> <h2 id="inc-h" class="band-title reveal">Strategy you can actually use.</h2>
<div class="svc-index"> <div class="svc-index svc-index--fold">
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">01</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">01</span>
<h3 class="svc__name">Strategy and budgeting</h3> <span class="svc__name">Strategy and budgeting</span>
<p class="svc__desc">A roadmap for the next year and the next three, so IT spend is planned on purpose instead of reacting to whatever broke.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">A vCIO is a virtual chief information officer, meaning you get the kind of technology planning a large company gets from a full-time executive, without having to hire one. We map out where your IT is going over the next year and the next few, so spending is planned on purpose instead of a scramble every time something breaks.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">02</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">02</span>
<h3 class="svc__name">Cyber-insurance readiness</h3> <span class="svc__name">Cyber-insurance readiness</span>
<p class="svc__desc">We help you answer the questionnaire truthfully and turn on what it requires: MFA, EDR, training, and documented backups.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">Cyber insurance helps cover you if you are hacked, but insurers now require certain protections to be in place before they will pay, and the application asks about them in detail. We help you answer honestly and turn on what they require, like MFA, EDR, training, and documented backups, so a claim is not denied on a technicality.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">03</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">03</span>
<h3 class="svc__name">Compliance support</h3> <span class="svc__name">Compliance support</span>
<p class="svc__desc">HIPAA, SOC, and the common frameworks. The controls, the documentation, and the evidence, prepared the way an auditor wants to see it.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">If your industry has rules like HIPAA for healthcare or SOC for handling client data, we set up the required protections, write the documentation, and gather the evidence an auditor expects to see. If you are unsure which rules even apply to your business, that is a common and completely fair question for a consultation.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">04</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">04</span>
<h3 class="svc__name">Quarterly business reviews</h3> <span class="svc__name">Quarterly business reviews</span>
<p class="svc__desc">We sit down, look at what actually happened, and plan what is next. In person, in plain English, with the numbers on the table.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">Every few months we sit down with you, review what actually happened with your technology, and plan what is next. It is in person and in plain English, with the real numbers on the table, so you are never guessing where your IT money is going.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">05</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">05</span>
<h3 class="svc__name">A dedicated account manager</h3> <span class="svc__name">A dedicated account manager</span>
<p class="svc__desc">One person who knows your business and owns the relationship, so you are never explaining yourself to a stranger.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">One person who knows your business and owns the relationship, so you are not re-explaining yourself to a stranger every time you call. You have a name and a direct line to someone who already understands your setup and your goals.</p>
</div></div>
</article> </article>
</div> </div>
<p class="band-punch reveal">The goal is simple: when your insurer or your auditor asks a hard question, you already have the answer and the proof.</p> <p class="band-punch reveal">The goal is simple: when your insurer or your auditor asks a hard question, you already have the answer and the proof.</p>
@@ -232,13 +247,13 @@
<aside class="ticker" aria-label="The Computer Guru Show radio information"> <aside class="ticker" aria-label="The Computer Guru Show radio information">
<div class="ticker__track" aria-hidden="true"> <div class="ticker__track" aria-hidden="true">
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
</div> </div>
<p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2020. Tucson's trusted tech talk since 2001.</p> <p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2040. Tucson's trusted tech talk since 2001.</p>
</aside> </aside>
</main> </main>

73
projects/acg-website/v2/web-hosting.html
View File

@@ -110,41 +110,56 @@
<p class="kicker mono">What's included / the concrete list</p> <p class="kicker mono">What's included / the concrete list</p>
</div> </div>
<h2 id="inc-h" class="band-title reveal">The unglamorous parts, done.</h2> <h2 id="inc-h" class="band-title reveal">The unglamorous parts, done.</h2>
<div class="svc-index"> <div class="svc-index svc-index--fold">
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">01</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">01</span>
<h3 class="svc__name">Free SSL</h3> <span class="svc__name">Free SSL</span>
<p class="svc__desc">The padlock in the address bar, renewed automatically, so your visitors never hit a scary security warning.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">SSL is what puts the little padlock next to your web address and scrambles the connection so information cannot be snooped on in transit. We set it up and renew it automatically, so visitors never hit the "not secure" warning that sends them straight back to their search results.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">02</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">02</span>
<h3 class="svc__name">Daily backups</h3> <span class="svc__name">Daily backups</span>
<p class="svc__desc">Your site copied every day, so a bad plugin update or a broken edit is an undo, not a weekend rebuild.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">We save a full copy of your website every day. If an update breaks the site or an edit goes wrong, getting back to a working version is a quick restore instead of a weekend spent rebuilding from scratch.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">03</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">03</span>
<h3 class="svc__name">Managed updates</h3> <span class="svc__name">Managed updates</span>
<p class="svc__desc">The server kept patched and healthy, so you think about your business instead of your web host.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">The software that runs your website's server needs regular patching to stay secure and stable, and we handle all of it for you. You get to think about your business while we quietly keep the plumbing healthy underneath it.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">04</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">04</span>
<h3 class="svc__name">Real support</h3> <span class="svc__name">Real support</span>
<p class="svc__desc">A person who can look at your actual site and help, not a canned reply from a queue three time zones away.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">When you need help, you reach a person who can look at your actual site and sort it out, not a canned reply from a queue three time zones away. If you are frustrated with a host that never really answers, that is worth a quick conversation.</p>
</div></div>
</article> </article>
<article class="svc reveal"> <article class="svc reveal">
<div class="svc__no" aria-hidden="true">05</div> <button class="svc__q" type="button" aria-expanded="false">
<div class="svc__body"> <span class="svc__no" aria-hidden="true">05</span>
<h3 class="svc__name">Room to grow</h3> <span class="svc__name">Room to grow</span>
<p class="svc__desc">From a single brochure site to commerce with unlimited sites, all on the same managed platform. Move up when you are ready.</p> <span class="svc__tail"><span class="pm" aria-hidden="true">+</span></span>
</div> </button>
<div class="svc__panel"><div class="svc__panel-inner">
<p class="svc__desc">Whether you are running a simple one-page site today or an online store with many sites later, it all lives on the same managed platform. You can start small and move up when you are ready, without repacking and moving your whole site to a new home.</p>
</div></div>
</article> </article>
</div> </div>
<p class="band-punch reveal">Hosting should be something you never think about. That is exactly what we are selling.</p> <p class="band-punch reveal">Hosting should be something you never think about. That is exactly what we are selling.</p>
@@ -233,13 +248,13 @@
<aside class="ticker" aria-label="The Computer Guru Show radio information"> <aside class="ticker" aria-label="The Computer Guru Show radio information">
<div class="ticker__track" aria-hidden="true"> <div class="ticker__track" aria-hidden="true">
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
<span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span> <span class="ticker__item"><strong>The Computer Guru Show</strong> / Saturdays 9AM / KVOI 1030AM</span>
<span class="ticker__item">Call in live: <strong>520-790-2020</strong></span> <span class="ticker__item">Call in live: <strong>520-790-2040</strong></span>
<span class="ticker__item">Tucson's trusted tech talk since 2001</span> <span class="ticker__item">Tucson's trusted tech talk since 2001</span>
</div> </div>
<p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2020. Tucson's trusted tech talk since 2001.</p> <p class="sr-only">The Computer Guru Show, Saturdays 9AM on KVOI 1030AM. Call in live: 520-790-2040. Tucson's trusted tech talk since 2001.</p>
</aside> </aside>
</main> </main>