/* =========================================================
HISTORY PAGE
THE CURIOUS EXPLORER
========================================================= */

.history-page {


position: relative;

overflow: hidden;

background:
    linear-gradient(
        180deg,
        #fffdf8 0%,
        #f8f5ed 45%,
        #ffffff 100%
    );

color: #17221b;


}

/* =========================================================
HISTORY INTRO
========================================================= */

.history-intro {


position: relative;

min-height: 520px;

display: flex;

align-items: center;

padding: 150px 0 100px;

background:
    linear-gradient(
        135deg,
        rgba(17, 70, 48, .96),
        rgba(36, 104, 70, .90)
    );

overflow: hidden;


}

.history-intro::before {


content: "";

position: absolute;

width: 550px;

height: 550px;

border-radius: 50%;

top: -300px;

right: -120px;

background:
    radial-gradient(
        circle,
        rgba(255, 193, 7, .35),
        transparent 70%
    );

filter: blur(15px);


}

.history-intro::after {


content: "";

position: absolute;

width: 400px;

height: 400px;

border-radius: 50%;

bottom: -250px;

left: -120px;

background:
    radial-gradient(
        circle,
        rgba(0, 188, 212, .30),
        transparent 70%
    );

filter: blur(20px);


}

.history-intro-content {


position: relative;

z-index: 2;

max-width: 850px;

color: #fff;


}

.history-eyebrow {


display: inline-flex;

align-items: center;

gap: 10px;

padding: 9px 18px;

margin-bottom: 25px;

border: 1px solid rgba(255,255,255,.25);

border-radius: 999px;

background: rgba(255,255,255,.10);

backdrop-filter: blur(12px);

color: #FFD54F;

font-size: .85rem;

font-weight: 800;

letter-spacing: 1.5px;

text-transform: uppercase;


}

.history-intro h1 {


margin: 0;

font-family: "Plus Jakarta Sans", sans-serif;

font-size: clamp(3rem, 6vw, 6.5rem);

line-height: 1.02;

font-weight: 800;

letter-spacing: -3px;


}

.history-intro h1 span {


display: block;

color: #FFD54F;


}

.history-intro p {


max-width: 720px;

margin-top: 30px;

margin-bottom: 0;

color: rgba(255,255,255,.88);

font-size: 1.12rem;

line-height: 1.9;


}

/* =========================================================
QUICK FACTS
========================================================= */

.history-facts {


position: relative;

z-index: 5;

margin-top: -55px;

padding-bottom: 90px;


}

.history-fact-card {


position: relative;

min-height: 180px;

padding: 30px 20px;

display: flex;

flex-direction: column;

align-items: center;

justify-content: center;

text-align: center;

border: 1px solid rgba(20,70,45,.08);

border-radius: 25px;

background: rgba(255,255,255,.94);

box-shadow:
    0 20px 50px rgba(30,55,40,.10);

transition:
    transform .4s ease,
    box-shadow .4s ease;


}

.history-fact-card:hover {


transform: translateY(-10px);

box-shadow:
    0 30px 65px rgba(30,55,40,.16);


}

.history-fact-icon {


width: 60px;

height: 60px;

margin-bottom: 15px;

display: flex;

align-items: center;

justify-content: center;

border-radius: 18px;

background:
    linear-gradient(
        135deg,
        #17633f,
        #2e8b57
    );

color: #FFD54F;

font-size: 1.35rem;

box-shadow:
    0 10px 25px rgba(23,99,63,.20);


}

.history-fact-card strong {


display: block;

font-family: "Plus Jakarta Sans", sans-serif;

font-size: 1.4rem;

color: #173d2b;


}

.history-fact-card span {


display: block;

margin-top: 4px;

color: #6b756e;

font-size: .9rem;


}

/* =========================================================
SECTION HEADINGS
========================================================= */

.section-heading {


max-width: 760px;

margin: 0 auto 75px;

text-align: center;


}

.section-heading > span {


display: inline-flex;

align-items: center;

gap: 8px;

margin-bottom: 15px;

color: #2e8b57;

font-size: .85rem;

font-weight: 800;

letter-spacing: 1.5px;

text-transform: uppercase;


}

.section-heading h2 {


margin: 0;

color: #173d2b;

font-family: "Plus Jakarta Sans", sans-serif;

font-size: clamp(2.2rem, 4vw, 4rem);

font-weight: 800;

letter-spacing: -1.5px;


}

.section-heading p {


margin: 20px auto 0;

max-width: 650px;

color: #68736c;

line-height: 1.8;


}

/* =========================================================
HISTORY JOURNEY
========================================================= */

.history-journey {


padding: 110px 0 130px;

background: #fff;


}

.history-timeline {


position: relative;

max-width: 1180px;

margin: auto;


}

.history-timeline::before {


content: "";

position: absolute;

top: 0;

bottom: 0;

left: 50%;

width: 2px;

transform: translateX(-50%);

background:
    linear-gradient(
        180deg,
        transparent,
        #b9d7c5 8%,
        #b9d7c5 92%,
        transparent
    );


}

.history-item {


position: relative;

display: grid;

grid-template-columns: 1fr 1fr;

gap: 70px;

align-items: center;

margin-bottom: 100px;


}

.history-item:last-child {


margin-bottom: 0;


}

.history-item.reverse .history-image {


grid-column: 2;

grid-row: 1;


}

.history-item.reverse .history-content {


grid-column: 1;

grid-row: 1;


}

.history-marker {


position: absolute;

z-index: 5;

left: 50%;

top: 50%;

width: 58px;

height: 58px;

display: flex;

align-items: center;

justify-content: center;

transform: translate(-50%, -50%);

border: 6px solid #fff;

border-radius: 50%;

background:
    linear-gradient(
        135deg,
        #17633f,
        #36a269
    );

color: #FFD54F;

font-size: 1.05rem;

box-shadow:
    0 8px 25px rgba(20,70,45,.25);


}

.history-image {


position: relative;

overflow: hidden;

border-radius: 30px;

min-height: 390px;

box-shadow:
    0 25px 60px rgba(22,48,35,.15);


}

.history-image::after {


content: "";

position: absolute;

inset: 0;

background:
    linear-gradient(
        135deg,
        rgba(23,99,63,.05),
        rgba(0,0,0,.15)
    );

pointer-events: none;


}

.history-image img {


width: 100%;

height: 100%;

min-height: 390px;

object-fit: cover;

display: block;

transition:
    transform .8s cubic-bezier(.22,1,.36,1);


}

.history-image:hover img {


transform: scale(1.07);


}

.history-content {


padding: 20px;


}

.history-date {


display: inline-block;

margin-bottom: 14px;

color: #2e8b57;

font-size: .82rem;

font-weight: 800;

letter-spacing: 1.5px;

text-transform: uppercase;


}

.history-content h3 {


margin-bottom: 18px;

color: #173d2b;

font-family: "Plus Jakarta Sans", sans-serif;

font-size: clamp(1.7rem, 3vw, 2.5rem);

line-height: 1.2;

font-weight: 800;


}

.history-content p {


margin-bottom: 25px;

color: #66716a;

font-size: 1rem;

line-height: 1.9;


}

.history-link {


display: inline-flex;

align-items: center;

gap: 10px;

color: #197044;

font-weight: 800;

text-decoration: none;

transition: .3s ease;


}

.history-link i {


transition: transform .3s ease;


}

.history-link:hover {


color: #e09b00;


}

.history-link:hover i {


transform: translateX(7px);


}

/* =========================================================
HERITAGE SECTION
========================================================= */

.heritage-section {


padding: 120px 0;

background:
    linear-gradient(
        180deg,
        #f4f1e8,
        #faf9f5
    );


}

.heritage-card {


height: 100%;

overflow: hidden;

border: 1px solid rgba(22,65,42,.08);

border-radius: 28px;

background: #fff;

box-shadow:
    0 18px 45px rgba(30,55,40,.09);

transition:
    transform .45s cubic-bezier(.22,1,.36,1),
    box-shadow .45s ease;


}

.heritage-card:hover {


transform: translateY(-12px);

box-shadow:
    0 30px 65px rgba(30,55,40,.16);


}

.heritage-card img {


display: block;

width: 100%;

height: 280px;

object-fit: cover;

transition:
    transform .7s cubic-bezier(.22,1,.36,1);


}

.heritage-card:hover img {


transform: scale(1.06);


}

.heritage-card-body {


padding: 30px;


}

.heritage-card-body span {


display: block;

margin-bottom: 8px;

color: #2e8b57;

font-size: .78rem;

font-weight: 800;

letter-spacing: 1.4px;

text-transform: uppercase;


}

.heritage-card-body h3 {


margin-bottom: 12px;

color: #173d2b;

font-family: "Plus Jakarta Sans", sans-serif;

font-size: 1.55rem;

font-weight: 800;


}

.heritage-card-body p {


margin-bottom: 20px;

color: #69736c;

line-height: 1.75;


}

.heritage-card-body a {


display: inline-flex;

align-items: center;

gap: 9px;

color: #197044;

font-weight: 800;

text-decoration: none;

transition: .3s ease;


}

.heritage-card-body a i {


transition: transform .3s ease;


}

.heritage-card-body a:hover {


color: #e09b00;


}

.heritage-card-body a:hover i {


transform: translateX(6px);


}

/* =========================================================
HISTORY CTA
========================================================= */

.history-cta {


padding: 110px 0;

background: #fff;


}

.history-cta-box {


position: relative;

overflow: hidden;

display: flex;

align-items: center;

justify-content: space-between;

gap: 40px;

padding: 65px 70px;

border-radius: 35px;

background:
    linear-gradient(
        135deg,
        #174f35,
        #287d51
    );

box-shadow:
    0 30px 70px rgba(25,85,52,.20);


}

.history-cta-box::before {


content: "";

position: absolute;

width: 330px;

height: 330px;

border-radius: 50%;

right: -100px;

top: -180px;

background:
    rgba(255,213,79,.22);

filter: blur(10px);


}

.history-cta-box::after {


content: "";

position: absolute;

width: 240px;

height: 240px;

border-radius: 50%;

left: -100px;

bottom: -160px;

background:
    rgba(0,188,212,.20);

filter: blur(15px);


}

.history-cta-box > div {


position: relative;

z-index: 2;


}

.history-cta-box > a {


position: relative;

z-index: 2;

flex-shrink: 0;

border-radius: 999px;

padding: 14px 28px;

font-weight: 800;


}

.history-cta-box span {


display: inline-flex;

align-items: center;

gap: 8px;

margin-bottom: 12px;

color: #FFD54F;

font-size: .82rem;

font-weight: 800;

letter-spacing: 1.4px;

text-transform: uppercase;


}

.history-cta-box h2 {


margin: 0 0 12px;

color: #fff;

font-family: "Plus Jakarta Sans", sans-serif;

font-size: clamp(2rem, 4vw, 3.5rem);

font-weight: 800;


}

.history-cta-box p {


max-width: 650px;

margin: 0;

color: rgba(255,255,255,.82);

line-height: 1.8;


}

/* =========================================================
SCROLL REVEAL
========================================================= */

.history-item,
.history-fact-card,
.heritage-card {


will-change: transform, opacity;


}

/* =========================================================
RESPONSIVE
========================================================= */

@media (max-width: 991px) {


.history-intro {

    min-height: 470px;

    padding: 140px 0 90px;

}


.history-intro h1 {

    font-size: clamp(2.8rem, 8vw, 5rem);

}


.history-facts {

    margin-top: -35px;

    padding-bottom: 70px;

}


.history-timeline::before {

    left: 25px;

}


.history-item {

    display: block;

    padding-left: 70px;

    margin-bottom: 80px;

}


.history-item.reverse .history-image,
.history-item.reverse .history-content {

    grid-column: auto;

    grid-row: auto;

}


.history-marker {

    left: 25px;

    top: 40px;

    transform: translate(-50%, 0);

}


.history-image {

    min-height: 360px;

    margin-bottom: 30px;

}


.history-image img {

    min-height: 360px;

}


.history-content {

    padding: 0;

}


.history-cta-box {

    padding: 50px;

}


}

@media (max-width: 767px) {


.history-intro {

    min-height: 440px;

    padding: 125px 0 80px;

}


.history-intro h1 {

    letter-spacing: -2px;

}


.history-intro p {

    font-size: 1rem;

}


.history-facts {

    margin-top: -20px;

}


.history-fact-card {

    min-height: 160px;

}


.history-journey,
.heritage-section,
.history-cta {

    padding: 80px 0;

}


.section-heading {

    margin-bottom: 50px;

}


.history-timeline::before {

    left: 20px;

}


.history-item {

    padding-left: 55px;

}


.history-marker {

    left: 20px;

    width: 48px;

    height: 48px;

    border-width: 4px;

    font-size: .9rem;

}


.history-image,
.history-image img {

    min-height: 270px;

    height: 270px;

}


.history-content h3 {

    font-size: 1.7rem;

}


.history-cta-box {

    flex-direction: column;

    align-items: flex-start;

    padding: 40px 30px;

    border-radius: 28px;

}


.history-cta-box > a {

    width: 100%;

    text-align: center;

}


}

@media (max-width: 480px) {


.history-intro {

    padding-top: 115px;

}


.history-eyebrow {

    font-size: .72rem;

    padding: 8px 13px;

}


.history-intro h1 {

    font-size: 2.7rem;

}


.history-intro p {

    line-height: 1.7;

}


.history-item {

    padding-left: 45px;

}


.history-timeline::before {

    left: 16px;

}


.history-marker {

    left: 16px;

    width: 40px;

    height: 40px;

    font-size: .75rem;

}


.history-image,
.history-image img {

    min-height: 230px;

    height: 230px;

    border-radius: 22px;

}


.heritage-card {

    border-radius: 22px;

}


.heritage-card img {

    height: 230px;

}


.heritage-card-body {

    padding: 25px;

}


}