diff --git a/about.html b/about.html new file mode 100644 index 0000000..e89467c --- /dev/null +++ b/about.html @@ -0,0 +1,51 @@ + + + + + + + About Acme Tools + + + + + +
+
+

About the team

+

About Acme Tools

+

We build practical tools for founders, maintainers, and small product teams.

+
+
+
+

Small-team focus

+

Interfaces stay direct so teams can make decisions without extra process.

+
+
+

Maintainer friendly

+

Every workflow favors clear ownership, visible status, and low setup cost.

+
+
+
+

How we judge useful software

+
    +
  1. It should explain current work without a meeting.
  2. +
  3. It should make the next decision easier to see.
  4. +
  5. It should stay small enough for busy teams to maintain.
  6. +
+
+
+ + + diff --git a/contact.html b/contact.html new file mode 100644 index 0000000..8df7a60 --- /dev/null +++ b/contact.html @@ -0,0 +1,57 @@ + + + + + + + Contact Acme Tools + + + + + +
+
+

Start a conversation

+

Contact Acme Tools

+

Email us at hello@example.com for product questions.

+ hello@example.com +
+
+
+

Product questions

+

Share what your team is shipping and where the workflow feels slow.

+
+
+

Founder support

+

Ask about lightweight tools for planning, release notes, and handoffs.

+
+
+
+

What helps us respond

+
+
+
Team size
+
Tell us how many people share the product workflow.
+
+
+
Main blocker
+
Point to the planning, shipping, or handoff step that slows you down.
+
+
+
+
+ + + diff --git a/index.html b/index.html new file mode 100644 index 0000000..baab48e --- /dev/null +++ b/index.html @@ -0,0 +1,52 @@ + + + + + + + Welcome to Acme Tools + + + + + +
+
+

Simple software for focused teams

+

Welcome to Acme Tools

+

Acme Tools helps small teams ship simple software faster.

+ Start with Acme Tools +
+
+
+

Practical planning

+

Keep product work visible, scoped, and ready for handoff.

+
+
+

Faster delivery

+

Turn recurring release chores into clear team routines.

+
+
+
+

Built around small-team rhythm

+
    +
  1. Capture the next product move in one place.
  2. +
  3. Turn the move into a short, testable checklist.
  4. +
  5. Ship, review, and keep the next handoff clear.
  6. +
+
+
+ + + diff --git a/styles.css b/styles.css new file mode 100644 index 0000000..1d0f7f6 --- /dev/null +++ b/styles.css @@ -0,0 +1,193 @@ +:root { + color-scheme: light; + --ink: #1f2933; + --muted: #5b6775; + --line: #d7dee8; + --paper: #f7f9fc; + --surface: #ffffff; + --accent: #256f8c; + --accent-strong: #174f65; +} + +* { + box-sizing: border-box; +} + +body { + min-height: 100vh; + margin: 0; + color: var(--ink); + background: var(--paper); + font-family: Arial, Helvetica, sans-serif; + line-height: 1.6; +} + +.skip-link { + position: absolute; + left: 1rem; + top: 1rem; + z-index: 1; + transform: translateY(-150%); + padding: 0.5rem 0.75rem; + border-radius: 4px; + background: var(--accent-strong); + color: #ffffff; +} + +.skip-link:focus { + transform: translateY(0); +} + +.site-header { + display: flex; + align-items: center; + justify-content: space-between; + gap: 1rem; + padding: 1rem clamp(1rem, 4vw, 3rem); + border-bottom: 1px solid var(--line); + background: var(--surface); +} + +.brand { + color: var(--accent-strong); + font-weight: 700; + text-decoration: none; +} + +nav { + min-width: 0; +} + +nav ul { + display: flex; + flex-wrap: wrap; + gap: 0.75rem; + margin: 0; + padding: 0; + list-style: none; +} + +nav a, +.button-link { + color: var(--accent-strong); + font-weight: 700; +} + +nav a { + text-decoration: none; +} + +nav a:hover, +nav a:focus, +.button-link:hover, +.button-link:focus { + text-decoration: underline; +} + +.page-shell { + width: min(100%, 960px); + margin: 0 auto; + padding: clamp(2rem, 6vw, 4rem) clamp(1rem, 4vw, 2rem); +} + +.hero { + padding: clamp(2rem, 5vw, 4rem); + border: 1px solid var(--line); + border-radius: 6px; + background: var(--surface); +} + +.hero.compact { + padding-block: clamp(1.5rem, 4vw, 3rem); +} + +.eyebrow { + margin: 0 0 0.5rem; + color: var(--accent); + font-size: 0.85rem; + font-weight: 700; + text-transform: uppercase; +} + +h1, +h2, +p { + margin-top: 0; +} + +h1 { + margin-bottom: 0.75rem; + font-size: clamp(2rem, 5vw, 3.5rem); + line-height: 1.1; +} + +h2 { + margin-bottom: 0.5rem; + font-size: 1.1rem; +} + +.hero p, +article p, +footer { + color: var(--muted); +} + +.content-grid { + display: grid; + grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); + gap: 1rem; + margin-top: 1rem; +} + +.workflow { + margin-top: 1rem; + padding: 1.5rem; + border-left: 4px solid var(--accent); + background: var(--surface); +} + +.workflow ol, +.workflow dl { + margin-bottom: 0; + padding-left: 1.25rem; +} + +.workflow li + li, +.workflow div + div { + margin-top: 0.5rem; +} + +article { + padding: 1.25rem; + border: 1px solid var(--line); + border-radius: 6px; + background: var(--surface); +} + +.button-link { + display: inline-block; + margin-top: 0.5rem; +} + +footer { + padding: 1.5rem clamp(1rem, 4vw, 3rem); + border-top: 1px solid var(--line); + text-align: center; +} + +@media (max-width: 620px) { + .site-header { + align-items: flex-start; + flex-direction: column; + } + + nav ul { + gap: 0.5rem 1rem; + } + + .hero, + .workflow, + article { + padding: 1rem; + } +}