@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Manrope:wght@600;700;800&display=swap');
:root {
    --pine:#175c4b;
    --pine-dark:#0d4035;
    --mint:#e3f2ed;
    --red:#b4232c;
    --red-dark:#8e1820;
    --sand:#f6f3ed;
    --paper:#fff;
    --ink:#17201e;
    --muted:#66716e;
    --line:#dde5e1;
    --shadow:0 22px 60px rgba(19,63,52,.12);
    --radius:24px;
    --max:1180px
}
*,*::before,*::after {
    box-sizing:border-box
}
html {
    scroll-behavior:smooth;
    scroll-padding-top:100px
}
body {
    margin:0;
    background:var(--paper);
    color:var(--ink);
    font-family:"DM Sans",Arial,sans-serif;
    font-size:16px;
    line-height:1.65;
    -webkit-font-smoothing:antialiased;
}
body.menu-open {
    overflow:hidden
}
img {
    display:block;
    max-width:100%
}
a {
    color:inherit;
    text-decoration:none
}
button {
    font:inherit
}
a:focus-visible,button:focus-visible {
    outline:3px solid #e0ad50;
    outline-offset:3px
}
.wrap {
    width:min(calc(100% - 40px),var(--max));
    margin-inline:auto
}
.skip-link {
    position:fixed;
    left:16px;
    top:-80px;
    z-index:9999;
    background:#fff;
    padding:12px 18px;
    border-radius:10px;
    box-shadow:var(--shadow)
}
.skip-link:focus {
    top:16px
}
.eyebrow {
    display:inline-flex;
    align-items:center;
    gap:9px;
    color:var(--pine);
    font-size:.78rem;
    font-weight:800;
    letter-spacing:.13em;
    text-transform:uppercase
}
.eyebrow::before {
    content:"";
    width:24px;
    height:2px;
    background:currentColor
}
h1,h2,h3,h4 {
    font-family:Manrope,"DM Sans",sans-serif;
    line-height:1.12;
    margin:0;
    letter-spacing:-.035em
}
h2 {
    font-size:clamp(2rem,4vw,3.15rem)
}
p {
    margin:0
}
.muted {
    color:var(--muted)
}
.btn {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    min-height:50px;
    padding:12px 20px;
    border:1px solid transparent;
    border-radius:14px;
    font-weight:700;
    transition:transform .2s,box-shadow .2s,background .2s,color .2s
}
.btn:hover {
    transform:translateY(-2px)
}
.btn-primary {
    background:var(--red);
    color:#fff;
    box-shadow:0 12px 28px rgba(180,35,44,.22)
}
.btn-primary:hover {
    background:var(--red-dark)
}
.btn-light {
    background:#fff;
    color:var(--pine-dark);
    box-shadow:0 12px 28px rgba(4,38,31,.16)
}
.btn-outline {
    border-color:rgba(255,255,255,.45);
    color:#fff;
    background:rgba(255,255,255,.08)
}
.btn-outline:hover {
    background:#fff;
    color:var(--pine-dark)
}
.icon {
    width:22px;
    height:22px;
    fill:none;
    stroke:currentColor;
    stroke-width:1.9;
    stroke-linecap:round;
    stroke-linejoin:round;
    flex:none
}
header {
    position:sticky;
    top:0;
    z-index:100;
    background:rgba(255,255,255,.92);
    backdrop-filter:blur(16px);
    border-bottom:1px solid rgba(221,229,225,.8)
}
.nav-shell {
    height:82px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:28px
}
.brand {
    display:flex;
    align-items:center;
    gap:12px;
    min-width:max-content
}
.brand img {
    width:46px;
    height:46px;
    object-fit:contain
}
.brand strong {
    display:block;
    font-family:Manrope,sans-serif;
    font-size:1rem;
    line-height:1.15
}
.brand span {
    display:block;
    color:var(--pine);
    font-size:.72rem;
    font-weight:700;
    margin-top:3px
}
nav {
    margin-left:auto
}
site-nav {
    display:block;
    margin-left:auto
}
nav ul {
    display:flex;
    align-items:center;
    gap:30px;
    list-style:none;
    padding:0;
    margin:0
}
nav a {
    position:relative;
    font-weight:700;
    font-size:.9rem;
    color: black;
}
nav a::after {
    content:"";
    position:absolute;
    left:0;
    right:100%;
    bottom:-9px;
    height:2px;
    background:var(--red);
    transition:right .2s
}
nav a:hover::after {
    right:0
}
.nav-call {
    display:flex;
    align-items:center;
    gap:9px;
    background:var(--red);
    color:#fff;
    padding:11px 16px;
    border-radius:12px;
    font-size:.88rem;
    font-weight:800
}
.nav-call:hover {
    background:var(--pine-dark)
}
.menu-toggle {
    display:none;
    border:0;
    background:var(--sand);
    width:46px;
    height:46px;
    border-radius:12px;
    color:var(--ink);
    cursor:pointer
}
.hero {
    position:relative;
    isolation:isolate;
    overflow:hidden;
    background:linear-gradient(125deg,#0c4136 0%,#17614f 58%,#1f725c 100%);
    color:#fff;
    padding:96px 0 88px
}
.hero::before,.hero::after {
    content:"";
    position:absolute;
    z-index:-1;
    border-radius:50%
}
.hero::before {
    width:560px;
    height:560px;
    right:-160px;
    top:-310px;
    border:110px solid rgba(255,255,255,.06)
}
.hero::after {
    width:300px;
    height:300px;
    left:-120px;
    bottom:-190px;
    background:rgba(215,239,229,.08)
}
.hero-grid {
    display:grid;
    grid-template-columns:1.2fr .8fr;
    align-items:center;
    gap:70px
}
.hero .eyebrow {
    color:#bde5d8
}
.hero h1 {
    font-size:clamp(2.8rem,5.7vw,5.15rem);
    max-width:760px;
    margin:18px 0 24px
}
.hero h1 em {
    font-style:normal;
    color:#d7efe7
}
.hero-copy {
    max-width:650px;
    color:#d9e9e4;
    font-size:clamp(1.03rem,1.6vw,1.2rem)
}
.hero-actions {
    display:flex;
    flex-wrap:wrap;
    gap:12px;
    margin-top:34px
}
.trust-row {
    display:flex;
    flex-wrap:wrap;
    gap:24px;
    margin-top:42px;
    color:#c8dfd8;
    font-size:.85rem;
    font-weight:700
}
.trust-item {
    display:flex;
    align-items:center;
    gap:8px
}
.trust-dot {
    width:8px;
    height:8px;
    border-radius:50%;
    background:#83d6b9;
    box-shadow:0 0 0 5px rgba(131,214,185,.12)
}
.hero-card {
    background:#fff;
    color:var(--ink);
    border-radius:var(--radius);
    padding:28px;
    box-shadow:0 30px 70px rgba(2,28,23,.25);
}
.hero-card-top {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    padding-bottom:20px;
    border-bottom:1px solid var(--line)
}
.hero-card h2 {
    font-size:1.25rem
}
.status {
    display:inline-flex;
    align-items:center;
    gap:7px;
    padding:7px 10px;
    border-radius:999px;
    font-size:.74rem;
    font-weight:800
}
.status.open {
    background:#e4f6ed;
    color:#137049
}
.status.closed {
    background:#fbe8e9;
    color:#9b2027
}
.status::before {
    content:"";
    width:7px;
    height:7px;
    border-radius:50%;
    background:currentColor
}
.hours-list {
    display:grid;
    gap:0;
    padding:14px 0
}
.hours-row {
    display:flex;
    justify-content:space-between;
    gap:16px;
    padding:9px 0;
    color:var(--black);
    font-size:.9rem
}
.hours-row strong {
    color:var(--ink)
}
.hero-card .btn {
    width:100%;
    margin-top:5px
}
.quickbar {
    position:relative;
    z-index:5;
    margin-top:-28px
}
.quick-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    background:#fff;
    border:1px solid var(--line);
    border-radius:18px;
    box-shadow:var(--shadow);
    overflow:hidden
}
.quick-item {
    display:flex;
    align-items:center;
    gap:14px;
    padding:22px 24px
}
.quick-item+.quick-item {
    border-left:1px solid var(--line)
}
.quick-icon {
    display:grid;
    place-items:center;
    width:42px;
    height:42px;
    border-radius:12px;
    background:var(--mint);
    color:var(--pine)
}
.quick-item small {
    display:block;
    color:var(--muted);
    font-size:.72rem;
    font-weight:700;
    text-transform:uppercase;
    letter-spacing:.08em
}
.quick-item strong {
    font-size:.93rem
}
main section {
    padding:104px 0
}
.section-head {
    display:flex;
    justify-content:space-between;
    align-items:end;
    gap:32px;
    margin-bottom:44px
}
.section-head>div {
    max-width:690px
}
.section-head .eyebrow {
    margin-bottom:14px
}
.section-head p {
    max-width:470px;
    color:var(--muted)
}
.values {
    background:var(--sand)
}
.value-grid {
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:16px
}
.value-card {
    background:#fff;
    border:1px solid rgba(221,229,225,.8);
    border-radius:20px;
    padding:28px;
    transition:transform .25s,box-shadow .25s
}
.value-card:hover {
    transform:translateY(-5px);
    box-shadow:0 18px 40px rgba(19,63,52,.09)
}
.value-icon {
    display:grid;
    place-items:center;
    width:50px;
    height:50px;
    border-radius:15px;
    background:var(--mint);
    color:var(--pine);
    margin-bottom:28px
}
.value-card h3 {
    font-size:1.08rem;
    margin-bottom:10px
}
.value-card p {
    color:var(--muted);
    font-size:.91rem
}
.service-grid {
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:20px
}
.service-card {
    position:relative;
    overflow:hidden;
    min-height:280px;
    border-radius:22px;
    padding:30px;
    background:#f7faf9;
    border:1px solid var(--line);
    display:flex;
    flex-direction:column
}
.service-card:first-child {
    background:var(--pine);
    color:#fff;
    border-color:var(--pine)
}
.service-number {
    font-family:Manrope,sans-serif;
    font-size:.74rem;
    font-weight:800;
    opacity:.55
}
.service-card .value-icon {
    margin:30px 0 24px
}
.service-card:first-child .value-icon {
    background:rgba(255,255,255,.14);
    color:#fff
}
.service-card h3 {
    font-size:1.3rem;
    margin-bottom:10px
}
.service-card p {
    font-size:.92rem;
    color:var(--muted)
}
.service-card:first-child p {
    color:#d2e5df
}
.service-link {
    display:inline-flex;
    align-items:center;
    gap:7px;
    margin-top:auto;
    padding-top:24px;
    color:var(--pine);
    font-weight:800;
    font-size:.86rem
}
.service-card:first-child .service-link {
    color:#fff
}
.service-link span {
    transition:transform .2s
}
.service-link:hover span {
    transform:translateX(4px)
}
.topics {
    margin-top:36px;
    padding:28px;
    border:1px solid var(--line);
    border-radius:20px
}
.topics h3 {
    text-align:center;
    font-size:1rem;
    margin-bottom:18px
}
.tag-list {
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:9px
}
.tag {
    background:var(--sand);
    border-radius:999px;
    padding:8px 13px;
    color:#4b5754;
    font-size:.82rem;
    font-weight:700
}
.erezept {
    padding:48px 0 0!important;
    background:linear-gradient(to bottom,#fff 0 68%,var(--pine-dark) 68% 100%)
}
.erezept-card {
    position:relative;
    overflow:hidden;
    display:grid;
    grid-template-columns:auto 1fr auto;
    align-items:center;
    gap:24px;
    background:var(--red);
    color:#fff;
    padding:32px 36px;
    border-radius:22px;
    box-shadow:0 18px 42px rgba(180,35,44,.2)
}
.erezept-card::after {
    content:"";
    position:absolute;
    width:180px;
    height:180px;
    border:45px solid rgba(255,255,255,.07);
    border-radius:50%;
    right:90px;
    top:-85px
}
.erezept-icon {
    display:grid;
    place-items:center;
    width:58px;
    height:58px;
    border-radius:17px;
    background:rgba(255,255,255,.14)
}
.erezept-card h2 {
    font-size:1.35rem;
    margin-bottom:4px
}
.erezept-card p {
    color:#f8dfe1;
    font-size:.92rem
}
.erezept-card .btn {
    position:relative;
    z-index:1
}
.facts {
    background:var(--pine-dark);
    color:#fff;
    padding-top:76px
}
.facts .section-head p {
    color:#bdd2cc
}
.facts .eyebrow {
    color:#91cfbb
}
.fact-grid {
    display:grid;
    grid-template-columns:repeat(6,1fr);
    gap:12px
}
.fact {
    padding:24px 12px;
    text-align:center;
    border:1px solid rgba(255,255,255,.12);
    border-radius:16px;
    background:rgba(255,255,255,.045)
}
.fact .icon {
    width:25px;
    height:25px;
    margin:0 auto 13px;
    color:#9fdbc7
}
.fact span {
    display:block;
    font-size:.8rem;
    font-weight:800
}
.contact-grid {
    display:grid;
    grid-template-columns:.75fr 1.25fr;
    gap:24px
}
.contact-panel {
    background:var(--sand);
    border-radius:22px;
    padding:34px
}
.contact-panel .eyebrow {
    margin-bottom:14px
}
.contact-panel h2 {
    font-size:2rem;
    margin-bottom:14px
}
.contact-panel>p {
    color:var(--muted);
    margin-bottom:28px
}
.contact-list {
    display:grid;
    gap:12px
}
.contact-link {
    display:flex;
    align-items:center;
    gap:14px;
    background:#fff;
    border:1px solid var(--line);
    border-radius:14px;
    padding:14px
}
.contact-link .quick-icon {
    flex:none
}
.contact-link small {
    display:block;
    color:var(--muted);
    font-size:.71rem
}
.contact-link strong {
    font-size:.9rem
}
.map {
    min-height:470px;
    width:100%;
    border:0;
    border-radius:22px;
    filter:saturate(.82) contrast(.95)
}
.home-location {
    position:relative;
    background:var(--sand);
    padding:104px 0 112px;
    border-radius:44px 44px 0 0;
    margin-top:-1px
}
.home-location .contact-panel {
    background:#fff;
    border:1px solid var(--line);
    box-shadow:0 18px 45px rgba(13,64,53,.08)
}
.home-location .map {
    min-height:510px;
    box-shadow:0 18px 45px rgba(13,64,53,.12)
}
.location-btn {
    width:100%;
    margin-top:22px
}
footer {
    background:#101a18;
    color:#aeb9b6;
    padding:64px 0 24px
}
.footer-grid {
    display:grid;
    grid-template-columns:1.5fr .7fr 1fr 1fr;
    gap:48px
}
.footer-brand {
    margin-bottom:18px
}
.footer-brand strong {
    color:#fff
}
.footer-brand span {
    color:#91cfbb
}
.footer-copy {
    font-size:.88rem;
    max-width:330px
}
.footer-title {
    color:#fff;
    font-family:Manrope,sans-serif;
    font-size:.9rem;
    font-weight:800;
    margin-bottom:18px
}
.footer-links {
    list-style:none;
    margin:0;
    padding:0;
    display:grid;
    gap:10px
}
.footer-links a {
    font-size:.87rem
}
.footer-links a:hover {
    color:#fff
}
.footer-hours {
    display:flex;
    justify-content:space-between;
    gap:14px;
    padding:8px 0;
    border-bottom:1px solid rgba(255,255,255,.08);
    font-size:.82rem
}
.footer-bottom {
    display:flex;
    justify-content:space-between;
    align-items:center;
    gap:20px;
    margin-top:52px;
    padding-top:22px;
    border-top:1px solid rgba(255,255,255,.09);
    font-size:.76rem
}
.legal {
    display:flex;
    flex-wrap:wrap;
    gap:18px
}
.legal a:hover {
    color:#fff
}
.mobile-call {
    display:none
}
.reveal {
    opacity:0;
    transform:translateY(18px);
    transition:opacity .65s ease,transform .65s ease
}
.reveal.visible {
    opacity:1;
    transform:none
}
@media (prefers-reduced-motion:reduce) {
    html {
        scroll-behavior:auto
    }
    .reveal {
        opacity:1;
        transform:none;
        transition:none
    }
    .btn,.value-card {
        transition:none
    }
}
@media(max-width:980px) {
    .nav-call {
        display:none
    }
    .hero-grid {
        grid-template-columns:1fr;
        gap:48px
    }
    .hero-card {
        max-width:560px;
        transform:none
    }
    .value-grid {
        grid-template-columns:repeat(2,1fr)
    }
    .fact-grid {
        grid-template-columns:repeat(3,1fr)
    }
    .contact-grid {
        grid-template-columns:1fr
    }
    .footer-grid {
        grid-template-columns:1.3fr 1fr 1fr
    }
    .footer-grid>div:last-child {
        grid-column:2/4
    }
}
@media(max-width:760px) {
    .wrap {
        width:min(calc(100% - 28px),var(--max))
    }
    .nav-shell {
        height:72px
    }
    .brand img {
        width:40px;
        height:40px
    }
    nav {
        display:none;
        position:fixed;
        inset:72px 0 0;
        background:rgba(255,255,255,.98);
        padding:32px 24px
    }
    nav.open {
        display:block
    }
    nav ul {
        align-items:stretch;
        flex-direction:column;
        gap:0
    }
    nav a {
        display:block;
        padding:15px 2px;
        border-bottom:1px solid var(--line);
        font-size:1.05rem
    }
    .menu-toggle {
        display:grid;
        place-items:center
    }
    .hero {
        padding:64px 0 78px
    }
    .hero h1 {
        font-size:clamp(2.55rem,12vw,4rem)
    }
    .hero-actions {
        flex-direction:column
    }
    .hero-actions .btn {
        width:100%
    }
    .trust-row {
        gap:14px 20px;
        margin-top:30px
    }
    .quickbar {
        margin-top:-34px
    }
    .quick-grid {
        grid-template-columns:1fr
    }
    .quick-item {
        padding:17px 20px
    }
    .quick-item+.quick-item {
        border-left:0;
        border-top:1px solid var(--line)
    }
    main section {
        padding:76px 0
    }
    .section-head {
        display:block
    }
    .section-head p {
        margin-top:16px
    }
    .value-grid,.service-grid {
        grid-template-columns:1fr
    }
    .value-card {
        padding:24px
    }
    .erezept-card {
        grid-template-columns:auto 1fr;
        padding:25px 20px
    }
    .erezept-card .btn {
        grid-column:1/-1;
        width:100%
    }
    .fact-grid {
        grid-template-columns:repeat(2,1fr)
    }
    .contact-panel {
        padding:27px 22px
    }
    .map {
        min-height:360px
    }
    .home-location {
        padding:76px 0 82px;
        border-radius:28px 28px 0 0
    }
    .home-location .map {
        min-height:360px
    }
    .footer-grid {
        grid-template-columns:1fr 1fr;
        gap:38px 26px
    }
    .footer-grid>div:first-child {
        grid-column:1/-1
    }
    .footer-grid>div:last-child {
        grid-column:auto
    }
    .footer-bottom {
        align-items:flex-start;
        flex-direction:column
    }
    .mobile-call {
        display:flex;
        position:fixed;
        z-index:90;
        bottom:14px;
        left:14px;
        right:14px;
        background:var(--red);
        color:#fff;
        align-items:center;
        justify-content:center;
        gap:9px;
        padding:14px;
        border-radius:14px;
        font-weight:800;
        box-shadow:0 12px 35px rgba(103,14,20,.32)
    }
    body {
        padding-bottom:78px
    }
}
@media(max-width:430px) {
    .brand strong {
        font-size:.9rem
    }
    .brand span {
        font-size:.64rem
    }
    .hero-card {
        padding:22px
    }
    .footer-grid {
        grid-template-columns:1fr
    }
    .footer-grid>div:first-child {
        grid-column:auto
    }
}
@media(max-width:360px) {
    .fact-grid {
        grid-template-columns:1fr
    }
}