/* seomelbourne.com — hub-index family stylesheet: declarations shared by every hub-index page (generated 2026-09-02, tranche 5 task 2). Chrome (nav/footer/modal) lives in chrome.css. */
:root{--primary:#00ff6a;--accent:#3b82f6;--purple:#8b5cf6;--amber:#f59e0b;--cyan:#06b6d4;--rose:#ec4899;--red:#ef4444;--emerald:#10b981;--bg:#1a2035;--surface:rgba(255,255,255,0.02);--surface-2:rgba(255,255,255,0.04);--text:#f0f0f5;--text-muted:rgba(255,255,255,0.6);--text-dim:rgba(255,255,255,0.35);--border:rgba(255,255,255,0.06);--font-display:'Space Grotesk','Space Grotesk Fallback','Space Grotesk Fallback R',sans-serif;--font-body:'Inter','Inter Fallback','Inter Fallback R',sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
*::before{box-sizing:border-box;margin:0;padding:0}
*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:var(--font-body);background:var(--bg);color:var(--text);line-height:1.7;-webkit-font-smoothing:antialiased}
body::after{content:'';position:fixed;inset:0;z-index:9999;pointer-events:none;opacity:0.015;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.ambient{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none}
.ambient-orb{position:absolute;border-radius:50%;filter:blur(120px)}
.ambient-orb:nth-child(1){width:600px;height:600px;background:radial-gradient(circle, rgba(0,255,106,0.08), transparent 70%);top:-200px;left:-100px;animation:drift1 30s ease-in-out infinite}
.ambient-orb:nth-child(2){width:500px;height:500px;background:radial-gradient(circle, rgba(59,130,246,0.06), transparent 70%);top:40%;right:-200px;animation:drift2 35s ease-in-out infinite}
.ambient-orb:nth-child(3){width:400px;height:400px;background:radial-gradient(circle, rgba(139,92,246,0.05), transparent 70%);bottom:10%;left:30%;animation:drift3 28s ease-in-out infinite}
.container{max-width:1200px;margin:0 auto;padding:0 2rem}
.hub-hero{padding:10rem 2rem 4rem;position:relative;z-index:2}
.hub-hero-inner{max-width:800px;margin:0 auto;text-align:center}
.hub-eyebrow{display:inline-flex;align-items:center;gap:0.6rem;padding:0.5rem 1.25rem;background:rgba(0,255,106,0.05);border:1px solid rgba(0,255,106,0.1);border-radius:100px;font-size:0.8rem;color:var(--primary);font-weight:500;margin-bottom:2rem;letter-spacing:0.04em}
.hub-eyebrow::before{content:'';width:6px;height:6px;background:var(--primary);border-radius:50%;box-shadow:0 0 12px var(--primary)}
.hub-hero h1{font-family:var(--font-display);font-size:clamp(2.8rem, 6vw, 4.2rem);font-weight:800;line-height:1.08;letter-spacing:-0.03em;margin-bottom:1.5rem}
.hub-hero h1 .grad{background:linear-gradient(135deg, var(--primary) 0%, var(--accent) 50%, var(--purple) 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.hub-hero p{font-size:1.15rem;color:var(--text-muted);max-width:560px;margin:0 auto 2.5rem;line-height:1.7}
.hub-tabs{display:flex;justify-content:center;gap:0.5rem;flex-wrap:wrap;padding:3rem 2rem 2rem;max-width:900px;margin:0 auto}
.cat-tab{padding:0.55rem 1.2rem;background:transparent;border:1px solid var(--border);border-radius:100px;color:var(--text-muted);font-size:0.85rem;font-weight:500;font-family:var(--font-body);cursor:pointer;transition:all 0.3s}
.cat-tab:hover{border-color:rgba(255,255,255,0.15);color:var(--text)}
.cat-tab.active{background:var(--primary);border-color:var(--primary);color:#000;font-weight:600}
.hub-featured{max-width:1200px;margin:0 auto 3rem;padding:0 2rem}
.hub-featured-card{display:grid;grid-template-columns:1fr 1fr;gap:0;background:var(--surface);border:1px solid var(--border);border-radius:24px;overflow:hidden;text-decoration:none;transition:all 0.4s}
.hub-featured-card:hover{border-color:rgba(59,130,246,0.25);box-shadow:0 20px 60px rgba(0,0,0,0.3);transform:translateY(-3px)}
.hub-featured-visual{background:linear-gradient(135deg, rgba(59,130,246,0.04), rgba(139,92,246,0.02));display:flex;align-items:center;justify-content:center;padding:2rem;min-height:280px}
.hub-featured-visual svg{width:100%;max-width:400px;height:auto}
.hub-featured-body{padding:2.5rem;display:flex;flex-direction:column;justify-content:center}
.hub-featured-eyebrow{display:inline-flex;align-items:center;gap:0.5rem;padding:0.35rem 0.8rem;background:rgba(59,130,246,0.08);border-radius:6px;font-size:0.7rem;font-weight:600;color:var(--accent);text-transform:uppercase;letter-spacing:0.05em;margin-bottom:1rem;width:fit-content}
.hub-featured-title{font-family:var(--font-display);font-size:1.6rem;font-weight:800;line-height:1.2;margin-bottom:0.75rem;color:var(--text);transition:color 0.3s}
.hub-featured-card:hover .hub-featured-title{color:var(--accent)}
.hub-featured-desc{color:var(--text-muted);font-size:0.95rem;line-height:1.65;margin-bottom:1.5rem}
.hub-featured-cta{display:inline-flex;align-items:center;gap:0.5rem;padding:0.75rem 1.5rem;background:var(--primary);color:#000;font-weight:700;font-size:0.9rem;border-radius:10px;transition:all 0.3s;width:fit-content}
.hub-featured-card:hover .hub-featured-cta{box-shadow:0 8px 25px rgba(0,255,106,0.3)}
@media (max-width: 768px){.hub-featured-card{grid-template-columns:1fr}
.hub-featured-visual{min-height:200px;padding:1.5rem}}
.hub-grid{max-width:1200px;margin:0 auto;padding:0 2rem 4rem;display:grid;grid-template-columns:repeat(auto-fill, minmax(340px, 1fr));gap:1.5rem}
.hub-card{display:flex;flex-direction:column;text-decoration:none;background:var(--surface);border:1px solid var(--border);border-radius:20px;overflow:hidden;transition:all 0.4s cubic-bezier(0.16, 1, 0.3, 1)}
.hub-card:hover{transform:translateY(-5px);border-color:rgba(0,255,106,0.15);box-shadow:0 20px 50px rgba(0,0,0,0.25)}
.hub-card-visual{aspect-ratio:16/9;display:flex;align-items:center;justify-content:center;overflow:hidden;background:linear-gradient(135deg, rgba(255,255,255,0.01), rgba(255,255,255,0.005));border-bottom:1px solid var(--border)}
.hub-card-visual svg{width:100%;height:100%}
.hub-card-content{padding:1.5rem;flex:1;display:flex;flex-direction:column}
.hub-card-meta{display:flex;align-items:center;justify-content:space-between;margin-bottom:0.75rem}
.hub-card-tag{display:inline-block;padding:0.2rem 0.6rem;background:color-mix(in srgb, var(--tag-color) 10%, transparent);color:var(--tag-color);font-size:0.7rem;font-weight:600;border-radius:5px;text-transform:uppercase;letter-spacing:0.04em}
.hub-card-time{font-size:0.75rem;color:var(--text-dim)}
.hub-card-title{font-family:var(--font-display);font-size:1.1rem;font-weight:700;line-height:1.3;color:var(--text);margin-bottom:0.5rem;transition:color 0.3s}
.hub-card:hover .hub-card-title{color:var(--primary)}
.hub-card-desc{font-size:0.85rem;color:var(--text-muted);line-height:1.6;margin-bottom:1rem;flex:1}
.hub-card-cta{display:inline-flex;align-items:center;gap:0.35rem;font-size:0.8rem;font-weight:600;color:var(--primary)}
.hub-card-cta svg{transition:transform 0.3s}
.hub-card:hover .hub-card-cta svg{transform:translateX(4px)}
.hub-card[style*="display: none"]{display:none!important}
.hub-cta{max-width:800px;margin:0 auto 4rem;padding:0 2rem}
.hub-cta-box{position:relative;overflow:hidden;background:linear-gradient(135deg, rgba(0,255,106,0.04), rgba(59,130,246,0.03));border:1px solid rgba(0,255,106,0.1);border-radius:24px;padding:3.5rem 2.5rem;text-align:center}
.hub-cta-box::before{content:'';position:absolute;top:-50%;left:-50%;width:200%;height:200%;background:radial-gradient(circle at 30% 30%, rgba(0,255,106,0.06), transparent 50%);pointer-events:none}
.hub-cta-box h2{font-family:var(--font-display);font-size:1.75rem;font-weight:800;margin-bottom:0.75rem;position:relative}
.hub-cta-box p{color:var(--text-muted);font-size:1rem;max-width:460px;margin:0 auto 1.75rem;position:relative}
.hub-cta-btn{display:inline-flex;align-items:center;gap:0.5rem;padding:0.9rem 2rem;background:var(--primary);color:#000;font-weight:700;font-size:0.95rem;border-radius:12px;text-decoration:none;transition:all 0.3s;position:relative}
.hub-cta-btn:hover{box-shadow:0 12px 35px rgba(0,255,106,0.3);transform:translateY(-2px)}
@media (max-width: 768px){.hub-hero{padding:8rem 1.5rem 3rem}
.hub-grid{grid-template-columns:1fr;padding:0 1.5rem 3rem}
.hub-cta-box{padding:2.5rem 1.5rem}}
@media(max-width:1024px){*{animation:none!important;animation-delay:0s!important;animation-duration:0s!important;transition:none!important;transition-delay:0s!important;transition-duration:0s!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;filter:none!important;box-shadow:none!important;will-change:auto!important}
*::before{animation:none!important;animation-delay:0s!important;animation-duration:0s!important;transition:none!important;transition-delay:0s!important;transition-duration:0s!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;filter:none!important;box-shadow:none!important;will-change:auto!important}
*::after{animation:none!important;animation-delay:0s!important;animation-duration:0s!important;transition:none!important;transition-delay:0s!important;transition-duration:0s!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important;filter:none!important;box-shadow:none!important;will-change:auto!important}
.harbour-cta-card{background:rgba(34,34,44,0.95)!important}
.glass{background:rgba(34,34,44,0.95)!important}
.card{background:rgba(34,34,44,0.95)!important}
.btn-primary .btn-surface{box-shadow:0 2px 0 0 #009938!important;transform:translateY(-2px)!important}
.btn-primary::before{display:none!important}
.btn-primary .btn-glow{display:none!important}
.btn-primary:active .btn-surface{transform:translateY(0)!important;box-shadow:none!important}
.btn-secondary .btn-surface{box-shadow:none!important;transform:translateY(0)!important}
canvas{display:none!important}
.client-logo-item img{filter:brightness(0) invert(1)!important}
[class*="orb"]{display:none!important}
[class*="glow"]{display:none!important}
[class*="ambient"]{display:none!important}
[class*="particle"]{display:none!important}
svg animate{display:none!important}
svg animateTransform{display:none!important}
svg animateMotion{display:none!important}

.trust-section{content-visibility:auto;contain-intrinsic-size:auto 500px}
.services-section{content-visibility:auto;contain-intrinsic-size:auto 500px}
.guides-section{content-visibility:auto;contain-intrinsic-size:auto 500px}
.case-studies-section{content-visibility:auto;contain-intrinsic-size:auto 500px}
.faq-section{content-visibility:auto;contain-intrinsic-size:auto 500px}
.harbour-cta-section{content-visibility:auto;contain-intrinsic-size:auto 500px}
.process-section{content-visibility:auto;contain-intrinsic-size:auto 500px}}
p a{color:#00ff6a;text-decoration:underline;text-decoration-color:rgba(0,255,106,0.3);text-underline-offset:3px;transition:color 0.2s,text-decoration-color 0.2s}
.faq-a a{color:#00ff6a;text-decoration:underline;text-decoration-color:rgba(0,255,106,0.3);text-underline-offset:3px;transition:color 0.2s,text-decoration-color 0.2s}
td a{color:#00ff6a;text-decoration:underline;text-decoration-color:rgba(0,255,106,0.3);text-underline-offset:3px;transition:color 0.2s,text-decoration-color 0.2s}
dd a{color:#00ff6a;text-decoration:underline;text-decoration-color:rgba(0,255,106,0.3);text-underline-offset:3px;transition:color 0.2s,text-decoration-color 0.2s}
article li a{color:#00ff6a;text-decoration:underline;text-decoration-color:rgba(0,255,106,0.3);text-underline-offset:3px;transition:color 0.2s,text-decoration-color 0.2s}
section li a:not(.nav-link){color:#00ff6a;text-decoration:underline;text-decoration-color:rgba(0,255,106,0.3);text-underline-offset:3px;transition:color 0.2s,text-decoration-color 0.2s}
p a:hover{color:#fff;text-decoration-color:#00ff6a}
.faq-a a:hover{color:#fff;text-decoration-color:#00ff6a}
td a:hover{color:#fff;text-decoration-color:#00ff6a}
dd a:hover{color:#fff;text-decoration-color:#00ff6a}
article li a:hover{color:#fff;text-decoration-color:#00ff6a}
section li a:not(.nav-link):hover{color:#fff;text-decoration-color:#00ff6a}
html{overflow-x:hidden!important}
body{overflow-x:hidden!important;max-width:100vw!important}
@media(max-width:768px){*{max-width:100vw;box-sizing:border-box}
img{max-width:100%!important;height:auto!important}
video{max-width:100%!important;height:auto!important}
iframe{max-width:100%!important;height:auto!important}
embed{max-width:100%!important;height:auto!important}
pre{overflow-x:auto;max-width:100%}
code{overflow-x:auto;max-width:100%}}
@keyframes drift1{0%, 100% { transform: translate(0, 0); } 50% { transform: translate(40px, 60px); }}
@keyframes drift2{0%, 100% { transform: translate(0, 0); } 50% { transform: translate(-50px, 40px); }}
@keyframes drift3{0%, 100% { transform: translate(0, 0); } 50% { transform: translate(60px, -40px); }}
@keyframes btnPulse{0%,100%{opacity:0.3} 50%{opacity:0.6}}