/* Wilson Geophysics – Atom Series */

:root {
    --wg-red: #a52a2a;
    --wg-red-dark: #8b2222;
    --wg-green: #198754;
    --wg-gray-bg: #f0f0f0;
    --wg-gray-box: #e8e8e8;
}

body {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    background: #fff;
    position: relative;
    z-index: 1;
}

.navbar-brand img {
    max-height: 50px;
    width: auto;
}

/* Nav: active link with red underline */
.wg-nav .nav-link.active {
    color: var(--wg-red) !important;
    border-bottom: 2px solid var(--wg-red);
    padding-bottom: 0.4rem;
}

.wg-nav .nav-link {
    color: #333 !important;
}

.wg-nav .nav-link:hover {
    color: var(--wg-red) !important;
}

/* Hero – two columns, with supplied background image */
.wg-hero-new {
    min-height: calc(100vh - 56px);
    display: flex;
    align-items: center;
    padding: 3rem 0;
    background-color: var(--wg-gray-bg);
    background-image: url("images/ChatGPT%20Image%20Feb%2023%2C%202026%2C%2007_23_26%20PM.png");
    background-size: cover;
    background-position: center right;
    background-repeat: no-repeat;
}

.wg-hero-new-title {
    font-size: clamp(2rem, 5vw, 3.25rem);
    font-weight: 700;
    color: #1a1a1a;
    margin: 0 0 0.35rem 0;
}

.wg-hero-new-subtitle {
    font-size: 1.15rem;
    color: #333;
    margin: 0 0 1.25rem 0;
}

.wg-hero-new-tagline {
    color: #000;
    font-weight: 700;
    font-size: 1.75rem;
    margin-bottom: 4.5rem;
}

.wg-hero-new-features {
    font-size: 1rem;
    color: #333;
}

.wg-hero-new-features li {
    margin-bottom: 0.6rem;
    display: flex;
    align-items: center;
    gap: 0.6rem;
}

.wg-check {
    display: inline-block;
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
    background: var(--wg-green);
    border-radius: 50%;
    position: relative;
}

.wg-check::after {
    content: '';
    position: absolute;
    left: 0.35rem;
    top: 0.15rem;
    width: 0.4rem;
    height: 0.65rem;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

.wg-btn-primary {
    background-color: var(--wg-red-dark);
    border-color: var(--wg-red-dark);
    color: #fff;
    font-weight: 600;
    border-radius: 8px;
}

.wg-btn-primary:hover {
    background-color: var(--wg-red);
    border-color: var(--wg-red);
    color: #fff;
}

.wg-btn-outline {
    background: #fff;
    border: 2px solid var(--wg-red);
    color: var(--wg-red);
    font-weight: 600;
    border-radius: 8px;
}

.wg-btn-outline:hover {
    background: rgba(165, 42, 42, 0.08);
    border-color: var(--wg-red);
    color: var(--wg-red);
}

.wg-hero-new-img {
    max-width: 100%;
    height: auto;
}

/* Second section panel – title, headings, paragraphs, list with checkmarks */
.wg-panel {
    color: #333;
}

.wg-panel-title {
    font-size: clamp(1.5rem, 3.5vw, 2rem);
    font-weight: 700;
    color: #1a1a1a;
    margin: 0 0 1.25rem 0;
    line-height: 1.25;
}

.wg-panel-heading {
    font-size: 1.1rem;
    font-weight: 700;
    color: #1a1a1a;
    margin: 1.5rem 0 0.75rem 0;
}

.wg-panel-heading:first-of-type {
    margin-top: 0;
}

.wg-panel-p {
    font-size: 1rem;
    font-weight: 400;
    color: #444;
    margin: 0 0 0.75rem 0;
    line-height: 1.55;
}

.wg-panel-list {
    margin-top: 1rem;
}

.wg-panel-list li {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    margin-bottom: 1.5rem;
}

.wg-panel-list li:last-child {
    margin-bottom: 0;
}

.wg-panel-dash {
    color: #000;
    font-weight: 700;
    flex-shrink: 0;
    margin-top: 0.2rem;
}

.wg-panel-item-text {
    display: block;
    flex: 1;
}

.wg-panel-item-title {
    display: block;
    font-weight: 700;
    color: #1a1a1a;
    font-size: 1rem;
    margin-bottom: 0.25rem;
}

.wg-panel-item-desc {
    display: block;
    font-weight: 400;
    color: #555;
    font-size: 0.9375rem;
    line-height: 1.5;
}

/* Green checkmark (used in panel list) */
.wg-check {
    display: inline-block;
    width: 1.25rem;
    height: 1.25rem;
    flex-shrink: 0;
    background: var(--wg-green);
    border-radius: 50%;
    position: relative;
}

.wg-check::after {
    content: '';
    position: absolute;
    left: 0.35rem;
    top: 0.15rem;
    width: 0.4rem;
    height: 0.65rem;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}

/* Second image: fade in on scroll */
.wg-fade-in {
    transition: opacity 0.6s ease-out, transform 0.6s ease-out;
    max-width: 85%;
    margin-left: auto;
    margin-right: auto;
}

.wg-fade-in.wg-fade-in--before {
    opacity: 0;
    transform: translateY(24px);
}

.wg-fade-in.wg-fade-in--visible {
    opacity: 1;
    transform: translateY(0);
}

/* Spec sheet */
.wg-spec-heading {
    color: #1a1a1a;
    font-weight: 700;
}

/* Fixed layout so both spec tables share the same column proportions (Bootstrap default is auto width per table). */
.wg-table-spec {
    table-layout: fixed;
    width: 100%;
}

.wg-table-spec th:first-child,
.wg-table-spec td:first-child {
    width: 50%;
    padding-right: 1rem;
    word-wrap: break-word;
}

.wg-table-spec thead th {
    background-color: var(--wg-red-dark);
    color: #fff;
    font-weight: 600;
    border-color: var(--wg-red-dark);
    vertical-align: middle;
}

.wg-table-spec tbody td {
    vertical-align: middle;
    color: #333;
}

.wg-table-spec.table-bordered {
    border-color: #dee2e6;
}

.wg-pfas-callout {
    background: linear-gradient(135deg, rgba(25, 135, 84, 0.08) 0%, rgba(25, 135, 84, 0.14) 100%);
    border: 1px solid rgba(25, 135, 84, 0.35);
    border-left: 4px solid var(--wg-green);
    border-radius: 8px;
    padding: 1rem 1.25rem;
    color: #1a1a1a;
}

.wg-pfas-callout strong:first-child {
    color: var(--wg-green);
    font-size: 1rem;
}

/* Footer — retailer / partner logo */
.wg-retailer-link {
    line-height: 0;
}

.wg-retailer-link:hover {
    opacity: 0.88;
}

.wg-retailer-logo {
    max-height: 52px;
    max-width: min(240px, 100%);
    width: auto;
    height: auto;
    display: block;
}