:root { color-scheme: light dark; --bg: #fafaf7; --fg: #1a1a1a; --muted: #5a5a55; --border: rgba(0, 0, 0, 0.15); --field-bg: #fff; --error: #b3261e; --ok: #1f7a3a; --accent: #e75480; /* overridden per-domain via inline style on */ } @media (prefers-color-scheme: dark) { :root { --bg: #14110d; --fg: #f4f1ea; --muted: #a7a299; --border: rgba(255, 255, 255, 0.18); --field-bg: #1d1a15; --error: #ff7a6a; --ok: #6ed089; } } * { box-sizing: border-box; } html, body { margin: 0; padding: 0; background: var(--bg); color: var(--fg); font-family: ui-serif, Georgia, "Times New Roman", serif; font-size: 18px; line-height: 1.6; } main { max-width: 42rem; margin: 0 auto; padding: 4rem 1.5rem; } .brand { display: inline-block; margin-bottom: 1.5rem; } /* ------------------------------------------------------------------ */ /* Hero picture (per-domain image; swap files in src/img/) */ /* ------------------------------------------------------------------ */ .hero { margin: 0 0 2rem; } .hero img { display: block; width: 100%; height: auto; border-radius: 10px; border: 1px solid var(--border); } /* ------------------------------------------------------------------ */ /* Title — shared base, then one distinctive treatment per domain. */ /* The per-domain class is set by worker/domains.js (titleClass). */ /* ------------------------------------------------------------------ */ .title { font-size: clamp(2.75rem, 8vw, 5rem); margin: 0; line-height: 1; font-weight: 800; letter-spacing: -0.01em; } /* artwork.ie — painterly pink stripes with stroke (à la bagpuss) */ .t-art { background: repeating-linear-gradient( 90deg, color-mix(in srgb, var(--accent) 40%, white) 0, color-mix(in srgb, var(--accent) 40%, white) 0.55em, #ffffff 0.55em, #ffffff 1.1em ); -webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-stroke: 2px var(--accent); paint-order: stroke fill; } /* bananas.ie — fat yellow with a brown outline, slight tilt */ .t-banana { font-family: ui-rounded, "Segoe UI", system-ui, sans-serif; color: var(--accent); -webkit-text-stroke: 2px #6b4f1d; paint-order: stroke fill; transform: rotate(-2deg); display: inline-block; } /* discovery.ie — wide-tracked teal gradient */ .t-discovery { font-family: ui-sans-serif, system-ui, sans-serif; text-transform: uppercase; letter-spacing: 0.12em; font-size: clamp(2rem, 6vw, 3.5rem); background: linear-gradient(90deg, var(--accent), color-mix(in srgb, var(--accent) 40%, #111)); -webkit-background-clip: text; background-clip: text; color: transparent; } /* display.ie — neon glow */ .t-display { font-family: ui-sans-serif, system-ui, sans-serif; color: var(--accent); text-shadow: 0 0 6px color-mix(in srgb, var(--accent) 70%, transparent), 0 0 18px color-mix(in srgb, var(--accent) 50%, transparent); } /* ergo.ie — clean uppercase monospace */ .t-ergo { font-family: ui-monospace, "SF Mono", Menlo, monospace; text-transform: uppercase; letter-spacing: 0.04em; font-weight: 700; color: var(--accent); } /* fake.ie — offset double-shadow "glitch" */ .t-fake { font-family: ui-sans-serif, system-ui, sans-serif; color: var(--fg); text-shadow: 2px 0 var(--accent), -2px 0 #00d0ff; } /* farming.ie — earthy serif, embossed */ .t-farming { font-family: ui-serif, Georgia, serif; color: var(--accent); text-shadow: 0 1px 0 rgba(0, 0, 0, 0.25); } /* fudge.ie — chunky 3D extrude */ .t-fudge { font-family: ui-rounded, "Segoe UI", system-ui, sans-serif; color: var(--accent); text-shadow: 1px 1px 0 #7a3d1a, 2px 2px 0 #7a3d1a, 3px 3px 0 #5e2f13, 4px 4px 6px rgba(0, 0, 0, 0.35); } /* ideal.ie — italic cyan gradient */ .t-ideal { font-style: italic; background: linear-gradient(120deg, var(--accent), #6ad6e8); -webkit-background-clip: text; background-clip: text; color: transparent; } /* juice.ie — juicy orange gradient, rounded */ .t-juice { font-family: ui-rounded, "Segoe UI", system-ui, sans-serif; background: linear-gradient(180deg, #ffd34d, var(--accent)); -webkit-background-clip: text; background-clip: text; color: transparent; } /* ---- Batch 2 ---- */ /* juices.ie — fresh lime gradient, rounded */ .t-juices { font-family: ui-rounded, "Segoe UI", system-ui, sans-serif; background: linear-gradient(180deg, #d4ff7a, var(--accent)); -webkit-background-clip: text; background-clip: text; color: transparent; } /* ketamine.ie — cold clinical blue, wide tracking */ .t-ketamine { font-family: ui-monospace, "SF Mono", Menlo, monospace; text-transform: lowercase; letter-spacing: 0.08em; color: var(--accent); text-shadow: 0 0 10px color-mix(in srgb, var(--accent) 45%, transparent); } /* lahaunstown.com — elegant estate serif */ .t-lahaunstown { font-family: ui-serif, Georgia, "Times New Roman", serif; font-weight: 700; letter-spacing: 0.01em; color: var(--accent); } /* laughanstown.com — teal serif with soft emboss */ .t-laughanstown { font-family: ui-serif, Georgia, serif; color: var(--accent); text-shadow: 0 1px 0 rgba(0, 0, 0, 0.2); } /* lehaunstown.com — warm brown, letterpress feel */ .t-lehaunstown { font-family: ui-serif, Georgia, serif; color: var(--accent); -webkit-text-stroke: 0.5px color-mix(in srgb, var(--accent) 60%, #000); paint-order: stroke fill; } /* liberal.ie — strong red, condensed uppercase */ .t-liberal { font-family: ui-sans-serif, system-ui, sans-serif; text-transform: uppercase; font-weight: 800; letter-spacing: -0.02em; color: var(--accent); } /* lifestyle.ie — chic magenta gradient italic */ .t-lifestyle { font-style: italic; background: linear-gradient(120deg, var(--accent), #ff9ec4); -webkit-background-clip: text; background-clip: text; color: transparent; } /* merchant.ie — classic green with gold stroke */ .t-merchant { font-family: ui-serif, Georgia, serif; color: var(--accent); -webkit-text-stroke: 1px #c9a227; paint-order: stroke fill; } /* nice.ie — friendly coral, rounded */ .t-nice { font-family: ui-rounded, "Segoe UI", system-ui, sans-serif; font-weight: 800; color: var(--accent); } /* owl.ie — deep night-purple glow */ .t-owl { font-family: ui-sans-serif, system-ui, sans-serif; color: var(--accent); text-shadow: 0 0 8px color-mix(in srgb, var(--accent) 60%, transparent), 0 2px 0 rgba(0, 0, 0, 0.25); } /* ------------------------------------------------------------------ */ /* Shared content + form */ /* ------------------------------------------------------------------ */ .intro { margin: 0 0 2rem; font-size: 1.05rem; color: var(--muted); max-width: 36rem; } form { display: grid; gap: 1.25rem; font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif; font-size: 1rem; } label { display: grid; gap: 0.35rem; } label span { font-weight: 500; color: var(--muted); font-size: 0.9rem; letter-spacing: 0.02em; } input, textarea { width: 100%; padding: 0.7rem 0.85rem; border: 1px solid var(--border); background: var(--field-bg); color: var(--fg); border-radius: 6px; font: inherit; font-size: 1rem; transition: border-color 120ms ease, box-shadow 120ms ease; } input:focus, textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent) 25%, transparent); } textarea { resize: vertical; min-height: 8rem; } button { justify-self: start; padding: 0.7rem 1.4rem; border: none; background: var(--accent); color: #fff; font: inherit; font-weight: 600; border-radius: 6px; cursor: pointer; transition: filter 120ms ease, transform 120ms ease; } button:hover:not(:disabled) { filter: brightness(0.92); } button:active:not(:disabled) { transform: translateY(1px); } button:disabled { opacity: 0.6; cursor: not-allowed; } #status { margin: 0; min-height: 1.5rem; font-size: 0.95rem; } #status.ok { color: var(--ok); } #status.error { color: var(--error); } .cf-turnstile { min-height: 65px; }