 :root{
	        --jade:#a5d1c7;
	        --deep:#004d40;
	        --cream:#faf8f5;
	        --line:#e0e0e0;
	        --charcoal:#222;
        }
       /*  *{
	        box-sizing:border-box;
	        margin:0;
	        padding:0;
	        font-family:'Inter',sans-serif;color:var(--charcoal);
        } */
        .story img{
	        max-width:100%;
	        display:block;
        }
        h1,h2,h3{
        	font-family:'Playfair Display',serif;color:var(--deep);
        }
        a{
        	text-decoration:none;color:var(--jade);
        }
        .btn{
	        display:inline-block;
	        background:var(--jade);
	        color:var(--white);
	        padding:14px 32px;
	        border-radius:30px;
	        text-decoration:none;
	        font-weight:500;
	        transition:.3s;
        }
        .btn:hover{
        	background:var(--deep);
        }
        /* ---------- Hero ---------- */
        .hero{
          margin-top:70px; 
          height:70vh;
          position:relative;
          display:flex;
          align-items:center;
          justify-content:center;
          text-align:center;
          color:var(--white);
          background:url(/imgs/about-top.webp) center/cover;
        }
        /* .hero::before{
	        content:'';
	        position:absolute;
	        inset:0;
	        background:rgba(0,0,0,.45);
        } */
        .hero-content{
	        position:relative;
	        z-index:2;
        }
        .hero h1{
	        font-size:4rem;
	        letter-spacing:1px;
        }
        .hero p{
	        font-size:1.25rem;
	        margin-top:1rem;
        }
        /* ---------- Section ---------- */
        .section{
	        padding:80px 5%;
	        max-width:1200px;
	        margin:auto;
        }
        .story{
	        display:grid;
	        grid-template-columns:1fr 1fr;
	        gap:60px;
	        align-items:center;
        }
        .story-text h2{
	        font-size:2.8rem;
	        margin-bottom:20px;
        }
        .story-text p{
	        margin-bottom:15px;
	        font-size:1.05rem;
        }
        .clients{
	        display:flex;
	        gap:25px;
	        flex-wrap:wrap;
	        margin-top:25px;
        }
        .clients img{
	        height:28px;
	        filter:grayscale(100%) opacity(.8);
        }
        .divider{
	        width:40px;
	        height:3px;
	        background:var(--jade);
	        margin:30px 0;
        
        }
        /* ---------- Products ---------- */
        .products{
        	background:var(--cream);
        }
        .prod-grid{
	        display:grid;
	        grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
	        gap:30px;
	        margin-top:40px;
        }
        .prod-card{
	        background:var(--white);
	        border-radius:12px;
	        overflow:hidden;
	        box-shadow:0 4px 15px rgba(0,0,0,.06);
	        transition:.3s;
        }
        .prod-card:hover{
        	transform:translateY(-5px);
        }
        .prod-card img{
	        height:200px;
	        width:100%;
	        object-fit:cover;
        }
        .prod-card-content{
        	padding:25px;
        }
        .prod-card h3{
	        font-size:1.4rem;
	        margin-bottom:10px;
        }
        /* ---------- Data ---------- */
        .data{
	        background:var(--deep);
	        color:var(--white);
	        text-align:center;
        }
        .data-grid{
	        display:grid;
	        grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
	        gap:30px;
        }
        .data-item h3{
	        font-size:3rem;
	        font-family:'Inter',sans-serif;
	        margin-bottom:5px;
        }
        .data-item p{
	        letter-spacing:1px;
	        text-transform:uppercase;
	        font-size:.9rem;
        }
        /* ---------- Testimonials ---------- */
        .testimonials{
        	background:var(--cream);
        	background:url(/imgs/crs-01.webp) center/cover;
        }
        .swiper-slide{
	        text-align:center;
	        padding:40px 20px;
        }
        .swiper-slide p{
	        font-size:1.3rem;
	        font-style:italic;
	        margin-bottom:15px;
        }
        .swiper-slide span{
        	font-weight:500;
        }
        /* ---------- CTA ---------- */
        .cta{
	        text-align:center;
	        padding:70px 20px;
	        background:var(--jade);
	        color:var(--white);
        }
        .cta h2{
	        font-size:2.2rem;
	        margin-bottom:15px;
        }
        @media(max-width:768px){
        .hero h1{
        	font-size:2.5rem;
        }
        .story{
        	grid-template-columns:1fr;
        }
        .section{
        	padding:60px 5%;
        }
     }