/* =========================
HOME HERO
========================= */

.home-hero{

padding:
40px 0 60px;

}
.hero-inner{

position:relative;

max-width:1400px;

margin:auto;

min-height:260px;

display:flex;

align-items:center;

justify-content:center;

}
.innersectioheight{min-height: 100px;}

.hero-title{

position:absolute;

top:50%;
left:50%;

transform:translate(-50%,-50%);

width:100%;
max-width:1220px;

text-align:center;

font-size:clamp(48px,4.5vw,86px);

line-height:1.16;

letter-spacing:-1.8px;

font-weight:400;

color:#111111;

opacity:0;

visibility:hidden;

z-index:1;

transition:opacity 1.4s ease;

pointer-events:none;

}

.hero-title.active{

opacity:1;
visibility:visible;
z-index:2;

}


/* =========================
HEALTH SECTION
========================= */

.health-section{

padding:
50px 0 60px;

background:#FCFAF8;

overflow:hidden;

}

.health-inner{

max-width:1180px;

margin:auto;

}

/* =========================
SECTION TITLE
========================= */

.health-section .section-title{

max-width:900px;

font-size:
clamp(46px,4vw,76px);

line-height:1.14;

letter-spacing:-1.5px;

margin-bottom:0;

}

/* =========================
COUNTRIES
========================= */

.countries{

display:grid;

grid-template-columns:
1fr 1fr;

gap:120px;

max-width:900px;

margin:
80px auto 60px;

}

/* COUNTRY */

.country{

text-align:center;

}

/* LABEL */

.country-label{

font-size:12px;

font-weight:500;

letter-spacing:2.5px;

text-transform:uppercase;

color:#8A857F;

margin-bottom:24px;

}

/* NUMBER */

.country-number{


font-size:
clamp(86px,7vw,138px);

line-height:.9;

font-weight:300;

letter-spacing:-3px;

}

/* COLORS */

.india{

color:#B5654D;

}

.benchmark-number{

color:#7D8977;

}

/* =========================
DIVIDER
========================= */

.divider{

width:100%;
max-width:860px;

height:1px;

background:#E4DDD7;

margin:60px auto;

}

/* =========================
INFO
========================= */

.info{

position:relative;

max-width:880px;

margin:auto;

text-align:center;

}

/* INFO HEADING */

.difference-title{

font-size:
clamp(44px,4vw,72px);
line-height:1.1;

margin-bottom:26px;

letter-spacing:-1.2px;

color:#111111;

}

/* INFO TEXT */

.difference-text{

max-width:720px;

margin:auto;

font-size:22px;

line-height:1.9;

color:#5D5A57;

}

/* =========================
HALE NOTE
========================= */

.hale-note{

margin-top:32px;

font-size:11px;

letter-spacing:4px;

text-transform:uppercase;

color:#9A938C;

}

/* =========================
ACTION
========================= */

.health-action{

margin-top:10px;

display:flex;
justify-content:center;

}

/* =========================
KNOW BUTTON
========================= */

.know-btn{

width:auto;
min-width: 220px;
height:58px;
padding: 5px 15px;

border-radius:100px;

border:
1px solid rgba(155,184,177,.7);

background:transparent;

font-size:13px;

font-weight:500;

letter-spacing:3px;

color:#5C736D;

display:flex;
align-items:center;
justify-content:center;
gap:16px;

transition:
all .45s cubic-bezier(.16,1,.3,1);

}


.know-btn:hover{

background:#B8D1CB;

color:#111111;

transform:
translateY(-2px);

}

/* =========================
BOTTOM INFO
========================= */

.bottom-info{
padding:
50px 0 60px;
text-align:center;
}


/* ROW */
.bottom-row{
font-size:25px;
line-height:2;
color:#2F2F2F;

}

/* STRONG */

.bottom-row strong{

font-weight:600;

}
.checksizes strong{font-size: 30px;}

/* MINI LINE */

.mini-line{

width:42px;
height:1px;

background:var(--accent);

margin:10px auto;

opacity:.8;

}

/* ADDRESS */

.address{

font-size:25px;

line-height:2;

color:#5D5A57;

max-width:760px;

margin:auto;

}

/* =========================
EDITORIAL SECTION
========================= */

.editorial-section{

padding:
50px 0 60px;

background:#eee;

}

/* INNER */

.editorial-inner{

max-width:1180px;

text-align:center;

}

/* TITLE */

.editorial-title{


max-width:1100px;

margin:auto;

}

/* LINE */

.editorial-line{

width:52px;
height:1px;

background:var(--accent);

margin:
42px auto 0;

}

/* =========================
HOW SECTION
========================= */

.how-section{

padding:
50px 0 60px;
background: #fff;

}

/* TITLE */

.how-title{

max-width:980px;

margin:
22px auto 100px;

text-align:center;

font-size:
clamp(44px,4vw,74px);

line-height:1.1;

letter-spacing:-1.5px;

}

/* STEPS */

.steps{

display:grid;

grid-template-columns:
repeat(2,1fr);

gap:60px;

align-items:start;
padding: 20px;
}

/* STEP */

.step{

text-align:center;

}

/* NUMBER */

.step-number{


font-size: clamp(50px, 4.5vw, 88px);

line-height:.9;

font-weight:300;

color:#D9D2CB;

margin-bottom:22px;

}

/* TITLE */

.step-title{

font-size:
clamp(30px,2.4vw,48px);

line-height:1.15;

margin-bottom:0px;

letter-spacing:-1px;

}

/* TEXT */

.step-text{
margin:auto;

font-size:18px;

line-height:1.9;

color:#5D5A57;

}

/* =========================
MINT SECTION
========================= */

.mint{

background:#D6E2DE;

padding:
50px 0;

text-align:center;

overflow:hidden;

}

/* INNER */

.mint-inner{

max-width:1100px;

margin:auto;

}

/* TITLE */

.mint-title{
max-width:980px;

margin:auto;


font-size:
clamp(40px,3vw,62px);

line-height:1.22;

letter-spacing:-1.4px;

color:#111111;

}
.subtitle{font-size: 20px;margin-bottom: 10px;margin-top: 10px;}
/* SUBTEXT */

.mint-subtext{

margin-top:28px;

font-size:23px;

line-height:1.9;

color:#37403D;

}

/* BOOKING */

.mint-booking{

margin-top:42px;

font-size:23px;

line-height:2.1;

color:#313836;

}
/* =========================
BOOKING SECTION
========================= */
/* =========================
BOOKING SECTION
========================= */

.booking-section{

padding:80px 0;

border-top:1px solid #ECE5DF;

border-bottom:1px solid #ECE5DF;

background:#FCFAF8;

}

/* ROW */

.booking-row{

display:grid;

grid-template-columns:
repeat(3,1fr);

gap:80px;

align-items:start;

}

/* COLUMN */

.booking-col{

position:relative;

min-width:0;

}

/* VERTICAL DIVIDER */

.booking-col:not(:last-child)::after{

content:"";

position:absolute;

top:0;
right:-40px;

width:1px;
height:100%;

background:#ECE5DF;

}

/* LABEL */

.booking-label{

font-size:12px;

letter-spacing:5px;

text-transform:uppercase;

color:#8D8781;

margin-bottom:24px;

}

/* PHONE */

.booking-phone{

font-size:
clamp(42px,3vw,60px);

line-height:1.1;

letter-spacing:-1px;

color:#111111;

}

/* VALUE */

.booking-value{

font-size:
clamp(24px,1.8vw,38px);

line-height:1.6;

color:#111111;

}

/* ADDRESS */

.booking-address{

font-size:
clamp(22px,1.7vw,34px);

line-height:1.7;

color:#111111;

}

/* =========================
TABLET
========================= */

@media(max-width:992px){

.booking-row{

grid-template-columns:1fr;

gap:50px;

}

.booking-col{

padding-bottom:50px;

border-bottom:
1px solid #ECE5DF;

}

.booking-col:last-child{

padding-bottom:0;

border-bottom:none;

}

.booking-col:not(:last-child)::after{

display:none;

}

}

/* =========================
MOBILE
========================= */

@media(max-width:768px){

.booking-section{

padding:60px 0;

}

.booking-label{

font-size:11px;

letter-spacing:4px;

margin-bottom:16px;

}

.booking-phone{

font-size:38px;

}

.booking-value{

font-size:26px;

line-height:1.5;

}

.booking-address{

font-size:24px;

}

}

/* =========================
FOOTER
========================= */

.footer{

padding:
30px 20px;

text-align:center;

font-size:15px;

line-height:2.2;

color:#5D5A57;

background:#FAF8F5;

border-top:
1px solid #ECE5DF;

}

/* =========================
RESPONSIVE
========================= */

@media(max-width:992px){

.home-hero{

padding:
30px 0 110px;

}

.hero-title{

font-size:
clamp(42px,6vw,64px);

}

.countries{

gap:60px;

}

.steps{

grid-template-columns:1fr;

gap:90px;

}

.booking-grid{

grid-template-columns:1fr;

}

.booking-item{

border-right:none !important;

border-bottom:
1px solid var(--line);

}

.booking-item:last-child{

border-bottom:none;

}

}

@media(max-width:768px){

.hero-title{

font-size:
clamp(34px,9vw,52px);

line-height:1.18;

}



.countries{

grid-template-columns:1fr;

gap:50px;

margin:
60px auto;

}

.country-number{

font-size:92px;

}

.difference-title{

font-size:48px;

}

.editorial-title{

font-size:
clamp(40px,8vw,62px);

}

.step-title{

font-size:36px;

}

.mint{

padding:
90px 0;

}

.booking-value{

font-size:30px;

}

.bottom-row{

font-size:18px;

}
.steps{
padding: 5px;
}

}