ThatAIguyA world of ideas

THE CONSCIOUSNESS ATLAS
Read. Experiment. Follow the evidence.

ConsciousnessLearn · Explore · Joseph Anady

fossil-cove-brewing.html

Source identity, revision, and recovered contents.

archive memberSource text recovered

Source identity

FieldRecorded value
Source typearchive member
Original recordfossil-cove-brewing.html
DateNot specified in source
Path or archive memberarchives/libsrc-1c3f88063121/NETLIFY_AI_RECOVERY_2026-10-14_21-10-49/sites/janady13__heroic-duckanoo-27bf42__e4da36ba-c133-41bf-b947-fc4df2339c31/originals/deploy_696945e0b902ed493da89961/fossil-cove-brewing.html
Original SHA-256b0794acbdac21c1da23bd1792f216fbf3baeaa5e5ac3496124848adb7ffec91d
Reading-copy SHA-256c7c336b51937d9d2485486531e1217ff5c9b507d0b9f4b1549e3df1393d5e93c
Archive source{"sourceId": "libsrc-1c3f88063121", "member": "NETLIFY_AI_RECOVERY_2026-10-14_21-10-49/sites/janady13__heroic-duckanoo-27bf42__e4da36ba-c133-41bf-b947-fc4df2339c31/originals/deploy_696945e0b902ed493da89961/fossil-cove-brewing.html"}

Every recorded occurrence

These 2 records contain identical original source bytes. Their paths and revisions remain part of the archive.

Original recordBranch or archiveRevision / identifierOriginal location
fossil-cove-brewing.html{"sourceId": "libsrc-1c3f88063121", "member": "NETLIFY_AI_RECOVERY_2026-10-14_21-10-49/sites/janady13__heroic-duckanoo-27bf42__e4da36ba-c133-41bf-b947-fc4df2339c31/originals/deploy_696945e0b902ed493da89961/fossil-cove-brewing.html"}libsrc-924b3ae1204barchives/libsrc-1c3f88063121/NETLIFY_AI_RECOVERY_2026-10-14_21-10-49/sites/janady13__heroic-duckanoo-27bf42__e4da36ba-c133-41bf-b947-fc4df2339c31/originals/deploy_696945e0b902ed493da89961/fossil-cove-brewing.html
4157d8a54749d9b5ac9c38afdd371904135beb5e{"sourceId": "libsrc-1c3f88063121", "member": "NETLIFY_AI_RECOVERY_2026-10-14_21-10-49/sites/janady13__heroic-duckanoo-27bf42__e4da36ba-c133-41bf-b947-fc4df2339c31/originals/.content_store/41/4157d8a54749d9b5ac9c38afdd371904135beb5e"}libsrc-0d968aabcac6archives/libsrc-1c3f88063121/NETLIFY_AI_RECOVERY_2026-10-14_21-10-49/sites/janady13__heroic-duckanoo-27bf42__e4da36ba-c133-41bf-b947-fc4df2339c31/originals/.content_store/41/4157d8a54749d9b5ac9c38afdd371904135beb5e

Recovered source transcript

Download complete source text ↓1,984 lines · 62.2 KB
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Fossil Cove Brewing Co. | Fayetteville, Arkansas</title> <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,400;1,500;1,600&family=Space+Mono:wght@400;700&family=Unbounded:wght@200;300;400;500;600;700;800;900&display=swap" rel="stylesheet"> <style> :root { --deep-earth: #1a1612; --fossil-dark: #2a2420; --sediment: #3d3630; --clay: #5c524a; --limestone: #8b7d70; --sandstone: #b8a799; --bone: #d4c8b8; --cream: #f0e9df; --white: #faf8f5; --amber: #d4830a; --golden: #e9a319; --honey: #f5bc41; --copper: #c46d22; --rust: #8b4513; --pine: #3d5c3d; --moss: #5a7247; --water: #4a7c8c; } * { margin: 0; padding: 0; box-sizing: border-box; } html { scroll-behavior: smooth; background: var(--deep-earth); } body { font-family: 'Space Mono', monospace; background: var(--deep-earth); color: var(--cream); overflow-x: hidden; cursor: none; } /* Texture Overlay */ .texture { position: fixed; inset: 0; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)'/%3E%3C/svg%3E"); opacity: 0.04; pointer-events: none; z-index: 10000; mix-blend-mode: overlay; } /* Custom Cursor - Fossil Shape */ .cursor { width: 24px; height: 24px; border: 2px solid var(--amber); border-radius: 50%; position: fixed; pointer-events: none; z-index: 9999; transition: all 0.2s cubic-bezier(0.16, 1, 0.3, 1); mix-blend-mode: difference; } .cursor-fossil { width: 8px; height: 8px; background: var(--amber); border-radius: 50%; position: fixed; pointer-events: none; z-index: 9999; transition: transform 0.1s ease; } .cursor.active { width: 50px; height: 50px; background: var(--amber); opacity: 0.3; } /* Preloader - Fossil Discovery */ .preloader { position: fixed; inset: 0; background: var(--deep-earth); z-index: 10001; display: flex; align-items: center; justify-content: center; flex-direction: column; } .preloader-fossil { width: 120px; height: 120px; position: relative; margin-bottom: 3rem; } .preloader-fossil svg { width: 100%; height: 100%; fill: none; stroke: var(--amber); stroke-width: 1.5; stroke-dasharray: 500; stroke-dashoffset: 500; animation: fossilDraw 2s ease forwards; } @keyframes fossilDraw { to { stroke-dashoffset: 0; } } .preloader-text { font-family: 'Unbounded', sans-serif; font-size: clamp(1.5rem, 5vw, 3rem); font-weight: 700; letter-spacing: 0.1em; overflow: hidden; } .preloader-text span { display: inline-block; transform: translateY(100%); animation: preloaderText 0.6s ease forwards; animation-delay: calc(1s + var(--i) * 0.05s); } @keyframes preloaderText { to { transform: translateY(0); } } .preloader-sub { font-size: 0.7rem; letter-spacing: 0.4em; color: var(--limestone); margin-top: 1rem; opacity: 0; animation: fadeIn 0.5s ease forwards 2s; } @keyframes fadeIn { to { opacity: 1; } } .preloader.exit { animation: preloaderExit 1.2s cubic-bezier(0.76, 0, 0.24, 1) forwards; } @keyframes preloaderExit { 0% { clip-path: inset(0 0 0 0); } 100% { clip-path: inset(100% 0 0 0); } } /* Navigation */ nav { position: fixed; top: 0; left: 0; right: 0; z-index: 100; padding: 1.5rem 3rem; display: flex; justify-content: space-between; align-items: center; background: linear-gradient(to bottom, var(--deep-earth), transparent); } .logo { display: flex; align-items: center; gap: 1rem; text-decoration: none; color: var(--cream); } .logo-mark { width: 50px; height: 50px; position: relative; } .logo-mark svg { width: 100%; height: 100%; fill: var(--amber); } .logo-text { display: flex; flex-direction: column; } .logo-name { font-family: 'Unbounded', sans-serif; font-size: 1rem; font-weight: 700; letter-spacing: 0.15em; } .logo-sub { font-size: 0.55rem; letter-spacing: 0.3em; color: var(--limestone); text-transform: uppercase; } .nav-links { display: flex; gap: 3rem; list-style: none; } .nav-links a { color: var(--bone); text-decoration: none; font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase; position: relative; padding: 0.5rem 0; transition: color 0.3s ease; } .nav-links a::after { content: ''; position: absolute; bottom: 0; left: 0; width: 0; height: 2px; background: var(--amber); transition: width 0.4s cubic-bezier(0.16, 1, 0.3, 1); } .nav-links a:hover { color: var(--amber); } .nav-links a:hover::after { width: 100%; } .nav-cta { padding: 0.9rem 2rem; background: var(--amber); color: var(--deep-earth); font-size: 0.65rem; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; text-decoration: none; transition: all 0.4s ease; } .nav-cta:hover { background: var(--golden); transform: translateY(-2px); box-shadow: 0 10px 30px rgba(212, 131, 10, 0.3); } /* ========== HERO ========== */ .hero { min-height: 100vh; position: relative; display: flex; align-items: center; justify-content: center; overflow: hidden; } /* Geological Layers Background */ .geo-layers { position: absolute; inset: 0; overflow: hidden; } .geo-layer { position: absolute; left: 0; right: 0; height: 100%; } .geo-layer-1 { background: radial-gradient(ellipse 120% 60% at 50% 100%, var(--sediment) 0%, transparent 70%); animation: layerFloat 12s ease-in-out infinite; } .geo-layer-2 { background: radial-gradient(ellipse 80% 40% at 30% 90%, rgba(212, 131, 10, 0.15) 0%, transparent 60%); animation: layerFloat 10s ease-in-out infinite reverse; } .geo-layer-3 { background: radial-gradient(ellipse 60% 30% at 70% 85%, rgba(139, 69, 19, 0.1) 0%, transparent 50%); animation: layerFloat 8s ease-in-out infinite 2s; } @keyframes layerFloat { 0%, 100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-3%) scale(1.02); } } /* Fossil Illustrations Background */ .fossil-bg { position: absolute; inset: 0; overflow: hidden; pointer-events: none; } .fossil-item { position: absolute; opacity: 0.03; fill: var(--bone); } .fossil-1 { top: 10%; left: 5%; width: 200px; animation: fossilDrift 20s ease-in-out infinite; } .fossil-2 { top: 60%; right: 10%; width: 150px; animation: fossilDrift 25s ease-in-out infinite reverse; } .fossil-3 { bottom: 20%; left: 20%; width: 180px; animation: fossilDrift 18s ease-in-out infinite 3s; } @keyframes fossilDrift { 0%, 100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-20px) rotate(5deg); } } /* Giant Background Text */ .hero-bg-text { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; pointer-events: none; overflow: hidden; } .bg-fossil-text { font-family: 'Unbounded', sans-serif; font-size: clamp(15rem, 45vw, 50rem); font-weight: 900; color: transparent; -webkit-text-stroke: 1px var(--sediment); letter-spacing: -0.05em; line-height: 0.85; white-space: nowrap; opacity: 0.5; } /* Scrolling Tagline */ .hero-scroll-text { position: absolute; bottom: 25%; left: 0; display: flex; animation: scrollTextLeft 30s linear infinite; } .hero-scroll-text span { font-family: 'Playfair Display', serif; font-size: clamp(4rem, 12vw, 10rem); font-style: italic; font-weight: 400; color: transparent; -webkit-text-stroke: 1px var(--clay); white-space: nowrap; padding-right: 4rem; letter-spacing: -0.02em; } @keyframes scrollTextLeft { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } } /* Top Scrolling - Reverse */ .hero-scroll-top { position: absolute; top: 20%; left: 0; display: flex; animation: scrollTextRight 25s linear infinite; } .hero-scroll-top span { font-family: 'Space Mono', monospace; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.5em; text-transform: uppercase; color: var(--clay); white-space: nowrap; padding-right: 8rem; } @keyframes scrollTextRight { 0% { transform: translateX(-50%); } 100% { transform: translateX(0); } } /* Vertical Side Text */ .hero-vertical { position: absolute; top: 50%; transform: translateY(-50%) rotate(-90deg); font-size: 0.6rem; font-weight: 700; letter-spacing: 0.5em; text-transform: uppercase; color: var(--limestone); white-space: nowrap; } .hero-vertical-left { left: 2rem; } .hero-vertical-right { right: 2rem; transform: translateY(-50%) rotate(90deg); } /* Main Hero Content */ .hero-content { position: relative; z-index: 10; text-align: center; padding: 0 2rem; max-width: 1100px; } .hero-badge { display: inline-flex; align-items: center; gap: 0.75rem; padding: 0.6rem 1.5rem; border: 1px solid var(--clay); border-radius: 100px; margin-bottom: 2rem; opacity: 0; animation: heroFadeUp 1s ease forwards 2.4s; } .hero-badge-dot { width: 6px; height: 6px; background: var(--amber); border-radius: 50%; animation: pulse 2s ease infinite; } @keyframes pulse { 0%, 100% { transform: scale(1); opacity: 1; } 50% { transform: scale(1.5); opacity: 0.5; } } .hero-badge span { font-size: 0.6rem; letter-spacing: 0.3em; text-transform: uppercase; color: var(--limestone); } .hero-title { margin-bottom: 1.5rem; overflow: hidden; } .hero-title-line { display: block; overflow: hidden; } .hero-title-main { font-family: 'Unbounded', sans-serif; font-size: clamp(3rem, 12vw, 9rem); font-weight: 800; line-height: 0.95; letter-spacing: -0.03em; display: block; transform: translateY(110%); animation: heroReveal 1.2s cubic-bezier(0.16, 1, 0.3, 1) forwards; animation-delay: calc(2.5s + var(--d) * 0.1s); } .hero-title-main .amber { color: var(--amber); } @keyframes heroReveal { to { transform: translateY(0); } } .hero-subtitle { font-family: 'Playfair Display', serif; font-size: clamp(1.5rem, 4vw, 2.5rem); font-weight: 400; font-style: italic; color: var(--sandstone); margin-bottom: 2rem; opacity: 0; animation: heroFadeUp 1s ease forwards 2.9s; } @keyframes heroFadeUp { from { opacity: 0; transform: translateY(30px); } to { opacity: 1; transform: translateY(0); } } .hero-desc { font-size: 0.9rem; line-height: 1.9; color: var(--limestone); max-width: 500px; margin: 0 auto 3rem; opacity: 0; animation: heroFadeUp 1s ease forwards 3.1s; } .hero-ctas { display: flex; align-items: center; justify-content: center; gap: 2rem; opacity: 0; animation: heroFadeUp 1s ease forwards 3.3s; } .hero-cta-primary { display: inline-flex; align-items: center; gap: 1rem; padding: 1.25rem 2.5rem; background: var(--amber); color: var(--deep-earth); font-size: 0.7rem; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; text-decoration: none; transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1); } .hero-cta-primary:hover { background: var(--golden); transform: translateY(-3px); box-shadow: 0 15px 40px rgba(212, 131, 10, 0.3); } .hero-cta-primary svg { width: 16px; height: 16px; stroke: currentColor; transition: transform 0.3s ease; } .hero-cta-primary:hover svg { transform: translateX(4px); } .hero-cta-secondary { display: inline-flex; align-items: center; gap: 0.75rem; color: var(--bone); font-size: 0.7rem; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; text-decoration: none; transition: color 0.3s ease; } .hero-cta-secondary:hover { color: var(--amber); } /* Scroll Indicator */ .hero-scroll { position: absolute; bottom: 3rem; left: 50%; transform: translateX(-50%); display: flex; flex-direction: column; align-items: center; gap: 1rem; opacity: 0; animation: heroFadeUp 1s ease forwards 3.5s; } .hero-scroll-label { font-size: 0.55rem; letter-spacing: 0.4em; text-transform: uppercase; color: var(--limestone); } .hero-scroll-line { width: 1px; height: 50px; background: linear-gradient(to bottom, var(--amber), transparent); animation: scrollPulse 2s ease infinite; } @keyframes scrollPulse { 0%, 100% { transform: scaleY(1); opacity: 1; } 50% { transform: scaleY(0.5); opacity: 0.3; } } /* Stats Strip */ .hero-stats { position: absolute; bottom: 0; left: 0; right: 0; display: flex; border-top: 1px solid var(--sediment); background: rgba(26, 22, 18, 0.8); backdrop-filter: blur(10px); opacity: 0; animation: heroFadeUp 1s ease forwards 3.6s; } .hero-stat { flex: 1; padding: 1.5rem 2rem; border-right: 1px solid var(--sediment); display: flex; align-items: center; gap: 1.25rem; } .hero-stat:last-child { border-right: none; } .hero-stat-num { font-family: 'Playfair Display', serif; font-size: 2.5rem; font-weight: 500; color: var(--amber); line-height: 1; } .hero-stat-label { font-size: 0.6rem; letter-spacing: 0.15em; text-transform: uppercase; color: var(--limestone); line-height: 1.5; } /* ========== MARQUEE ========== */ .marquee { padding: 1.25rem 0; background: var(--amber); overflow: hidden; } .marquee-track { display: flex; animation: marquee 20s linear infinite; } .marquee-content { display: flex; align-items: center; gap: 3rem; flex-shrink: 0; padding: 0 1.5rem; } .marquee-item { font-family: 'Unbounded', sans-serif; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: var(--deep-earth); white-space: nowrap; } .marquee-dot { width: 6px; height: 6px; background: var(--deep-earth); border-radius: 50%; } @keyframes marquee { 0% { transform: translateX(0); } 100% { transform: translateX(-50%); } } /* ========== ABOUT / STORY ========== */ .story { padding: 12rem 4rem; position: relative; overflow: hidden; } .story-bg { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); font-family: 'Unbounded', sans-serif; font-size: 40vw; font-weight: 900; color: var(--fossil-dark); pointer-events: none; line-height: 0.8; opacity: 0.5; } .story-container { max-width: 1400px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 8rem; position: relative; z-index: 1; } .story-left { display: flex; flex-direction: column; justify-content: center; } .section-tag { display: inline-flex; align-items: center; gap: 0.75rem; margin-bottom: 2rem; } .section-tag-line { width: 40px; height: 1px; background: var(--amber); } .section-tag-text { font-size: 0.6rem; font-weight: 700; letter-spacing: 0.35em; text-transform: uppercase; color: var(--amber); } .story-title { font-family: 'Playfair Display', serif; font-size: clamp(2.5rem, 5vw, 4rem); font-weight: 500; line-height: 1.15; margin-bottom: 2rem; } .story-title em { font-style: italic; color: var(--amber); } .story-text { font-size: 0.95rem; line-height: 2; color: var(--sandstone); margin-bottom: 3rem; } .story-features { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.5rem; } .story-feature { display: flex; align-items: flex-start; gap: 1rem; } .story-feature-icon { width: 40px; height: 40px; background: var(--sediment); border-radius: 50%; display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .story-feature-icon svg { width: 18px; height: 18px; stroke: var(--amber); } .story-feature-text { font-size: 0.8rem; color: var(--bone); line-height: 1.5; } .story-right { position: relative; } .story-image { width: 100%; aspect-ratio: 4/5; background: linear-gradient(135deg, var(--sediment), var(--fossil-dark)); position: relative; overflow: hidden; } .story-image::before { content: ''; position: absolute; inset: 0; background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M30 0v60M0 30h60' stroke='%23ffffff' stroke-opacity='0.02' fill='none'/%3E%3C/svg%3E"); } .story-image::after { content: 'SINCE 2012'; position: absolute; bottom: 3rem; left: 3rem; font-family: 'Unbounded', sans-serif; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.3em; color: var(--amber); } .story-image-frame { position: absolute; inset: 1.5rem; border: 1px solid var(--amber); opacity: 0.3; } .story-float-card { position: absolute; bottom: -3rem; right: -2rem; background: var(--amber); padding: 2rem; max-width: 250px; } .story-float-text { font-family: 'Playfair Display', serif; font-size: 1.25rem; font-style: italic; color: var(--deep-earth); line-height: 1.4; } /* ========== BEERS ========== */ .beers { padding: 10rem 0; background: var(--fossil-dark); position: relative; } .beers-header { padding: 0 4rem; margin-bottom: 5rem; display: flex; justify-content: space-between; align-items: flex-end; max-width: 1600px; margin-left: auto; margin-right: auto; } .beers-title-wrap { max-width: 550px; } .beers-title { font-family: 'Playfair Display', serif; font-size: clamp(2.5rem, 4vw, 3.5rem); font-weight: 500; line-height: 1.15; margin-bottom: 1rem; } .beers-subtitle { font-size: 0.9rem; color: var(--limestone); line-height: 1.8; } .beers-filter { display: flex; gap: 1rem; } .filter-btn { padding: 0.75rem 1.5rem; background: transparent; border: 1px solid var(--clay); color: var(--bone); font-family: 'Space Mono', monospace; font-size: 0.65rem; letter-spacing: 0.15em; text-transform: uppercase; cursor: pointer; transition: all 0.3s ease; } .filter-btn:hover, .filter-btn.active { background: var(--amber); border-color: var(--amber); color: var(--deep-earth); } .beers-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--clay); } .beer-card { background: var(--fossil-dark); padding: 3rem 2.5rem; position: relative; cursor: pointer; overflow: hidden; min-height: 400px; display: flex; flex-direction: column; } .beer-card::before { content: ''; position: absolute; inset: 0; background: linear-gradient(135deg, var(--amber), var(--copper)); opacity: 0; transition: opacity 0.5s ease; } .beer-card:hover::before { opacity: 1; } .beer-card-content { position: relative; z-index: 1; flex: 1; display: flex; flex-direction: column; } .beer-type { font-size: 0.55rem; font-weight: 700; letter-spacing: 0.25em; text-transform: uppercase; color: var(--amber); margin-bottom: 1rem; transition: color 0.5s ease; } .beer-card:hover .beer-type { color: var(--deep-earth); } .beer-name { font-family: 'Unbounded', sans-serif; font-size: 1.5rem; font-weight: 700; line-height: 1.2; margin-bottom: 1rem; } .beer-stats { display: flex; gap: 1.5rem; margin-bottom: 1.5rem; } .beer-stat { display: flex; flex-direction: column; } .beer-stat-value { font-family: 'Playfair Display', serif; font-size: 1.5rem; color: var(--amber); transition: color 0.5s ease; } .beer-card:hover .beer-stat-value { color: var(--deep-earth); } .beer-stat-label { font-size: 0.55rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--limestone); transition: color 0.5s ease; } .beer-card:hover .beer-stat-label { color: rgba(26, 22, 18, 0.7); } .beer-desc { font-size: 0.8rem; line-height: 1.7; color: var(--sandstone); margin-top: auto; transition: color 0.5s ease; } .beer-card:hover .beer-desc { color: var(--deep-earth); } .beer-arrow { position: absolute; bottom: 2rem; right: 2rem; width: 40px; height: 40px; border-radius: 50%; border: 1px solid var(--clay); display: flex; align-items: center; justify-content: center; opacity: 0; transform: translateY(10px); transition: all 0.5s cubic-bezier(0.16, 1, 0.3, 1); } .beer-card:hover .beer-arrow { opacity: 1; transform: translateY(0); border-color: var(--deep-earth); background: var(--deep-earth); } .beer-arrow svg { width: 14px; height: 14px; stroke: var(--cream); } /* ========== VISIT ========== */ .visit { padding: 10rem 4rem; background: var(--deep-earth); } .visit-container { max-width: 1400px; margin: 0 auto; display: grid; grid-template-columns: 1.2fr 1fr; gap: 6rem; } .visit-info h2 { font-family: 'Playfair Display', serif; font-size: clamp(2.5rem, 4vw, 3.5rem); font-weight: 500; line-height: 1.15; margin-bottom: 2rem; } .visit-info h2 em { font-style: italic; color: var(--amber); } .visit-text { font-size: 0.95rem; line-height: 2; color: var(--sandstone); margin-bottom: 3rem; } .visit-details { display: flex; flex-direction: column; gap: 1.5rem; margin-bottom: 3rem; } .visit-detail { display: flex; align-items: flex-start; gap: 1.25rem; } .visit-detail-icon { width: 48px; height: 48px; background: var(--sediment); display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .visit-detail-icon svg { width: 20px; height: 20px; stroke: var(--amber); } .visit-detail-content h4 { font-size: 0.6rem; font-weight: 700; letter-spacing: 0.2em; text-transform: uppercase; color: var(--limestone); margin-bottom: 0.4rem; } .visit-detail-content p { font-size: 0.95rem; color: var(--cream); line-height: 1.6; } .visit-cta { display: inline-flex; align-items: center; gap: 1rem; padding: 1.25rem 2.5rem; background: var(--amber); color: var(--deep-earth); font-size: 0.7rem; font-weight: 700; letter-spacing: 0.15em; text-transform: uppercase; text-decoration: none; transition: all 0.4s ease; } .visit-cta:hover { background: var(--golden); transform: translateY(-3px); } .visit-map { position: relative; } .visit-map-container { width: 100%; aspect-ratio: 1; background: var(--sediment); position: relative; overflow: hidden; } .visit-map-container::before { content: ''; position: absolute; inset: 0; background: radial-gradient(circle at 50% 50%, var(--water) 0%, transparent 30%), linear-gradient(135deg, var(--moss), var(--pine)); opacity: 0.3; } .visit-map-label { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; } .visit-map-label .pin { width: 40px; height: 40px; background: var(--amber); border-radius: 50% 50% 50% 0; transform: rotate(-45deg); margin: 0 auto 1rem; animation: pinBounce 2s ease infinite; } @keyframes pinBounce { 0%, 100% { transform: rotate(-45deg) translateY(0); } 50% { transform: rotate(-45deg) translateY(-10px); } } .visit-map-label span { font-family: 'Unbounded', sans-serif; font-size: 0.7rem; font-weight: 700; letter-spacing: 0.2em; color: var(--cream); } /* ========== FOOTER ========== */ footer { padding: 5rem 4rem; background: var(--fossil-dark); border-top: 1px solid var(--sediment); } .footer-container { max-width: 1400px; margin: 0 auto; } .footer-top { display: flex; justify-content: space-between; align-items: flex-start; padding-bottom: 4rem; margin-bottom: 3rem; border-bottom: 1px solid var(--sediment); } .footer-brand { max-width: 350px; } .footer-logo { display: flex; align-items: center; gap: 1rem; margin-bottom: 1.5rem; } .footer-logo svg { width: 40px; height: 40px; fill: var(--amber); } .footer-logo-text { font-family: 'Unbounded', sans-serif; font-size: 1.1rem; font-weight: 700; letter-spacing: 0.1em; } .footer-tagline { font-size: 0.85rem; line-height: 1.8; color: var(--limestone); } .footer-links { display: flex; gap: 5rem; } .footer-col h4 { font-size: 0.6rem; font-weight: 700; letter-spacing: 0.25em; text-transform: uppercase; color: var(--limestone); margin-bottom: 1.5rem; } .footer-col ul { list-style: none; display: flex; flex-direction: column; gap: 0.75rem; } .footer-col a { font-size: 0.85rem; color: var(--bone); text-decoration: none; transition: color 0.3s ease; } .footer-col a:hover { color: var(--amber); } .footer-bottom { display: flex; justify-content: space-between; align-items: center; } .footer-copy { font-size: 0.7rem; color: var(--limestone); } .footer-social { display: flex; gap: 0.75rem; } .footer-social a { width: 44px; height: 44px; border: 1px solid var(--clay); display: flex; align-items: center; justify-content: center; transition: all 0.3s ease; } .footer-social a:hover { background: var(--amber); border-color: var(--amber); } .footer-social svg { width: 18px; height: 18px; stroke: var(--bone); transition: stroke 0.3s ease; } .footer-social a:hover svg { stroke: var(--deep-earth); } /* ========== RESPONSIVE ========== */ @media (max-width: 1200px) { .hero-stats { display: none; } .beers-grid { grid-template-columns: repeat(2, 1fr); } } @media (max-width: 1024px) { .nav-links { display: none; } .story-container, .visit-container { grid-template-columns: 1fr; gap: 4rem; } .story-float-card { position: relative; bottom: 0; right: 0; margin-top: 2rem; } } @media (max-width: 768px) { nav { padding: 1rem 1.5rem; } .hero-content { padding: 0 1.5rem; } .hero-vertical { display: none; } .beers-header { flex-direction: column; align-items: flex-start; gap: 2rem; } .beers-grid { grid-template-columns: 1fr; } .story, .beers, .visit { padding: 6rem 1.5rem; } .footer-top { flex-direction: column; gap: 3rem; } .footer-links { flex-wrap: wrap; gap: 2rem 3rem; } } @media (max-width: 600px) { .cursor, .cursor-fossil { display: none; } body { cursor: auto; } .story-features { grid-template-columns: 1fr; } .beers-filter { flex-wrap: wrap; } } </style> </head> <body> <!-- Texture --> <div class="texture"></div> <!-- Cursor --> <div class="cursor"></div> <div class="cursor-fossil"></div> <!-- Preloader --> <div class="preloader"> <div class="preloader-fossil"> <svg viewBox="0 0 100 100"> <!-- Ammonite fossil spiral --> <path d="M50 50 Q60 40, 55 30 Q45 25, 35 35 Q30 50, 45 55 Q60 55, 65 45 Q65 30, 50 25 Q30 25, 25 45 Q25 65, 50 70 Q75 70, 80 50 Q80 25, 50 20 Q20 20, 15 50 Q15 80, 50 85"/> <circle cx="50" cy="50" r="3"/> </svg> </div> <div class="preloader-text"> <span style="--i:0">F</span><span style="--i:1">O</span><span style="--i:2">S</span><span style="--i:3">S</span><span style="--i:4">I</span><span style="--i:5">L</span><span style="--i:6">&nbsp;</span><span style="--i:7">C</span><span style="--i:8">O</span><span style="--i:9">V</span><span style="--i:10">E</span> </div> <p class="preloader-sub">Fayetteville, Arkansas</p> </div> <!-- Navigation --> <nav> <a href="#" class="logo"> <div class="logo-mark"> <svg viewBox="0 0 50 50"> <path d="M25 5 Q35 15, 30 25 Q20 30, 15 20 Q10 35, 25 40 Q40 40, 45 25 Q45 10, 25 5Z"/> <circle cx="22" cy="18" r="2"/> </svg> </div> <div class="logo-text"> <span class="logo-name">FOSSIL COVE</span> <span class="logo-sub">Brewing Company</span> </div> </a> <ul class="nav-links"> <li><a href="#story">Our Story</a></li> <li><a href="#beers">Beers</a></li> <li><a href="#visit">Visit</a></li> <li><a href="#">Shop</a></li> </ul> <a href="#visit" class="nav-cta">Tap Room</a> </nav> <!-- Hero --> <section class="hero"> <!-- Geological Layers --> <div class="geo-layers"> <div class="geo-layer geo-layer-1"></div> <div class="geo-layer geo-layer-2"></div> <div class="geo-layer geo-layer-3"></div> </div> <!-- Fossil Background Elements --> <div class="fossil-bg"> <svg class="fossil-item fossil-1" viewBox="0 0 200 200"> <path d="M100 20 Q140 40, 130 80 Q110 100, 80 90 Q50 70, 60 40 Q80 20, 100 20Z M100 50 Q120 60, 115 80 Q100 90, 85 80 Q75 65, 85 55 Q95 50, 100 50Z"/> </svg>

Search equations, builds, manuscript text, and recovered sources.