:root{
--bg:#f7f5ef;
--surface:#ffffff;
--surface-soft:#f1efe8;
--ink:#1c2a23;
--muted:#56635c;
--accent:#1f7a4a;
--accent-strong:#155d39;
--accent-soft:#dcecdf;
--line:#d8dfd9;
--shadow:0 18px 50px rgba(20,30,26,0.12);
}

*{
margin:0;
padding:0;
box-sizing:border-box;
}

html{
scroll-behavior:smooth;
}

body{
font-family:"Manrope",sans-serif;
background:
radial-gradient(circle at 10% 10%,#e8f0e6 0,#f7f5ef 40%),
radial-gradient(circle at 90% 0,#efe7d7 0,#f7f5ef 35%);
color:var(--ink);
line-height:1.65;
overflow-x:hidden;
}

body.modal-open{
overflow:hidden;
}

img{
max-width:100%;
height:auto;
}

h1,h2,h3,h4{
font-family:"Cormorant Garamond",serif;
line-height:1.2;
}

.navbar{
position:sticky;
top:0;
z-index:900;
display:flex;
justify-content:space-between;
align-items:center;
gap:24px;
padding:14px 5vw;
background:rgba(247,245,239,0.85);
backdrop-filter:blur(10px);
border-bottom:1px solid var(--line);
}

.logo{
display:flex;
align-items:center;
gap:10px;
font-family:"Cormorant Garamond",serif;
font-size:1.6rem;
font-weight:700;
color:#163525;
letter-spacing:.4px;
}

.logo-img{
width:auto;
height:38px;
object-fit:contain;
display:block;
}

.menu{
display:flex;
align-items:center;
gap:12px;
flex-wrap:wrap;
justify-content:flex-end;
}

.menu-toggle{
display:none;
background:var(--ink);
color:#fff;
border:none;
width:42px;
height:42px;
border-radius:999px;
cursor:pointer;
align-items:center;
justify-content:center;
gap:4px;
flex-direction:column;
transition:background .2s ease;
}

.menu-toggle span{
display:block;
width:18px;
height:2px;
background:#fff;
border-radius:2px;
transition:transform .25s ease,opacity .25s ease;
}

.menu-toggle.active span:nth-child(1){
transform:translateY(6px) rotate(45deg);
}

.menu-toggle.active span:nth-child(2){
opacity:0;
}

.menu-toggle.active span:nth-child(3){
transform:translateY(-6px) rotate(-45deg);
}

.menu a{
color:var(--ink);
text-decoration:none;
font-size:.92rem;
font-weight:600;
padding:8px 10px;
border-radius:999px;
transition:background .2s ease,color .2s ease;
}

.menu a:hover{
background:var(--accent-soft);
color:var(--accent-strong);
}

.menu button{
background:var(--accent);
border:none;
padding:9px 16px;
color:#fff;
border-radius:999px;
font-weight:600;
cursor:pointer;
transition:background .2s ease,transform .2s ease;
}

.menu button:hover{
background:var(--accent-strong);
transform:translateY(-1px);
}

section{
padding:92px 5vw 28px;
text-align:center;
}

section > h2{
font-size:clamp(2.1rem,4vw,3rem);
margin-bottom:22px;
color:#112519;
}

p{
color:var(--muted);
}

.hero{
min-height:auto;
text-align:center;
position:relative;
display:block;
}

.hero:before{
content:none;
}

.hero-media{
position:relative;
max-width:1120px;
margin:0 auto;
min-height:430px;
border-radius:26px;
overflow:hidden;
display:flex;
align-items:flex-end;
justify-content:center;
padding:26px;
background:url("../../Images/visthara-ventures.webp");
background-size:cover;
background-position:center;
background-repeat:no-repeat;
box-shadow:var(--shadow);
}

.hero-details{
width:min(1120px,100%);
margin:18px auto 0;
position:relative;
z-index:2;
text-align:center;
padding:28px 24px;
}

.card.hero-details,
.hero-details .lead{
text-align:center;
}

.eyebrow{
font-size:.85rem;
text-transform:uppercase;
letter-spacing:.15em;
font-weight:700;
color:var(--accent-strong);
margin-bottom:14px;
text-align:center;
display:block;
width:100%;
}

.hero h1{
font-size:clamp(2.2rem,5vw,4.1rem);
margin-bottom:12px;
color:#112519;
}

.hero h1 span{
display:block;
text-align:center;
}

.lead{
max-width:700px;
font-size:1.05rem;
color:var(--muted);
margin:0 auto;
}

.hero-actions{
display:flex;
flex-wrap:wrap;
gap:12px;
margin-top:24px;
justify-content:flex-start;
width:100%;
}

.hero-media .hero-actions{
position:absolute;
right:18px;
bottom:18px;
width:auto;
justify-content:flex-start;
align-items:flex-start;
z-index:2;
}

.primary,.ghost{
display:inline-flex;
align-items:center;
justify-content:center;
text-decoration:none;
border-radius:999px;
font-size:1rem;
font-weight:700;
padding:12px 22px;
}

.primary{
background:#fff;
color:#13462d;
}

.ghost{
border:1px solid rgba(255,255,255,.45);
color:#fff;
}

.hero-stats{
margin-top:24px;
display:flex;
flex-wrap:wrap;
gap:10px;
justify-content:center;
}

.stat-chip{
display:inline-block;
background:var(--accent-soft);
border:1px solid #bcd5c2;
padding:8px 13px;
border-radius:999px;
font-size:.85rem;
color:#174b30;
}

.cards{
margin-top:24px;
display:grid;
grid-template-columns:repeat(auto-fit,minmax(230px,1fr));
gap:16px;
max-width:1120px;
margin-left:auto;
margin-right:auto;
}

.card{
background:var(--surface);
padding:20px 18px;
border-radius:16px;
border:1px solid var(--line);
box-shadow:0 8px 20px rgba(17,37,25,0.06);
text-align:left;
position:relative;
overflow:hidden;
transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease;
animation:cardFadeIn .5s ease both;
}

.card:before{
content:"";
position:absolute;
inset:0;
background:linear-gradient(110deg,transparent 0%,rgba(255,255,255,0.6) 45%,transparent 90%);
transform:translateX(-140%);
transition:transform .65s ease;
pointer-events:none;
}

.card:hover{
transform:translateY(-6px);
border-color:#b9d2bf;
box-shadow:0 16px 32px rgba(17,37,25,0.12);
background:#eef7f0;
}

.card:hover:before{
transform:translateX(140%);
}

.card.is-visible{
background:#f2f8f3;
border-color:#c2d9c7;
}

.reveal{
opacity:0;
transform:translateY(20px);
transition:opacity .55s ease, transform .55s ease;
will-change:opacity, transform;
}

.reveal.in-view{
opacity:1;
transform:translateY(0);
}

.card h3{
font-size:1.55rem;
margin-bottom:8px;
color:#12271b;
}

.card h4{
margin:8px 0 10px;
color:var(--accent-strong);
font-size:1.05rem;
font-family:"Manrope",sans-serif;
}

.card p{
margin-bottom:7px;
}

.card p:last-child{
margin-bottom:0;
}

.card a{
color:var(--accent-strong);
text-decoration:none;
font-weight:600;
}

.contact-actions{
display:flex;
gap:8px;
margin-top:8px;
flex-wrap:wrap;
}

.contact-btn{
display:inline-flex;
align-items:center;
justify-content:center;
padding:7px 12px;
font-size:.78rem;
font-weight:700;
border-radius:999px;
text-decoration:none;
background:var(--accent-soft);
border:1px solid #bcd5c2;
color:#174b30 !important;
}

.contact-btn.whatsapp{
background:#25d366;
border-color:#25d366;
color:#fff !important;
}

.project-gallery{
display:flex;
gap:10px;
margin:12px 0 14px;
overflow-x:auto;
scroll-snap-type:x mandatory;
padding-bottom:6px;
}

.project-gallery img{
flex:0 0 100%;
height:180px;
width:auto;
object-fit:cover;
border-radius:12px;
border:1px solid var(--line);
scroll-snap-align:start;
background:var(--surface-soft);
cursor:zoom-in;
}

.project-gallery::-webkit-scrollbar{
height:8px;
}

.project-gallery::-webkit-scrollbar-thumb{
background:#c3cec5;
border-radius:999px;
}

.project-gallery-empty{
display:flex;
align-items:center;
justify-content:center;
min-height:120px;
background:var(--surface-soft);
border:1px dashed #b5c3b7;
border-radius:12px;
}

.project-gallery-empty p{
margin:0;
font-size:.9rem;
color:#6d7a72;
}

.feature-main{
width:min(1120px,100%);
margin:0 auto;
padding:24px;
}

.cards .card:nth-child(2){
animation-delay:.08s;
}

.cards .card:nth-child(3){
animation-delay:.16s;
}

.cards .card:nth-child(4){
animation-delay:.24s;
}

.feature-section + .feature-section{
margin-top:14px;
padding-top:14px;
border-top:1px solid var(--line);
}

.feature-section h3{
margin-bottom:8px;
font-size:1.6rem;
}

.section-title-core{
margin-top:28px;
margin-bottom:14px;
line-height:1.35;
min-height:44px;
display:flex;
align-items:center;
justify-content:center;
}

.feature-cta{
width:min(1120px,100%);
margin:24px auto 0;
text-align:center;
background:linear-gradient(145deg,#f8fbf7,#eef4ef);
}

#contact > p{
margin-top:22px;
font-size:.92rem;
}

.site-footer{
margin-top:26px;
padding:22px 20px 40px;
text-align:center;
background:#ece7dc;
border-top:1px solid var(--line);
}

.site-footer p{
font-size:.92rem;
}

.site-footer a{
color:var(--accent-strong);
font-weight:700;
text-decoration:none;
}

.modal{
display:none;
position:fixed;
inset:0;
padding:20px;
background:rgba(15,24,18,0.72);
z-index:1000;
}

.modal.show{
display:flex;
align-items:center;
justify-content:center;
}

.modal-content{
position:relative;
width:min(900px,100%);
max-height:90vh;
overflow:auto;
background:var(--surface);
border:1px solid var(--line);
border-radius:16px;
padding:26px;
box-shadow:var(--shadow);
}

.modal-close{
position:absolute;
top:8px;
right:12px;
background:rgba(12,18,14,0.72);
border:1px solid rgba(255,255,255,0.25);
color:#fff;
width:34px;
height:34px;
border-radius:50%;
font-size:20px;
line-height:1;
cursor:pointer;
z-index:3;
}

.image-modal{
padding:18px;
background:rgba(10,16,12,0.88);
z-index:1200;
}

.image-modal-content{
position:relative;
width:min(1100px,96vw);
max-height:92vh;
display:flex;
align-items:center;
justify-content:center;
flex-direction:column;
gap:12px;
overflow:hidden;
}

.image-modal-track{
width:100%;
max-height:72vh;
display:flex;
overflow-x:auto;
overflow-y:hidden;
scroll-snap-type:x mandatory;
scroll-behavior:smooth;
border-radius:10px;
scrollbar-width:none;
-ms-overflow-style:none;
}

.image-modal-track::-webkit-scrollbar{
display:none;
}

.image-modal-slide{
flex:0 0 100%;
display:flex;
align-items:center;
justify-content:center;
scroll-snap-align:center;
}

.image-modal-slide img{
max-width:100%;
max-height:72vh;
width:auto;
height:auto;
object-fit:contain;
border-radius:10px;
box-shadow:0 20px 50px rgba(0,0,0,0.35);
transition:transform .2s ease;
}

.image-zoom-controls{
display:flex;
gap:8px;
}

.image-zoom-controls button{
border:1px solid rgba(255,255,255,0.35);
background:rgba(12,18,14,0.66);
color:#fff;
border-radius:999px;
padding:6px 12px;
font-size:.86rem;
font-weight:700;
cursor:pointer;
}

.image-modal-thumbs{
width:100%;
display:flex;
gap:8px;
overflow-x:auto;
overflow-y:hidden;
padding-bottom:4px;
scrollbar-width:none;
-ms-overflow-style:none;
}

.image-modal-thumbs::-webkit-scrollbar{
display:none;
}

.image-thumb{
border:2px solid transparent;
background:transparent;
padding:0;
border-radius:8px;
cursor:pointer;
flex:0 0 auto;
}

.image-thumb img{
width:82px;
height:58px;
object-fit:cover;
border-radius:6px;
display:block;
}

.image-thumb.active{
border-color:#6fd49f;
}

.image-nav{
position:absolute;
top:45%;
transform:translateY(-50%);
width:38px;
height:38px;
border:none;
border-radius:50%;
background:rgba(12,18,14,0.66);
color:#fff;
cursor:pointer;
display:flex;
align-items:center;
justify-content:center;
font-size:22px;
z-index:1;
}

.image-nav.prev{
left:8px;
}

.image-nav.next{
right:8px;
}

.privacy-content{
text-align:left;
line-height:1.7;
}

.privacy-content h2{
margin-bottom:10px;
}

.privacy-content h3{
margin-top:16px;
margin-bottom:6px;
}

.whatsapp-float{
position:fixed;
right:18px;
bottom:18px;
z-index:1100;
background:#25d366;
color:#fff;
text-decoration:none;
width:52px;
height:52px;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
font-weight:700;
box-shadow:0 14px 28px rgba(22,95,57,0.28);
}

.whatsapp-float:hover{
background:#1fb85a;
}

.whatsapp-float svg{
width:28px;
height:28px;
fill:currentColor;
display:block;
}

@media(max-width:860px){
.navbar{
align-items:center;
justify-content:space-between;
flex-wrap:wrap;
padding:12px 4vw;
position:sticky;
}

.logo{
font-size:1.4rem;
}

.logo-img{
width:auto;
height:34px;
}

.menu-toggle{
display:inline-flex;
}

.menu{
display:none;
position:absolute;
left:4vw;
right:4vw;
top:calc(100% + 8px);
padding:10px;
background:var(--surface);
border:1px solid var(--line);
border-radius:12px;
box-shadow:0 10px 20px rgba(17,37,25,0.08);
flex-direction:column;
align-items:stretch;
gap:8px;
}

.menu.open{
display:flex;
}

.menu a,
.menu button{
width:100%;
text-align:center;
}

.hero-media{
min-height:340px;
border-radius:18px;
padding:18px;
}

.hero-details{
margin:14px auto 0;
padding:22px 16px;
}

.feature-main{
padding:18px;
}
}

@media(max-width:620px){
section{
padding:82px 4vw 20px;
}

.hero-actions{
flex-direction:column;
align-items:flex-start;
width:auto;
}

.hero-media .primary,
.hero-media .ghost{
width:auto;
max-width:none;
min-width:0;
font-size:.88rem;
padding:9px 16px;
}

.hero-media .hero-actions{
right:12px;
bottom:12px;
}

.hero-media .ghost{
background:rgba(12,18,14,0.45);
border-color:rgba(255,255,255,0.65);
color:#fff;
}

.image-modal .modal-close{
position:fixed;
top:calc(env(safe-area-inset-top, 0px) + 10px);
right:12px;
z-index:1300;
}

.whatsapp-float{
right:12px;
bottom:12px;
width:46px;
height:46px;
}

.whatsapp-float svg{
width:24px;
height:24px;
}
}

@keyframes cardFadeIn{
from{
opacity:0;
transform:translateY(12px);
}
to{
opacity:1;
transform:translateY(0);
}
}

@media (prefers-reduced-motion: reduce){
.card,
.card:before{
animation:none;
transition:none;
}

.reveal{
opacity:1;
transform:none;
transition:none;
}
}