
:root{

--navy:#062B73;
--blue:#1D66FF;
--teal:#2FD1C3;
--mint:#DFF8F7;
--cream:#FFF9F4;
--pink:#FF75A8;
--purple:#B54BFF;
--yellow:#FFD447;

}

*{

margin:0;
padding:0;
box-sizing:border-box;

}

body{

font-family:

Inter,

sans-serif;

background:

var(--cream);

overflow-x:hidden;

color:

var(--navy);

}

/* NAVBAR */

.navbar{

padding:

10px 5%;

display:flex;

justify-content:space-between;

align-items:center;

}

.logo{

height:220px;

width:auto;

display:block;

object-fit:contain;

margin-top:-35px;

margin-bottom:-35px;

}

/* NAV LINKS */

.menu{

display:flex;

align-items:center;

gap:48px;

}

.menu a{

text-decoration:none;

font-size:1.15rem;

font-weight:700;

color:var(--navy);

transition:.25s;

position:relative;

}

/* underline hover */

.menu a::after{

content:"";

position:absolute;

left:0;

bottom:-8px;

width:0;

height:3px;

background:

var(--teal);

transition:.25s;

border-radius:999px;

}

.menu a:hover::after{

width:100%;

}

/* BUTTON */

.menu button{

background:

var(--navy);

color:white;

border:none;

padding:

22px 36px;

border-radius:999px;

font-size:1rem;

font-weight:700;

cursor:pointer;

box-shadow:

0 12px 30px rgba(

0,

0,

0,

0.12

);

}

/* MOBILE */

@media(max-width:1000px){

.logo{

height:90px;

}

.menu{

display:none;

}

}


/* HERO */

.hero{

display:grid;

grid-template-columns:

1fr 1fr;

gap:40px;

padding:

20px 7% 10px;

align-items:center;

position:relative;

overflow:hidden;

}


.hero::after{

content:"";

position:absolute;

right:-120px;

top:120px;

width:400px;

height:400px;

border-radius:50%;

background:

radial-gradient(
rgba(47,209,195,.08),
transparent 70%
);

pointer-events:none;

}

.hero-trust{

display:grid;

grid-template-columns:

repeat(2,1fr);

gap:12px;

margin:

30px 0;

max-width:520px;

}

.hero-trust div{

background:white;

padding:

18px 22px;

border-radius:20px;

font-weight:700;

font-size:1.05rem;

box-shadow:

0 10px 24px rgba(0,0,0,.06);

}

.pill{

display:inline-block;

background:

var(--mint);

padding:

10px 18px;

border-radius:

999px;

font-size:13px;

font-weight:700;

margin-bottom:20px;

}

.hero h1{

font-size:

clamp(

4.8rem,

8vw,

7rem

);

line-height:.88;

}

.hero span{

font-family:

Caveat;

font-size:1.1em;

color:

var(--teal);

}

.hero p{

font-size:1.55rem;

line-height:1.7;

margin:32px 0;

max-width:580px;

}

.hero-buttons{

display:flex;

gap:20px;

}

.hero-buttons button{

padding:

18px 34px;

border:none;

border-radius:

999px;

font-weight:600;

cursor:pointer;

}

.hero-buttons button:first-child{

background:

var(--navy);

color:white;

}

.outline{

background:white;

border:

2px solid var(--blue)!important;

}

.scribble{

grid-column:1 / -1;

display:flex;

align-items:center;

justify-content:center;

width:100%;

margin: 0;

padding:5px 0;

font-family:Caveat;

font-size:48px;

color:#1D66FF;

gap:30px;

transform:none;

}

.scribble::before,
.scribble::after{

content:"";

flex:1;

height:2px;

background:

rgba(6,43,115,.15);

}

.blob{

overflow:hidden;

border-radius:

40% 60% 35% 45% / 25% 30% 70% 65%;

box-shadow:

0 40px 90px rgba(0,0,0,.08);

}

.blob img{

width:100%;

display:block;

height:100%;

object-fit:cover;

}


/* BENEFITS */

.benefits{

padding:

20px 7%

90px;

display:grid;

grid-template-columns:

repeat(4,1fr);

gap:30px;

position:relative;

margin-bottom:70px;

}



/* CARDS */

.benefit{

padding:

55px 30px;

border-radius:42px;

font-weight:800;

font-size:1.2rem;

text-align:center;

line-height:1.5;

position:relative;

overflow:hidden;

box-shadow:

0 20px 60px rgba(

0,

0,

0,

.08

);

transition:.35s;

color:white;

}



/* FUN SHAPES */

.benefit::before{

content:"";

position:absolute;

width:170px;

height:170px;

border-radius:50%;

right:-60px;

top:-60px;

opacity:.22;

}

.benefit::after{

content:"";

position:absolute;

width:90px;

height:90px;

border-radius:40px;

left:-25px;

bottom:-25px;

opacity:.18;

transform:rotate(25deg);

}



/* CARD COLORS */

/* OCEAN COLORS */

.benefit:nth-child(1){

background:

linear-gradient(

135deg,

#0A7A8C,

#0E5C8B

);

transform:

translateY(-10px);

}

.benefit:nth-child(1)::before{

background:

rgba(

255,

255,

255,

.12

);

}



.benefit:nth-child(2){

background:

linear-gradient(

135deg,

#006DAA,

#2F6BFF

);

}

.benefit:nth-child(2)::before{

background:

rgba(

255,

255,

255,

.10

);

}



.benefit:nth-child(3){

background:

linear-gradient(

135deg,

#E26A2C,

#FF8247

);

transform:

translateY(10px);

}

.benefit:nth-child(3)::before{

background:

rgba(

255,

255,

255,

.12

);

}



.benefit:nth-child(4){

background:

linear-gradient(

135deg,

#00A88F,

#00C2A8

);

color:white;

}

.benefit:nth-child(4)::before{

background:

rgba(

255,

255,

255,

.14

);

}



/* HOVER */

.benefit:hover{

transform:

translateY(-10px)

scale(1.03)

rotate(0deg);

}



/* MOBILE */

@media(max-width:1000px){

.benefits{

grid-template-columns:

1fr 1fr;

}

}

@media(max-width:700px){

.benefits{

grid-template-columns:1fr;

}

}


/* SERVICES */

.services{

display:grid;

grid-template-columns:

1fr 1fr;

gap:40px;

padding:

0px 7% 30px;

align-items:center;

position:relative;

overflow:hidden;

}






/* LEFT */

.services-left{

position:relative;

z-index:2;

max-width:540px;

}





.services-left h2{

font-size:

clamp(

3.8rem,

6vw,

5.2rem

);

line-height:.9;

margin:

15px 0

24px;

}



.services-left p{

font-size:1.15rem;

line-height:1.8;

margin-bottom:32px;

}



/* KEEP BUTTON */

.services-left button{

padding:

20px 36px;

background:#062B73;

color:white;

border:none;

border-radius:999px;

font-weight:700;

}



/* RIGHT SIDE */

.services-right{

display:grid;

grid-template-columns:

1fr 1fr;

gap:24px;

align-items:center;

position:relative;

z-index:2;

}



/* CARDS */

.card{

background:white;

padding:18px;

border-radius:38px;

box-shadow:

0 20px 55px rgba(

0,

0,

0,

.08

);

transition:.3s;

}



.card:hover{

transform:

translateY(-8px);

}



.big{

transform:

none;

}



.small{

transform:

none;

margin-top:0px;

}



.card img{

width:100%;

display:block;

border-radius:28px;

}



/* TAGS */

.tag{

margin-top:16px;

font-weight:700;

font-size:1rem;

text-align:center;

}



/* MOBILE */

@media(max-width:1000px){

.services{

grid-template-columns:1fr;

gap:55px;

}



.services-right{

grid-template-columns:1fr;

}



.small{

margin-top:0;

}

}

/* DARK SECTION */

.dark-section{

background:

linear-gradient(

180deg,

#062B73,

#041E56

);

padding:

10px 7% 30px;

margin-top:20px;

display:grid;

grid-template-columns:

.8fr 1.2fr;

gap:50px;

align-items:center;

color:white;

border-radius:24px;

overflow:hidden;

position:relative;

}



/* TEXT */

.dark-left h2{

font-size:

clamp(

3.5rem,

5vw,

5rem

);

line-height:.9;

margin-bottom:25px;

}

.dark-left li{

margin:14px 0;

}



/* IMAGE */

.cart-blob{

max-height:520px;

overflow:hidden;

border-radius:

42% 58% 51% 49%;

border:

8px solid white;

transform:

none;

box-shadow:

0 25px 60px rgba(

0,

0,

0,

.15

);

}

.cart-blob img{

width:100%;

height:520px;

object-fit:cover;

display:block;

}



/* MOBILE */

@media(max-width:1000px){

.dark-section{

grid-template-columns:1fr;

}

.cart-blob img{

height:420px;

}

}


/* REMOVE OLD SHAPES */

.dark-section::before,

.dark-section::after{

display:none;

content:none;

}



/* LEFT */

.dark-left h2{

font-size:

clamp(

4rem,

6vw,

5.5rem

);

line-height:.9;

margin-bottom:30px;

}

.dark-left span{

font-family:Caveat;

color:#2DD5C4;

}

.dark-left ul{

list-style:none;

padding:0;

}

.dark-left li{

margin:18px 0;

font-size:1.15rem;

}

.dark-left li::before{

content:"✓";

margin-right:14px;

color:#2DD5C4;

}



/* IMAGE */

.cart-blob{

overflow:hidden;

border-radius:

42% 58% 51% 49%;

border:

8px solid white;

transform:rotate(-2deg);

box-shadow:

0 30px 70px rgba(

0,

0,

0,

.15

)

}



/* MOBILE */

@media(max-width:1000px){

.dark-section{

grid-template-columns:1fr;

}

}

/* WHO WE SERVE */

.who{

padding:

110px 7%

130px;

text-align:center;

position:relative;

overflow:hidden;

}



/* OCEAN SHAPES */

.who::before{

content:"";

position:absolute;

width:420px;

height:420px;

background:

linear-gradient(

135deg,

#0E5C8B,

#0A7A8C

);

left:-240px;

top:-100px;

border-radius:50%;

opacity:.12;

}



/* wave blob */

.who::after{

content:"";

position:absolute;

width:350px;

height:350px;

background:

linear-gradient(

135deg,

#20C7C0,

#0D9CB3

);

right:-180px;

top:30px;

border-radius:

62% 38% 70% 30%

/

45% 65% 35% 55%;

opacity:.12;

}



.who h2{

font-size:

clamp(

4rem,

6vw,

5.6rem

);

line-height:.9;

margin-bottom:80px;

position:relative;

z-index:2;

}

.who span{

font-family:Caveat;

color:#0FA7C6;

}



/* GRID */

.who-grid{

display:grid;

grid-template-columns:

repeat(5,1fr);

gap:22px;

position:relative;

z-index:2;

}



/* CARDS */

.who-grid div{

padding:

40px 25px;

border-radius:28px;

font-weight:700;

box-shadow:

0 20px 50px rgba(

0,

0,

0,

.08

);

color:white;

}



/* ocean colors */

.who-grid div:nth-child(1){

background:

linear-gradient(

135deg,

#0E5C8B,

#084C74

);

transform:

rotate(-2deg);

}

.who-grid div:nth-child(2){

background:

linear-gradient(

135deg,

#0096C7,

#0077B6

);

transform:

translateY(18px);

}

.who-grid div:nth-child(3){

background:

linear-gradient(

135deg,

#16B8C7,

#0A8FA8

);

transform:

rotate(2deg);

}

.who-grid div:nth-child(4){

background:

linear-gradient(

135deg,

#D6A55A,

#B7833B

);

transform:

translateY(-8px);

}

.who-grid div:nth-child(5){

background:

linear-gradient(

135deg,

#FF7A3D,

#E65F1A

);

transform:

rotate(2deg);

}



/* MOBILE */

@media(max-width:1000px){

.who-grid{

grid-template-columns:

1fr 1fr;

}

}

@media(max-width:700px){

.who-grid{

grid-template-columns:1fr;

}

}


/* =========================

SERVING AREA

========================= */

.serving{

display:grid;

grid-template-columns:

1fr 1fr;

gap:80px;

padding:

80px 7%;

align-items:center;

position:relative;

margin-bottom:0px;

background:

linear-gradient(

135deg,

#D8F2EF 0%,

#BFE8F5 30%,

#B7EFC5 65%,

#8FE3B4 100%

);

border-radius:24px;

padding:

120px 7%;

position:relative;

overflow:hidden;

}

.serving::before{

content:"";

position:absolute;

width:420px;

height:420px;

background:

linear-gradient(

135deg,

#20C7C0,

#0E7EA4

);

border-radius:50%;

left:-220px;

top:-200px;

opacity:.14;

}



.serving::after{

content:"";

position:absolute;

width:280px;

height:280px;

background:

linear-gradient(

135deg,

#3ED598,

#0FA7C6

);

right:-140px;

bottom:-120px;

border-radius:

40% 60% 60% 40%;

opacity:.12;

}



/* LEFT */

.serving-left{

max-width:550px;

}



.serving-left h2{

font-size:

clamp(

4rem,

6vw,

5rem

);

line-height:.9;

margin:

15px 0 25px;

}



.serving-left span{

font-family:Caveat;

color:#20B9BE;

}



.serving-left p{

font-size:1.15rem;

line-height:1.8;

}



/* RIGHT */

.serving-grid{

display:grid;

grid-template-columns:

1fr 1fr;

gap:22px;

}



/* LOCATION PILLS */

.serving-grid div{

background:white;

padding:

28px;

border-radius:28px;

font-weight:800;

text-align:center;

box-shadow:

0 15px 40px rgba(

0,

0,

0,

.06

);

}








/* MOBILE */

@media(max-width:1000px){

.serving{

grid-template-columns:1fr;

gap:50px;

}



.serving-grid{

grid-template-columns:1fr;

}

}

/* =========================
SCHEDULING SECTION
========================= */

.scheduling{

width:100%;

display:flex;

justify-content:space-between;

align-items:center;

gap:80px;

padding:

60px 7%;

margin:

0;

background:

#EEF6F8;

border-radius:24px;

clear:both;

position:relative;

z-index:1;

}

.schedule-list{

list-style:none;

padding:0;

margin:0;

display:flex;

flex-direction:column;

gap:12px;

}

.schedule-list li{

display:flex;

align-items:center;

gap:10px;

font-size:1.05rem;

font-weight:600;

color:#062B73;

}

/* creates checkmarks */

.schedule-list li::before{

content:"✓";

color:#23B7B7;

font-weight:800;

font-size:1rem;

}


/* LEFT */

.schedule-left{

flex:1;

min-width:0;

}



.schedule-left h2{

font-size:

clamp(

4rem,

5vw,

5rem

);

line-height:.9;

margin:

15px 0 25px;

}



.schedule-left span{

font-family:Caveat;

color:#18B7C6;

}



.schedule-left p{

font-size:1.1rem;

line-height:1.8;

max-width:500px;

}



/* RIGHT */

.schedule-right{

flex:1;

display:flex;

flex-direction:column;

gap:28px;

justify-content:center;

}



/* ROW */

.time-row{

display:flex;

align-items:center;

gap:25px;

}



/* ICONS */

.time-icon{

width:65px;

height:65px;

flex-shrink:0;

}



/* SUN */

.sun{

background:#FFD447;

border-radius:50%;

box-shadow:

0 0 25px rgba(

255,

212,

71,

.35

);

}



/* DAY */

.daytime{

background:

linear-gradient(

135deg,

#20C7C0,

#0E7EA4

);

border-radius:50%;

}



/* SUNSET */

.sunset{

height:32px;

background:#FF7B43;

border-radius:

60px 60px 0 0;

}



/* MOON */

.moon{

background:#062B73;

border-radius:50%;

position:relative;

}

.moon::after{

content:"";

position:absolute;

width:48px;

height:48px;

border-radius:50%;

background:#EEF6F8;

left:20px;

top:8px;

}



/* TEXT */

.time-text{

font-size:1.4rem;

font-weight:800;

color:#062B73;

}



/* IMPORTANT FIX */

.cta{

width:100%;

display:flex;

clear:both;

position:relative;

z-index:2;

margin-top:0px;

padding:
80px 7%;
}



/* CTA */

.cta{

background:

var(--navy);

padding:

120px 7%;

display:grid;

grid-template-columns:

1fr 1fr;

gap:60px;

color:white;

align-items:center;

}

.cta h2{

font-size:4rem;

}

.cta span{

font-family:Caveat;

color:var(--yellow);

}

.cta button{

margin-top:30px;

padding:

22px 40px;

border:none;

border-radius:999px;

background:

var(--yellow);

}

.cta-images{

display:flex;

gap:20px;

justify-content:center;

}

.cta-images img{

width:180px;

height:180px;

object-fit:cover;

border-radius:999px;

border:

4px solid white;

}

/* FOOTER */

.footer{

background:#f8f8f8;

padding:

45px 7%

25px;

text-align:center;

border-top-left-radius:50px;

border-top-right-radius:50px;

}

.footer-inner{

max-width:900px;

margin:auto;

}

.footer-logo{

width:150px;

margin-bottom:18px;

}

.footer-text{

margin:

0 auto

22px;

}


.footer-nav{

display:flex;

justify-content:center;

gap:45px;

flex-wrap:wrap;

margin-bottom:22px;

}

.footer-nav a{

text-decoration:none;

font-weight:700;

color:

var(--navy);

}

.footer-info{

display:flex;

justify-content:center;

gap:18px;

flex-wrap:wrap;

color:#556;

margin-bottom:24px;

}

.footer-btn{

display:inline-block;

padding:

18px 36px;

background:

var(--navy);

color:white;

text-decoration:none;

border-radius:999px;

font-weight:700;

margin-bottom:25px;

}

.footer-bottom{

padding-top:18px;

border-top:

1px solid rgba(0,0,0,.08);

color:#777;

}

/* mobile */

@media(max-width:700px){

.footer-nav{

gap:25px;

}

.footer-info{

flex-direction:column;

gap:10px;

}

}










/* ===========================
SERVICES PAGE
=========================== */

.services-hero-new{

display:grid;

grid-template-columns:1fr 1fr;

gap:80px;

padding:

40px 7% 60px;

align-items:center;

position:relative;

overflow:hidden;

}

.services-hero-new::before{

content:"";

position:absolute;

width:700px;

height:700px;

background:

radial-gradient(

circle,

rgba(35,183,183,.18),

transparent

);

left:-200px;

top:-150px;

}

.hero-copy{

position:relative;

z-index:2;

}

.hero-copy h1{

font-size:

clamp(

3.8rem,

7vw,

5.5rem

);

line-height:.82;

font-weight:800;

letter-spacing:-4px;

margin-bottom:30px;

color:#062B73;

}

.hero-copy span{

font-family:Caveat;

color:#23B7B7;

font-size:1.1em;

}

.hero-copy p{

font-size:1.55rem;

line-height:1.6;

max-width:700px;

font-weight:500;

margin-bottom:40px;

color:#243A68;

}

.hero-copy button{

background:#062B73;

color:white;

padding:

22px 42px;

border:none;

border-radius:999px;

font-size:1.1rem;

font-weight:700;

cursor:pointer;

box-shadow:

0 15px 35px rgba(

6,

43,

115,

.2

);

}

.hero-image img{

width:100%;

border-radius:

43% 57% 61% 39%/

45% 39% 61% 55%;

box-shadow:

0 35px 90px rgba(

0,

0,

0,

.15

);

max-height:500px;

object-fit:cover;

}


/* ===========================
PROCESS SECTION
=========================== */

.floating-process{

margin:

40px 7%;

padding:

60px 5%;

background:

linear-gradient(

135deg,

#23B7B7,

#0A7A8C

);

border-radius:

90px;

position:relative;

overflow:hidden;

color:white;

text-align:center;

}

.floating-process::before{

content:"";

position:absolute;

width:600px;

height:600px;

background:

rgba(

255,

255,

255,

.08

);

border-radius:999px;

top:-250px;

right:-200px;

}

.floating-process h2{

font-size:

clamp(

2.8rem,

5vw,

4rem

);

margin-bottom:90px;

font-weight:800;

}

.floating-process span{

font-family:Caveat;

}

.floating-cards{

display:grid;

grid-template-columns:

repeat(4,1fr);

gap:30px;

position:relative;

z-index:2;

}

.float-card{

background:white;

color:#062B73;

padding:

55px 35px;

border-radius:35px;

box-shadow:

0 20px 40px rgba(

0,

0,

0,

.12

);

}


.num{

font-size:4rem;

font-weight:800;

color:#23B7B7;

margin-bottom:20px;

}

.float-card h3{

font-size:2rem;

margin-bottom:15px;

}

.float-card p{

font-size:1.15rem;

line-height:1.6;

}


/* ===========================
COMMERCIAL
=========================== */

.commercial-swoop{

display:grid;

grid-template-columns:1fr 1fr;

gap:40px;

padding:

70px 7%;

align-items:center;

position:relative;

}

.commercial-swoop::before{

content:"";

position:absolute;

width:400px;

height:400px;

background:

rgba(

255,

212,

71,

.12

);

border-radius:999px;

left:-120px;

top:120px;

}

.commercial-photo img{

width:100%;

border-radius:

50px;

box-shadow:

0 30px 70px rgba(

0,

0,

0,

.12

);


max-height:2000px;

object-fit:cover;

}

.commercial-copy h2{

font-size:

clamp(

2.8rem,

5vw,

4rem

);

line-height:.95;

margin-bottom:25px;

color:#062B73;

}

.commercial-copy p{

font-size:1.45rem;

line-height:1.7;

margin-bottom:30px;

}

.commercial-copy ul{

font-size:1.3rem;

line-height:2;

}


/* ===========================
PRODUCTS
=========================== */

.product-wave{

margin:

50px 7%;

padding:

60px 5%;

display:grid;

grid-template-columns:

1fr 1fr;

gap:40px;

background:

linear-gradient(

135deg,

#FFE8D9,

#DFF8F7

);

border-radius:

90px;

align-items:center;

}

.product-wave h2{

font-size:

clamp(

3.7rem,

6vw,

5rem

);

line-height:.95;

margin-bottom:25px;

}

.product-wave p{

font-size:1.45rem;

line-height:1.7;

margin-bottom:40px;

}

.product-wave img{

width:100%;

max-width:700px;

height:550px;

object-fit:cover;

display:block;

margin-left:auto;

border-radius:32px;

align-self:center;

}


.product-badges{

display:grid;

grid-template-columns:

repeat(2,1fr);

gap:20px;

}

.product-badges div{

background:white;

padding:28px;

border-radius:999px;

font-weight:700;

font-size:1.1rem;

box-shadow:

0 10px 25px rgba(

0,

0,

0,

.08

);

}


/* ===========================
MEDICAL
=========================== */

.medical-blob{

display:grid;

grid-template-columns:

1fr 1fr;

gap:90px;

padding:

70px 7%;

align-items:center;

}

.medical-blob img{

width:100%;

border-radius:

41% 59% 58% 42%/

52% 41% 59% 48%;

box-shadow:

0 35px 80px rgba(

0,

0,

0,

.12

);

max-height:500px;

object-fit:cover;

}

.medical-blob h2{

font-size:

clamp(

2.8rem,

5vw,

4rem

);

line-height:.95;

margin-bottom:25px;

color:#062B73;

}

.medical-blob p{

font-size:1.45rem;

line-height:1.7;

margin-bottom:30px;

}

.medical-blob ul{

font-size:1.3rem;

line-height:2;

}


/* ===========================
CTA
=========================== */

.cart-section{

margin-top:120px;

padding:

70px 7%;

background:

linear-gradient(

135deg,

#062B73,

#0A7A8C

);

border-radius:

120px 120px 0 0;

display:grid;

grid-template-columns:

1fr 1fr;

gap:80px;

align-items:center;

color:white;

}

.cart-section img{

width:100%;

border-radius:45px;

}

.cart-section h2{

font-size:

clamp(

2.8rem,

5vw,

4rem

);

line-height:.9;

margin-bottom:25px;

}

.cart-section p{

font-size:1.5rem;

line-height:1.6;

margin-bottom:40px;

}

.cart-section button{

background:#FFD447;

padding:

24px 42px;

border:none;

border-radius:999px;

font-size:1.1rem;

font-weight:700;

}


/* ===========================
FOOTER
=========================== */

footer{

padding:

90px 7%;

text-align:center;

}

footer img{

width:240px;

margin-bottom:30px;

}

footer p{

font-size:1.25rem;

line-height:1.8;

color:#56637E;

}


/* ===========================
MOBILE
=========================== */

@media(max-width:1000px){

.services-hero-new,

.commercial-swoop,

.product-wave,

.medical-blob,

.cart-section{

grid-template-columns:1fr;

display:block;

}

.floating-cards{

grid-template-columns:1fr;

}

.hero-copy h1{

font-size:4rem;

}

}






































/* ==================================
CONTACT PAGE
================================== */

/* HERO */

.contact-hero{

display:grid;

grid-template-columns:

1fr 1fr;

gap:50px;

padding:

40px 7%

60px;

align-items:center;

}

.contact-copy h1{

font-size:

clamp(
3.8rem,
7vw,
5.2rem
);

line-height:.85;

margin-bottom:20px;

}

.contact-copy span{

font-family:Caveat;

color:#23B7B7;

}

.contact-copy p{

font-size:1.2rem;

line-height:1.8;

max-width:520px;

}

/* IMAGE */

.contact-photo img{

width:100%;

max-height:500px;

object-fit:cover;

border-radius:30px;

box-shadow:

0 25px 60px rgba(
0,
0,
0,
.08
);

}

/* MAIN */

.contact-main{

display:grid;

grid-template-columns:

1.1fr .9fr;

gap:40px;

padding:

60px 7%;

align-items:start;

}

/* FORM */

.contact-form-wrap{

background:white;

padding:40px;

border-radius:30px;

box-shadow:

0 15px 40px rgba(
0,
0,
0,
.06
);

}

.contact-form-wrap h2{

font-size:2.4rem;

margin-bottom:25px;

}

.contact-form{

display:flex;

flex-direction:column;

gap:16px;

}

.contact-form input,
.contact-form textarea{

padding:20px 22px;

border:2px solid #CFCFCF;

border-radius:18px;

font-size:1.1rem;

font-family:inherit;

color:#062B73;

background:#FFFFFF;

font-weight:600;

outline:none;

}

/* actual typing text */

.contact-form input,

.contact-form textarea{

-webkit-text-fill-color:#062B73;

}

/* placeholder text */

.contact-form input::placeholder,

.contact-form textarea::placeholder{

color:#555B6E !important;

opacity:1 !important;

font-size:1rem;

font-weight:500;

}

textarea{

min-height:170px;

}

/* focus state */

.contact-form input:focus,

.contact-form textarea:focus{

border-color:#23B7B7;

box-shadow:

0 0 0 4px rgba(
35,
183,
183,
.15
);

}



.contact-form textarea{

height:150px;

resize:none;

}

.form-note{

text-align:center;

margin-top:15px;

font-size:.95rem;

color:#667085;

font-weight:500;

line-height:1.6;

}


.contact-form input:focus,
.contact-form textarea:focus{

outline:none;

border-color:#23B7B7;

box-shadow:

0 0 0 4px rgba(
35,
183,
183,
.15
);

}




.contact-form button{

background:#062B73;

color:white;

border:none;

padding:

22px;

border-radius:999px;

font-size:1.05rem;

font-weight:700;

cursor:pointer;

}

/* INFO */

.contact-info{

display:grid;

grid-template-columns:

1fr 1fr;

gap:18px;

}

.info-card{

padding:

32px;

border-radius:26px;

min-height:170px;

display:flex;

flex-direction:column;

justify-content:center;

}

.info-card h3{

font-size:1.6rem;

margin-bottom:14px;

color:#062B73;

font-weight:800;

}

.info-card p{

font-size:1.1rem;

line-height:1.7;

color:#062B73;

font-weight:500;

}

.teal{

background:

linear-gradient(
135deg,
#D8F2F0,
#A8E5DE
);

}

.coral{

background:

linear-gradient(
135deg,
#FFE4D4,
#FFC8A8
);

}

.sand{

background:

linear-gradient(
135deg,
#DCEFF5,
#BFE1EA
);

}

.navy{

background:

linear-gradient(
135deg,
#D9E4FF,
#C2D2FF
);

}

/* CTA */

.contact-cta{

margin-top:40px;

padding:

80px 7%;

background:

linear-gradient(
135deg,
#062B73,
#0A7A8C
);

text-align:center;

color:white;

border-radius:

40px 40px 0 0;

}

.contact-cta h2{

font-size:

clamp(
3rem,
5vw,
4rem
);

margin-bottom:20px;

}

.contact-cta p{

font-size:1.2rem;

margin-bottom:30px;

}

.contact-cta button{

background:#FFD447;

padding:

22px 42px;

border:none;

border-radius:999px;

font-weight:700;

font-size:1.05rem;

}

/* MOBILE */

@media(max-width:1000px){

.contact-hero,

.contact-main{

grid-template-columns:1fr;

gap:40px;

}

.contact-info{

grid-template-columns:1fr;

}

}















/* ==================================
INDUSTRIES PAGE
================================== */

/* HERO */

.services-hero{

display:grid;

grid-template-columns:

1fr 1fr;

gap:50px;

padding:

40px 7%

60px;

align-items:center;

}

.services-hero h1{

font-size:

clamp(
3.8rem,
7vw,
5.5rem
);

line-height:.85;

max-width:600px;

}

.services-hero span{

font-family:Caveat;

color:#23B7B7;

}

.services-hero p{

font-size:1.2rem;

line-height:1.7;

margin-top:25px;

max-width:520px;

}

/* HERO IMAGE */

.services-blob img{

width:100%;

max-height:500px;

object-fit:cover;

border-radius:35px;

box-shadow:

0 25px 60px rgba(
0,
0,
0,
.08
);

}

/* SPLIT SECTIONS */

.service-split,

.medical-section{

display:grid;

grid-template-columns:

1fr 1fr;

gap:50px;

padding:

70px 7%;

align-items:center;

}

/* LIGHT BACKGROUND */

.medical-section{

background:

#F5FAFC;

border-radius:30px;

margin:

0 5%;

}

/* REMOVE RANDOM SHAPES */

.service-split::after,

.medical-section::before,

.services-hero::before,

.services-blob::before{

display:none;

}

/* COPY */

.service-copy h2{

font-size:

clamp(
2.8rem,
5vw,
4rem
);

line-height:.9;

margin-bottom:20px;

}

.service-copy p{

font-size:1.1rem;

line-height:1.8;

margin-bottom:25px;

}

.service-copy ul{

list-style:none;

padding:0;

display:flex;

flex-direction:column;

gap:18px;

margin-bottom:35px;

}

.service-copy li{

font-size:1.35rem;

font-weight:700;

padding:

18px 24px;

background:white;

border-radius:20px;

box-shadow:

0 10px 25px rgba(
0,
0,
0,
.06
);

display:flex;

align-items:center;

}

.service-copy button{

background:#062B73;

color:white;

border:none;

padding:

22px 44px;

border-radius:999px;

font-weight:700;

font-size:1.1rem;

cursor:pointer;

box-shadow:

0 12px 30px rgba(
6,
43,
115,
.15
);

transition:.25s;

}

.service-copy button:hover{

transform:

translateY(-2px);

}

/* IMAGES */

.service-image img,

.medical-image img{

width:100%;

max-height:500px;

object-fit:cover;

border-radius:30px;

box-shadow:

0 20px 50px rgba(
0,
0,
0,
.08
);

}

/* REMOVE ROTATIONS */

.service-image img,

.medical-image img{

transform:none;

}

/* CTA */

.services-cta{

padding:

80px 7%;

margin-top:50px;

background:

linear-gradient(
135deg,
#062B73,
#0A7A8C
);

border-radius:

40px 40px 0 0;

text-align:center;

color:white;

}

.services-cta::before{

display:none;

}

.services-cta h2{

font-size:

clamp(
3rem,
5vw,
4.5rem
);

margin-bottom:25px;

}

.services-cta button{

padding:

22px 46px;

border:none;

border-radius:999px;

background:#FFD447;

font-size:1.1rem;

font-weight:700;

cursor:pointer;

box-shadow:

0 12px 30px rgba(
0,
0,
0,
.12
);

transition:.25s;

}

.services-cta button:hover{

transform:

translateY(-2px);

}

/* MOBILE */

@media(max-width:1000px){

.services-hero,

.service-split,

.medical-section{

grid-template-columns:1fr;

gap:40px;

}

.medical-section{

margin:0;

}

}