/*
Theme Name: Pinnacle Partners
Theme URI: https://pinnaclepartners.online
Author: Global Infrastructure Data Hub
Description: Enterprise Data SaaS Theme inspired by modern data brokerages.
Version: 2.0.1
Text Domain: pinnacle-partners
*/

/* ==========================================================================

Enterprise Variables (Dark Theme)
========================================================================== */
:root {
--bg-dark: #040d1a;
--bg-card: #0a1526;
--text-main: #f8fafc;
--text-muted: #cbd5e1;
--accent-blue: #2563eb;
--accent-glow: rgba(37, 99, 235, 0.2);
--border-subtle: rgba(255, 255, 255, 0.08);
--container-width: 1200px;
}

body {
margin: 0;
padding: 0;
font-family: 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
background-color: var(--bg-dark);
color: var(--text-main);
line-height: 1.6;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
}

/* Centers your entire website */
.pinnacle-container {
max-width: var(--container-width);
margin: 0 auto;
padding: 0 20px;
box-sizing: border-box;
width: 100%;
}

/* ==========================================================================
2. Sticky, Seamless Header & Logo
========================================================================== */
.site-header {
background-color: rgba(2, 8, 23, 0.85);
backdrop-filter: blur(12px);
border-bottom: 1px solid var(--border-subtle);
padding: 15px 0;
position: sticky;
top: 0;
z-index: 1000;
}

.header-grid {
display: grid;
/* FIX: Force the logo column to max 250px so it can never crush the menu again */
grid-template-columns: minmax(150px, 250px) 1fr auto;
align-items: center;
gap: 30px;
}

.site-branding {
display: flex;
flex-direction: column;
justify-content: center;
}

/* FIX: Bulletproof Logo Constraints */
.site-branding img,
.custom-logo-link img,
.custom-logo {
max-width: 100% !important;
max-height: 45px !important; /* Strict height limit for a sleek SaaS look */
height: auto !important;
width: auto !important;
display: block;
object-fit: contain;
}

.site-branding h1 {
margin: 0;
font-size: 1.6rem;
font-weight: 700;
letter-spacing: -0.5px;
}

.site-branding a {
text-decoration: none;
color: #ffffff;
}

/* ==========================================================================
3. Navigation & Buttons
========================================================================== */
.structural-menu ul {
list-style: none;
margin: 0;
padding: 0;
display: flex;
gap: 30px;
}

.structural-menu a {
text-decoration: none;
color: var(--text-main);
font-weight: 500;
font-size: 0.95rem;
transition: color 0.2s;
}

.structural-menu a:hover {
color: var(--accent-blue);
}

.header-actions {
display: flex;
align-items: center;
gap: 20px;
}

.btn-primary {
background-color: var(--accent-blue);
color: #ffffff;
padding: 10px 24px;
border-radius: 50px;
text-decoration: none;
font-weight: 600;
font-size: 0.95rem;
transition: all 0.3s ease;
border: 1px solid transparent;
display: inline-block;
white-space: nowrap; /* Prevents text from wrapping into a circle */
}

.btn-primary:hover {
background-color: #2563eb;
box-shadow: 0 0 15px var(--accent-glow);
}

.btn-outline {
background-color: transparent;
color: #ffffff;
padding: 10px 24px;
border-radius: 50px;
text-decoration: none;
font-weight: 600;
font-size: 0.95rem;
border: 1px solid var(--border-subtle);
transition: all 0.3s ease;
display: inline-block;
}

.btn-outline:hover {
background-color: rgba(255,255,255,0.05);
}

/* ==========================================================================
4. Cards & Grids
========================================================================== */
.data-card {
background: var(--bg-card);
border: 1px solid var(--border-subtle);
border-radius: 12px;
padding: 25px;
transition: transform 0.2s, box-shadow 0.2s;
}

.data-card:hover {
transform: translateY(-5px);
box-shadow: 0 10px 30px var(--accent-glow);
border-color: rgba(59, 130, 246, 0.3);
}

.data-grid {
display: grid;
grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
gap: 24px;
}