/*
Theme Name: NaturalMED Therapies
Theme URI: https://naturalmedtherapies.com/
Description: Divi 5 child theme for NaturalMED Therapies.
Author: Frank Rumler
Version: 1.0.0
Template: Divi
Text Domain: naturalmed
*/

/*
last updated: 2026-08-24
*/

:root {
    --nm-blue: #00529B;
    --nm-green: #7BC143;
    --nm-blue-dark: #003f78;
    --nm-green-dark: #5f9f2e;
    --nm-ink: #18313f;
    --nm-text: #344a56;
    --nm-muted: #6c7b83;
    --nm-bg: #ffffff;
    --nm-bg-soft: #f5f9fb;
    --nm-bg-green: #f4faef;
    --nm-border: #dce6eb;
    --nm-radius-sm: .5rem;
    --nm-radius: .875rem;
    --nm-radius-lg: 1.25rem;
    --nm-shadow-sm: 0 .35rem 1.25rem rgba(0, 50, 78, .08);
    --nm-shadow: 0 .7rem 2.25rem rgba(0, 50, 78, .12);
    --nm-transition: 180ms ease;
}

html { scroll-behavior: smooth; }

body {
    color: var(--nm-text);
    background: var(--nm-bg);
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

#page-container { overflow-x: clip; }

::selection {
    background: var(--nm-green);
    color: #fff;
}

a { text-underline-offset: .16em; }

a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline: 3px solid color-mix(in srgb, var(--nm-green) 70%, white);
    outline-offset: 3px;
}

.nm-eyebrow {
    color: var(--nm-blue);
    font-size: .82rem;
    font-weight: 700;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.nm-lead {
    font-size: clamp(1.05rem, .94rem + .45vw, 1.3rem);
    line-height: 1.65;
}

.nm-muted { color: var(--nm-muted); }

.nm-section {
    padding-block: clamp(4rem, 7vw, 7rem);
}

.nm-section--soft { background: var(--nm-bg-soft); }
.nm-section--green { background: var(--nm-bg-green); }

.nm-card {
    height: 100%;
    padding: clamp(1.4rem, 2.5vw, 2rem);
    background: #fff;
    border: 1px solid var(--nm-border);
    border-radius: var(--nm-radius);
    box-shadow: var(--nm-shadow-sm);
    transition:
        transform var(--nm-transition),
        box-shadow var(--nm-transition),
        border-color var(--nm-transition);
}

.nm-card:hover {
    transform: translateY(0px);
    border-color: color-mix(in srgb, var(--nm-blue) 22%, var(--nm-border));
    box-shadow: var(--nm-shadow);
}

.nm-trust-strip {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	max-width: 1380px;
	margin: 0 auto;
	padding: 1.4rem 0;
	background: #F7F3EA;
}

.nm-trust-item {
	text-align: center;
	padding: .7rem 1.25rem;
	border-right: 1px solid rgba(0,82,155,.16);
}

.nm-trust-item:last-child {
	border-right: 0;
}

.nm-trust-item strong {
	display: block;
	color: var(--nm-blue);
	font-size: 1.05rem;
	font-weight: 700;
}

.nm-trust-item span {
	display: block;
	margin-top: .2rem;
	color: var(--nm-muted);
	font-size: .86rem;
}

@media (max-width: 767px) {
	.nm-trust-strip {
		grid-template-columns: repeat(2, 1fr);
	}

	.nm-trust-item:nth-child(2) {
		border-right: 0;
	}

	.nm-trust-item {
		border-bottom: 1px solid rgba(0,82,155,.12);
	}
}

.nm-hero {
	background: var(--nm-blue);
	padding: clamp(3.5rem, 6vw, 6.5rem) 0;
}

.nm-hero-row {
	max-width: 1480px;
	margin: 0 auto;
	align-items: center;
}

.nm-hero-copy {
	padding: clamp(1rem, 3vw, 3rem);
}

.nm-hero-copy h1 {
	color: #fff;
	font-size: clamp(2.4rem, 4.2vw, 4.6rem);
	line-height: 1.05;
	letter-spacing: -.035em;
	max-width: 12ch;
}

.nm-hero-copy p {
	color: rgba(255,255,255,.84);
	max-width: 38rem;
}

.nm-hero-image {
	padding: .65rem;
	background: #F7F3EA;
	border-radius: 1.4rem;
	box-shadow: 0 1.5rem 4rem rgba(0,0,0,.18);
}

.nm-hero-image img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	border-radius: 1rem;
}

.nm-btn,
a.nm-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: .45rem;
    min-height: 3rem;
    padding: .78rem 1.2rem;
    border: 2px solid var(--nm-blue);
    border-radius: var(--nm-radius-sm);
    background: var(--nm-blue);
    color: #fff !important;
    font-weight: 700;
    line-height: 1.2;
    text-decoration: none;
    transition:
        background var(--nm-transition),
        border-color var(--nm-transition),
        transform var(--nm-transition);
}

.nm-btn:hover,
a.nm-btn:hover {
    background: var(--nm-blue-dark);
    border-color: var(--nm-blue-dark);
    transform: translateY(-1px);
}

.nm-btn--green,
a.nm-btn--green {
    background: var(--nm-green);
    border-color: var(--nm-green);
    color: #173016 !important;
}

.nm-btn--green:hover,
a.nm-btn--green:hover {
    background: var(--nm-green-dark);
    border-color: var(--nm-green-dark);
    color: #fff !important;
}

.nm-link {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    color: var(--nm-blue);
    font-weight: 700;
    text-decoration: none;
}

.nm-link::after {
    content: "→";
    transition: transform var(--nm-transition);
}

.nm-link:hover::after { transform: translateX(.2rem); }

.nm-treatment-card {
    position: relative;
    overflow: hidden;
    height: 100%;
    border-radius: var(--nm-radius-lg);
    background: #fff;
    box-shadow: var(--nm-shadow-sm);
}

.nm-treatment-card img {
    width: 100%;
    transition: transform 500ms ease;
}

.nm-treatment-card:hover img { transform: scale(1.035); }

.nm-stars {
    color: var(--nm-green-dark);
    letter-spacing: .08em;
}

.nm-review {
    padding: 1.35rem;
    background: #fff;
    border-left: 4px solid var(--nm-green);
    border-radius: 0 var(--nm-radius-sm) var(--nm-radius-sm) 0;
    box-shadow: var(--nm-shadow-sm);
}

.nm-blue { color: var(--nm-blue) !important; }
.nm-green { color: var(--nm-green-dark) !important; }
.nm-bg-blue { background-color: var(--nm-blue) !important; }
.nm-bg-green { background-color: var(--nm-green) !important; }

@media (max-width: 767px) {
    .nm-section { padding-block: 3.25rem; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }

    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}