/*
 * Ignition: custom CSS that Tailwind utilities do not cover.
 * Utilities live in tailwind.css (compiled). Edit this file by hand.
 */

body { font-family: 'Inter', system-ui, sans-serif; }
.glass-card {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(226, 232, 240, 0.8);
}
.dark-glass {
    background: rgba(11, 25, 44, 0.75);
    backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.1);
}
.gradient-border {
    border-image: linear-gradient(to right, #FF6B00, #1E3A8A) 1;
}
.gradient-text {
    background: linear-gradient(135deg, #FF6B00 0%, #F59E0B 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.gradient-navy-text {
    background: linear-gradient(135deg, #0B192C 0%, #1E3A8A 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.tab-active {
    color: #FF6B00 !important;
    border-bottom: 2px solid #FF6B00;
}
section[id] { scroll-margin-top: 6rem; }
details > summary::-webkit-details-marker { display: none; }
/* Custom Scrollbar */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: #f1f5f9; }
::-webkit-scrollbar-thumb { background: #cbd5e1; border-radius: 4px; }
::-webkit-scrollbar-thumb:hover { background: #94a3b8; }


/* Placeholder photo (replace with real photography; see README). */
.ph-photo { background-image: url("../img/placeholder-team.jpg"); }

/* Keep the sticky header below the WordPress admin bar. */
.admin-bar header.sticky { top: 32px; }
@media (max-width: 782px) { .admin-bar header.sticky { top: 46px; } }

/* Basic styling for standard WordPress pages (privacy, terms, etc.). */
.entry-content > * + * { margin-top: 1rem; }
.entry-content h2 { font-size: 1.5rem; font-weight: 800; color: #0B192C; margin-top: 2rem; }
.entry-content h3 { font-size: 1.15rem; font-weight: 700; color: #0B192C; margin-top: 1.5rem; }
.entry-content ul { list-style: disc; padding-left: 1.5rem; }
.entry-content ol { list-style: decimal; padding-left: 1.5rem; }
.entry-content a { color: #FF6B00; text-decoration: underline; }
.entry-content img { max-width: 100%; height: auto; }

/* Squeeze page: sticky mobile bar slide-in. */
#sticky-cta { transition: transform .25s ease; }

/* ---------- Engine page: Pillars side tabs ---------- */
.pillar-tab[aria-selected="true"] {
	background: #0B192C;
	border-color: #0B192C;
	color: #fff;
	box-shadow: 0 10px 15px -3px rgba(11, 25, 44, .25);
	z-index: 1;
}
.pillar-tab[aria-selected="true"] .pillar-ico { background: #FF6B00; color: #fff; }
.pillar-tab[aria-selected="true"] .pillar-tag { color: #cbd5e1; }
.pillar-tab[aria-selected="true"] .pillar-arrow {
	background: #FF6B00;
	color: #fff;
	animation: pillar-nudge 1.6s ease-in-out infinite;
}

/* Pointer notch aimed at the content card: down on mobile, right on desktop. */
.pillar-notch { display: none; }
.pillar-tab[aria-selected="true"] .pillar-notch {
	display: block;
	position: absolute;
	width: 16px;
	height: 16px;
	background: #0B192C;
	border-radius: 3px;
	left: 50%;
	bottom: -7px;
	transform: translateX(-50%) rotate(45deg);
}
@media (min-width: 768px) {
	.pillar-tab[aria-selected="true"] .pillar-notch {
		left: auto;
		bottom: auto;
		right: -7px;
		top: 50%;
		transform: translateY(-50%) rotate(45deg);
	}
}

/* Panel slides in from the pillar it belongs to. */
.pillar-panel:not([hidden]) { animation: pillar-in-down .22s ease; }
@media (min-width: 768px) {
	.pillar-panel:not([hidden]) { animation-name: pillar-in-right; }
}
@keyframes pillar-in-down { from { opacity: 0; transform: translateY(-10px); } to { opacity: 1; transform: none; } }
@keyframes pillar-in-right { from { opacity: 0; transform: translateX(-14px); } to { opacity: 1; transform: none; } }
@keyframes pillar-nudge { 0%, 100% { transform: translateX(0); } 50% { transform: translateX(3px); } }
@media (prefers-reduced-motion: reduce) {
	.pillar-panel:not([hidden]), .pillar-tab[aria-selected="true"] .pillar-arrow { animation: none; }
}

/* Main navigation: Services-style dropdowns (see inc/class-ignition-nav-walker.php). */
.ig-has-sub { position: relative; display: inline-flex; align-items: center; border-radius: .5rem; transition: background-color .15s, color .15s; }
.ig-has-sub:hover, .ig-has-sub.open, .ig-has-sub:focus-within { background: #F8FAFC; color: #0B192C; }
.ig-has-sub.is-current { color: #FF6B00; background: #F1F5F9; }
.ig-lk { font: inherit; font-weight: 600; color: inherit; text-decoration: none; padding: .5rem .25rem .5rem 1rem; background: none; border: 0; cursor: pointer; border-radius: .5rem; }
.ig-lk-btn { padding-right: .25rem; }
.ig-chev { background: none; border: 0; color: inherit; cursor: pointer; padding: .5rem .65rem .5rem .1rem; border-radius: .5rem; display: inline-flex; align-items: center; }
.ig-chev svg { width: 12px; height: 12px; transition: transform .2s; }
.ig-has-sub:hover .ig-chev svg, .ig-has-sub.open .ig-chev svg, .ig-has-sub:focus-within .ig-chev svg { transform: rotate(180deg); }
.ig-has-sub .ig-lk:focus-visible, .ig-chev:focus-visible, .ig-drop-link:focus-visible { outline: 2px solid #FF6B00; outline-offset: 2px; }
/* Invisible bridge keeps the menu open while the pointer crosses the gap. */
.ig-has-sub::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 10px; }
.ig-drop { position: absolute; top: calc(100% + 8px); left: 50%; transform: translate(-50%, 6px); min-width: 260px; background: #fff; border: 1px solid #E2E8F0; border-radius: .875rem; box-shadow: 0 12px 32px rgba(11,25,44,.14); padding: .5rem; opacity: 0; visibility: hidden; transition: opacity .16s, transform .16s, visibility .16s; z-index: 60; white-space: normal; }
.ig-drop::before { content: ""; position: absolute; top: -6px; left: 50%; width: 12px; height: 12px; background: #fff; border-left: 1px solid #E2E8F0; border-top: 1px solid #E2E8F0; transform: translateX(-50%) rotate(45deg); }
.ig-has-sub:hover .ig-drop, .ig-has-sub.open .ig-drop, .ig-has-sub:focus-within .ig-drop { opacity: 1; visibility: visible; transform: translate(-50%, 0); }
.ig-drop-link { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: .625rem .875rem; border-radius: .625rem; color: #0B192C; font-size: .875rem; font-weight: 700; text-decoration: none; text-align: left; }
.ig-drop-link small { font-size: .75rem; font-weight: 500; color: #64748B; }
.ig-drop-link:hover { background: #F8FAFC; }
.ig-drop-link.is-current span { color: #FF6B00; }
/* Forced shut (Escape, or closed with its arrow) until hovered or clicked again. */
.ig-has-sub.ig-closed .ig-drop { opacity: 0; visibility: hidden; transform: translate(-50%, 6px); }
.ig-has-sub.ig-closed .ig-chev svg { transform: none; }
@media (prefers-reduced-motion: reduce) { .ig-drop, .ig-chev svg { transition: none; } }