/* Rheinol official-inspired visual system: restrained blue, clean white space, precise geometry. */
:root {
    --navy-950: #071b36;
    --navy-900: #0d2e63;
    --navy-800: #123b78;
    --navy-700: #18467f;
    --brand-700: #123b78;
    --brand-600: #194b8e;
    --brand-500: #2b5f9e;
    --brand-100: #dfe8f3;
    --brand-50: #f1f5f9;
    --gold-500: #b18a46;
    --gold-100: #f5efe3;
    --ink: #17202c;
    --muted: #66717f;
    --line: #dfe4ea;
    --surface: #ffffff;
    --canvas: #f6f7f9;
    --radius-sm: 6px;
    --radius-md: 10px;
    --radius-lg: 16px;
    --shadow-sm: 0 6px 20px rgba(18, 42, 73, .06);
    --shadow-md: 0 14px 36px rgba(18, 42, 73, .10);
}

body {
    background: var(--canvas);
    color: var(--ink);
}

.container { max-width: 1320px; }
.section-space { padding: 96px 0; }
.section-space-sm { padding: 72px 0; }
.surface-section { background: #fff; }

.eyebrow {
    margin-bottom: 14px;
    color: var(--brand-600);
    font-size: .76rem;
    letter-spacing: .02em;
}

.eyebrow::before {
    width: 22px;
    height: 3px;
}

.section-heading {
    max-width: 760px;
    margin-bottom: 38px;
}

.section-heading h2 {
    margin-bottom: 12px;
    color: var(--navy-900);
    font-size: clamp(2rem, 3.4vw, 3.15rem);
    letter-spacing: -.025em;
}

.section-heading p { font-size: 1rem; }

.btn {
    border-radius: 6px;
    box-shadow: none;
    transition: background-color .18s ease, border-color .18s ease, color .18s ease;
}

.btn:hover { transform: none; }
.btn-brand,
.btn-primary {
    border-color: var(--brand-700);
    background: var(--brand-700);
    box-shadow: none;
}

.btn-brand:hover,
.btn-primary:hover {
    border-color: #0b2d61;
    background: #0b2d61;
}

.btn-outline-brand {
    border-color: #aab6c5;
    background: #fff;
    color: var(--navy-900);
}

.site-topbar {
    padding: 6px 0;
    background: var(--navy-900);
    color: #d9e2ed;
}

.site-navbar {
    min-height: 88px;
    border-bottom: 1px solid #e7e9ec;
    background: #fff;
    box-shadow: none;
    backdrop-filter: none;
}

.navbar-brand img {
    width: 190px;
    height: 56px;
}

.site-navbar .nav-link {
    color: #2d3744;
    font-weight: 700;
}

.site-navbar .nav-link::after {
    bottom: 0;
    height: 3px;
    border-radius: 0;
    background: var(--brand-700);
}

.nav-icon-btn,
.navbar-toggler { border-radius: 6px; }

.hero-section {
    min-height: 660px;
    background-color: #172434;
    background-image: none;
}

.hero-media {
    position: absolute;
    inset: 0;
    z-index: -2;
    display: block;
}

.hero-media img {
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center;
}

.hero-section::before {
    background: linear-gradient(90deg, rgba(7, 18, 32, .08) 0%, rgba(7, 22, 42, .30) 44%, rgba(7, 27, 54, .94) 100%);
}

.hero-section::after { display: none; }

.hero-content {
    max-width: 540px;
    padding: 88px 0;
}

.hero-kicker {
    gap: 8px;
    margin-bottom: 20px;
    padding: 0 0 0 12px;
    border: 0;
    border-left: 3px solid var(--gold-500);
    border-radius: 0;
    background: transparent;
    color: #fff;
    font-size: .82rem;
    backdrop-filter: none;
}

.hero-content h1 {
    max-width: 520px;
    margin-bottom: 20px;
    font-size: clamp(3rem, 4.6vw, 4.35rem);
    letter-spacing: -.04em;
    line-height: 1.16;
}

.hero-content h1 span { color: #d8e4f3; }
.hero-content > p {
    max-width: 520px;
    margin-bottom: 30px;
    color: #d7dee7;
    font-size: 1.06rem;
}

.hero-proof {
    gap: 22px;
    margin-top: 38px;
    padding-top: 20px;
    border-top-color: rgba(255, 255, 255, .22);
}

.hero-proof i { color: #fff; }

.trust-strip {
    margin-top: 0;
    background: #fff;
    border-bottom: 1px solid var(--line);
}

.trust-strip-inner {
    border: 0;
    border-radius: 0;
    box-shadow: none;
}

.trust-item { padding: 25px 22px; }
.trust-item i,
.feature-panel i,
.category-icon {
    border: 0;
    border-radius: 7px;
    background: var(--brand-50);
    box-shadow: none;
    color: var(--brand-700);
}

.category-card,
.product-card,
.feature-panel,
.certificate-card {
    border-color: var(--line);
    border-radius: 9px;
    box-shadow: none;
}

.category-card {
    min-height: 205px;
    padding: 26px;
}

.category-card::after,
.category-icon::after { display: none; }

.category-icon {
    width: 56px;
    height: 56px;
}

.category-card:hover,
.product-card:hover,
.feature-panel:hover,
.certificate-card:hover {
    border-color: #aebbc9;
    box-shadow: var(--shadow-sm);
    transform: none;
}

.category-card:hover .category-icon {
    background: var(--brand-700);
    box-shadow: none;
    transform: none;
}

.category-meta i,
.product-arrow { border-radius: 5px; }

.finder {
    padding: 44px;
    border-radius: 12px;
    background: var(--brand-700);
}

.finder::before { display: none; }
.finder .form-select {
    border-color: rgba(255, 255, 255, .28);
    border-radius: 6px;
    background-color: rgba(255, 255, 255, .10);
}

.product-media {
    background: #f5f6f8;
}

.product-media::after { opacity: .55; }
.product-card:hover .product-media img { transform: scale(1.02); }
.product-card-body { padding: 20px; }
.product-specs span,
.product-badge,
.product-cart-button { border-radius: 5px; }

.feature-panel { padding: 30px; }
.feature-panel i {
    width: 50px;
    height: 50px;
    margin-bottom: 20px;
}

.story-grid { gap: 64px; }
.story-collage {
    padding: 12px;
    border-color: #d7dde5;
    border-radius: 12px;
    background: #edf1f5;
    box-shadow: none;
}

.story-collage::after { display: none; }
.story-collage img {
    border-color: #d7dde5;
    border-radius: 7px;
    box-shadow: none;
}

.stat-box,
.gallery-card,
.gallery-grid figure,
.site-cta-inner,
.contact-card,
.contact-form-card,
.product-detail-media,
.products-toolbar {
    border-radius: 9px;
}

.gallery-grid { gap: 14px; }
.gallery-grid figure { border-color: #d7dde5; }
.gallery-grid figcaption {
    background: linear-gradient(180deg, transparent, rgba(7, 27, 54, .90));
}

.inner-hero {
    padding: 86px 0;
    background: var(--brand-700);
}

.inner-hero::before { display: none; }
.inner-hero h1 {
    font-size: clamp(2.65rem, 4.2vw, 4rem);
    letter-spacing: -.025em;
}

.site-cta {
    padding: 64px 0;
    background: var(--brand-700);
}

.footer {
    padding-top: 76px;
    background: var(--navy-950);
}

.quality-chips span { border-radius: 4px; }

@media (max-width: 991.98px) {
    .hero-section { min-height: 620px; }
    .hero-content { max-width: 55%; }
    .site-navbar .navbar-collapse { border-radius: 8px; }
}

@media (max-width: 767.98px) {
    .section-space { padding: 68px 0; }
    .section-space-sm { padding: 54px 0; }
    .site-navbar { min-height: 72px; }
    .navbar-brand img { width: 152px; height: 44px; }
    .hero-section {
        min-height: 790px;
        background-color: var(--navy-950);
    }
    .hero-media {
        right: auto;
        bottom: auto;
        width: 100%;
        height: 370px;
        overflow: hidden;
    }
    .hero-media img {
        width: auto;
        min-width: 100%;
        object-position: 22% center;
    }
    .hero-section::before {
        background: linear-gradient(180deg, rgba(7, 20, 38, .08) 0%, rgba(7, 27, 54, .40) 300px, var(--navy-950) 370px, var(--navy-950) 100%);
    }
    .hero-content {
        max-width: 100%;
        padding: 390px 0 54px;
    }
    .hero-content h1 {
        max-width: 520px;
        font-size: clamp(2.35rem, 9vw, 3.15rem);
    }
    .trust-item { padding: 20px; }
    .finder { padding: 30px 22px; }
    .category-card { min-height: 188px; }
}
