:root{--ink:#0b2b33;--deep:#06191e;--sand:#efe6d2;--paper:#f8f3e7;--sun:#e9b44c;--surf:#7fc8c0;--mut:#5b6e72;--r:4px}
@media(prefers-color-scheme:dark){:root{}}
*{box-sizing:border-box;margin:0}html{scroll-behavior:smooth}
body{font:17px/1.6 Newsreader,Georgia,serif;background:var(--paper);color:var(--ink);overflow-x:hidden;padding-bottom:78px}
h1,h2,h3,.b{font-family:'Bricolage Grotesque',system-ui,sans-serif;line-height:1.05;letter-spacing:-.02em}
h1{font-size:clamp(2.6rem,9vw,6.4rem)}h2{font-size:clamp(1.9rem,5vw,3.4rem);margin-bottom:.5em}h3{font-size:1.35rem}
img{max-width:100%;display:block}a{color:inherit}
.w{width:min(1240px,100% - 2.5rem);margin-inline:auto}.sec{padding:clamp(3.5rem,8vw,7rem) 0}
.dark{background:var(--ink);color:var(--sand)}.lead{max-width:56ch;font-size:1.15rem}
.btn{display:inline-flex;align-items:center;gap:.5rem;min-height:48px;padding:.7rem 1.4rem;font:600 1rem 'Bricolage Grotesque',sans-serif;background:var(--sun);color:var(--deep);border:0;text-decoration:none;cursor:pointer;border-radius:var(--r)}
.btn.o{background:none;border:1.5px solid currentColor;color:inherit}.btn.g{background:#25d366;color:#04210f}
:focus-visible{outline:3px solid var(--sun);outline-offset:3px}
.ph{position:relative;background:linear-gradient(160deg,#164650,#0b2b33 60%,#2b5c5a);overflow:hidden}
.ph::after{content:attr(data-l);position:absolute;inset:auto .8rem .8rem;font:600 .95rem/1.2 'Bricolage Grotesque',sans-serif;color:#ffffffcc}
.ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:1}
/* nav */
.nav{position:fixed;z-index:50;left:50%;top:14px;transform:translateX(-50%);display:flex;align-items:center;gap:.3rem;background:#06191ecc;backdrop-filter:blur(14px);padding:.35rem .4rem .35rem 1rem;border-radius:99px;color:#fff;max-width:calc(100% - 1.5rem)}
.nav .logo{font:800 1rem 'Bricolage Grotesque';text-decoration:none;margin-right:.8rem;white-space:nowrap}
.nav ul{display:flex;list-style:none;padding:0;position:relative}.nav li a{display:block;padding:.6rem .9rem;text-decoration:none;font:500 .92rem 'Bricolage Grotesque';position:relative;z-index:1}
.nav .ind{position:absolute;bottom:.2rem;height:3px;background:var(--sun);border-radius:3px;transition:left .3s,width .3s}
.nav .btn{min-height:40px;padding:.4rem 1rem;border-radius:99px}.mb{display:none;background:none;border:0;color:#fff;font:600 .95rem 'Bricolage Grotesque';padding:.6rem .9rem;min-height:44px}
.sheet{position:fixed;inset:0;z-index:60;background:var(--deep);color:var(--sand);padding:5.5rem 1.5rem 2rem;display:none;flex-direction:column;gap:.2rem;overflow:auto}
.sheet.on{display:flex}.sheet a{font:700 2.3rem 'Bricolage Grotesque';text-decoration:none;padding:.35rem 0;border-bottom:1px solid #ffffff1f;display:flex;justify-content:space-between;align-items:baseline}
.sheet small{font:.8rem system-ui;color:var(--surf)}.sheet .x{position:absolute;right:1rem;top:1rem}
@media(max-width:860px){.nav ul,.nav>.btn{display:none}.mb{display:block}.nav{left:.75rem;right:.75rem;transform:none;justify-content:space-between;max-width:none}}
.dock{position:fixed;z-index:40;right:14px;bottom:14px}.dock a{width:64px;height:64px;display:grid;place-items:center;text-decoration:none;transition:transform .2s}.dock a:hover{transform:scale(1.08)}
/* hero */
.hero{position:relative;min-height:100svh;color:#fff;display:grid;align-content:end;padding:7rem 0 3rem;isolation:isolate}
.hero .ph{position:absolute;inset:0;z-index:-2}.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(0deg,#06191ef0 8%,#06191e55 55%,#06191e99)}
.hero h1{max-width:11ch}.hero .lead{margin:1.2rem 0 1.8rem}.cta{display:flex;flex-wrap:wrap;gap:.8rem}
.route{position:absolute;right:4vw;top:16vh;width:min(420px,44vw);z-index:0}.route path{stroke:var(--sun);stroke-width:2;fill:none;stroke-dasharray:6 8;animation:d 30s linear infinite}
@keyframes d{to{stroke-dashoffset:-400}}
.pin{position:absolute;font:600 .8rem 'Bricolage Grotesque';background:#fff;color:var(--ink);padding:.25rem .6rem;border-radius:99px;white-space:nowrap}
.pin::before{content:"";display:inline-block;width:8px;height:8px;background:var(--sun);border-radius:50%;margin-right:.4rem}
.panel{position:absolute;right:4vw;bottom:3rem;background:#ffffff1c;backdrop-filter:blur(12px);border:1px solid #ffffff33;padding:1rem 1.2rem;max-width:260px;font-size:.95rem}
@media(max-width:900px){.route,.panel{display:none}}
.ph-hero{padding-top:9rem;min-height:56svh}
/* package = boarding pass */
.pk{display:grid;gap:1.6rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr))}
.pass{background:var(--sand);display:flex;flex-direction:column;position:relative;filter:drop-shadow(0 10px 18px #0b2b3322);-webkit-mask:radial-gradient(circle 12px at 0 62%,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 12px at 100% 62%,#0000 98%,#000) right/51% 100% no-repeat;mask:radial-gradient(circle 12px at 0 62%,#0000 98%,#000) left/51% 100% no-repeat,radial-gradient(circle 12px at 100% 62%,#0000 98%,#000) right/51% 100% no-repeat}
.pass .ph{aspect-ratio:4/3;border-radius:50% 50% 0 0/26% 26% 0 0;margin:.6rem .6rem 0}
.pass .in{padding:1rem 1.3rem 1.4rem;display:grid;gap:.7rem;flex:1}.pass .rt{display:flex;align-items:center;gap:.5rem;font:600 .85rem 'Bricolage Grotesque'}
.pass .rt i{flex:1;border-top:2px dotted var(--ink);opacity:.5}.pass .tags{font-size:.85rem;color:var(--mut)}.pass ul{padding-left:1.1rem;font-size:.95rem}
.pass .ft{border-top:2px dashed #0b2b3355;padding-top:.9rem;display:flex;gap:.5rem;flex-wrap:wrap;align-items:center;justify-content:space-between;margin-top:auto}
.dur{position:absolute;top:1.2rem;left:1.2rem;z-index:3;background:var(--deep);color:var(--sun);font:700 .85rem 'Bricolage Grotesque';padding:.3rem .7rem}
/* vehicles */
.vh{display:grid;gap:1.4rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,360px),1fr))}
.car{background:var(--deep);color:var(--sand);display:flex;flex-direction:column}.car .ph{aspect-ratio:16/10;background:radial-gradient(ellipse at 50% 100%,#2b5c5a,#06191e 70%)}
.car .ph img{object-fit:contain;padding:.6rem}.car .in{padding:1.2rem;display:grid;gap:.8rem;flex:1}.car .cat{font:.8rem system-ui;color:var(--surf)}
.spec{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid #ffffff26}.spec div{padding:.5rem;text-align:center;font-size:.85rem}.spec div+div{border-left:1px solid #ffffff26}.spec b{display:block;font-size:1.15rem;color:var(--sun)}
.car p{font-size:.95rem;opacity:.85}.car .btn{margin-top:auto}
/* places bento */
.bento{display:grid;gap:1rem;grid-template-columns:repeat(6,1fr);grid-auto-rows:minmax(230px,auto)}
.pl{position:relative;color:#fff;display:flex;align-items:flex-end;grid-column:span 2}.pl:nth-child(1){grid-column:span 4;grid-row:span 2}.pl:nth-child(4){grid-column:span 3}.pl:nth-child(5){grid-column:span 3}
.pl .ph{position:absolute;inset:0}.pl::before{content:"";position:absolute;inset:0;z-index:2;background:linear-gradient(0deg,#06191ecc,#0000 60%)}
.pl div.t{position:relative;z-index:3;padding:1.2rem}.pl p{font-size:.95rem;max-width:40ch}
@media(max-width:760px){.bento{grid-template-columns:1fr}.pl,.pl:nth-child(n){grid-column:auto;grid-row:auto;min-height:300px}}
/* gallery */
.gal{columns:3 260px;column-gap:1rem}.gal figure{break-inside:avoid;margin-bottom:1rem}.gal .ph{width:100%}.gal figcaption{font-size:.85rem;color:var(--mut);padding:.3rem 0}
/* misc */
.two{display:grid;gap:2rem;grid-template-columns:repeat(auto-fit,minmax(min(100%,420px),1fr));align-items:center}
.why{display:grid;gap:1px;background:#ffffff26;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr))}.why div{background:var(--ink);padding:1.6rem}.why p{opacity:.8;font-size:.98rem;margin-top:.4rem}
form{display:grid;gap:1rem;grid-template-columns:1fr 1fr}form .f{grid-column:1/-1}@media(min-width:700px){form .h{grid-column:auto}}
form .h{grid-column:1/-1}@media(min-width:700px){form .h{grid-column:auto}}
label{display:grid;gap:.3rem;font:600 .9rem 'Bricolage Grotesque'}input,select,textarea{font:1rem inherit;padding:.8rem;border:1.5px solid #0b2b3366;background:#fff;border-radius:var(--r);min-height:48px;width:100%}
iframe{width:100%;height:340px;border:0}footer{background:var(--deep);color:var(--sand);padding:3rem 0 2rem}footer .w{display:grid;gap:1.5rem;grid-template-columns:repeat(auto-fit,minmax(200px,1fr))}footer a{display:block;padding:.2rem 0}
.strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.6rem}.strip .ph{aspect-ratio:1}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

.uni{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr))}
.uni .pl,.uni .pl:nth-child(n){grid-column:auto;grid-row:auto;min-height:0;aspect-ratio:4/5}
.gal2{display:grid;gap:1rem;grid-template-columns:repeat(auto-fill,minmax(min(100%,160px),1fr));grid-auto-rows:110px;grid-auto-flow:dense}
.gi{position:relative;margin:0}.gi .ph{position:absolute;inset:0}.gi .ph::after{display:none}
.gi figcaption{position:absolute;z-index:3;left:0;right:0;bottom:0;padding:1.6rem .9rem .8rem;color:#fff;font:600 .85rem 'Bricolage Grotesque',sans-serif;background:linear-gradient(0deg,#06191ecc,#0000)}
.gi .ph svg{z-index:0}
.g0{grid-row:span 3;border-radius:999px 999px 0 0;overflow:hidden}
.g1{grid-row:span 2;grid-column:span 2;clip-path:polygon(9% 0,100% 0,91% 100%,0 100%)}
.g2{grid-row:span 2;clip-path:polygon(0 0,82% 0,100% 18%,100% 100%,0 100%)}
.g3{grid-row:span 3;clip-path:polygon(0 12%,100% 0,100% 88%,0 100%)}
@media(max-width:520px){.g1{grid-column:span 1}.gi figcaption{font-size:.75rem}}

.scene svg,.scene video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.scene video{z-index:1}
.wv{animation:wv 7s linear infinite}.w2{animation-duration:5s}.w3{animation-duration:3.500s}@keyframes wv{to{transform:translateX(-220px)}}
.rd{animation:rd .5s linear infinite}@keyframes rd{to{stroke-dashoffset:-130}}
.pm{animation:pm 18s linear infinite}.p2{animation-duration:11s;animation-delay:-5s}@keyframes pm{from{transform:translateX(1750px)}to{transform:translateX(-300px)}}
.cb{animation:cb .5s ease-in-out infinite alternate}@keyframes cb{to{transform:translateY(-2px)}}
.wh{transform-box:fill-box;transform-origin:center}
.ic{display:block;margin-bottom:.9rem;filter:drop-shadow(0 12px 10px #0007);transition:transform .3s}.why div:hover .ic{transform:translateY(-5px) rotate(-5deg)}

.slides img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;animation:sl 18s infinite;transform-origin:60% 60%}
.slides img:nth-child(2){animation-delay:6s;transform-origin:30% 50%}.slides img:nth-child(3){animation-delay:12s;transform-origin:70% 50%}
@keyframes sl{0%{opacity:0;transform:scale(1)}8%{opacity:1}33%{opacity:1}41%{opacity:0}100%{opacity:0;transform:scale(1.12)}}
@media(prefers-reduced-motion:reduce){.slides img:first-child{opacity:1}}

.hero{padding-bottom:clamp(8rem,22vh,12rem)}
.ph-hero.hero{min-height:0;padding:7rem 0 2.2rem;background:linear-gradient(120deg,#06191e,#0f3a44 70%,#164650);border-bottom:3px solid var(--sun)}
.ph-hero h1{font-size:clamp(1.7rem,4.5vw,2.8rem);font-weight:700;max-width:none;letter-spacing:-.01em}
.ph-hero h1::after{content:"";display:block;width:56px;height:3px;background:var(--sun);margin-top:.7rem}
.car .ph::after{display:none}

.gal2{grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));grid-auto-rows:auto;grid-auto-flow:row}
.gal2 .gi{aspect-ratio:4/3;grid-row:auto;grid-column:auto;clip-path:none;border-radius:0;overflow:hidden}

/* home hero: center the text block over the background images */
section.hero:not(.ph-hero){align-content:center;justify-items:center;text-align:center;padding:6rem 0}
section.hero:not(.ph-hero) .w{display:flex;flex-direction:column;align-items:center;justify-content:center}
section.hero:not(.ph-hero) h1{max-width:none}
section.hero:not(.ph-hero) .lead{margin-left:auto;margin-right:auto}
section.hero:not(.ph-hero) .cta{justify-content:center}

/* longer brand name: keep hero title and nav logo fitting */
section.hero:not(.ph-hero) h1{font-size:clamp(2rem,6.5vw,4.6rem);line-height:1.1}
.nav .logo{font-size:.85rem;white-space:normal;line-height:1.1;max-width:9.5rem}
@media(min-width:1100px){.nav .logo{white-space:nowrap;max-width:none;font-size:.95rem}}

/* about page: compact "Our Travel Promise" block */
.promise.sec{padding:clamp(1.8rem,4vw,3rem) 0}
.promise h2{font-size:clamp(1.4rem,3vw,2rem);margin-bottom:.8rem}
.promise .why{grid-template-columns:repeat(auto-fit,minmax(min(100%,190px),1fr))}
.promise .why div{padding:1rem}
.promise .ic{width:40px;height:40px;margin-bottom:.5rem}
.promise .why h3{font-size:1.05rem}
.promise .why p{font-size:.88rem;margin-top:.25rem}

/* about page: car photo beside "Local roads, local stories" */
.two .ph:has(img[src*="about-car"]){aspect-ratio:4/5;max-height:560px;width:100%;max-width:440px;justify-self:center;border-radius:14px}
.two .ph:has(img[src*="about-car"])::after{display:none}
.two .ph img[src*="about-car"]{object-position:50% 70%}

/* package photos: keep the subject in frame inside the 4:3 arch */
.pass .ph img[src*="pkg-murudeshwar"]{object-position:50% 47%}
.pass .ph img[src*="pkg-vibhooti"]{object-position:50% 38%}
.pass .ph img[src*="pkg-kumta"]{object-position:50% 60%}

/* popular places: 9 tiles -> tidy 3x3 on desktop */
@media(min-width:900px){.uni{grid-template-columns:repeat(3,1fr)}.uni .pl,.uni .pl:nth-child(n){aspect-ratio:1}}

/* place tiles: the name is already in the caption, so hide the duplicate label on the photo */
.pl .ph::after{display:none}
.pl .ph img[src*="place-mahabaleshwar"]{object-position:50% 35%}
.pl .ph img[src*="place-main-beach"]{object-position:40% 50%}

/* gallery car photos: keep the car in frame inside the 4:3 tile */
.gi .ph img[src*="gallery-ertiga"]{object-position:50% 36%}
.gi .ph img[src*="gallery-aura-side"]{object-position:50% 85%}
.gi .ph img[src*="gallery-aura-front"]{object-position:50% 85%}

/* home page: 4 popular places in one row on desktop */
@media(min-width:900px){.uni.u4{grid-template-columns:repeat(4,1fr)}.uni.u4 .pl,.uni.u4 .pl:nth-child(n){aspect-ratio:4/5}}

/* mobile: sharper hero (pre-cropped portrait images, no zoom softening) */
@keyframes slm{0%{opacity:0}8%{opacity:1}33%{opacity:1}41%{opacity:0}100%{opacity:0}}
@media(max-width:700px){
  .slides img{animation-name:slm;object-position:50% 50%!important;image-rendering:auto}
}
/* mobile nav: "V BHARATI" on line 1, "CABS AND TRAVELS" on line 2 */
@media(max-width:860px){
  .nav .logo{white-space:nowrap;max-width:none;line-height:1.15;font-size:.9rem}
  .nav .logo .l2{display:block}
}

/* home hero buttons: transparent glass look */
section.hero:not(.ph-hero) .cta .btn,section.hero:not(.ph-hero) .cta .btn.g{
  background:#ffffff1f;color:#fff;border:1px solid #ffffff59;
  -webkit-backdrop-filter:blur(12px) saturate(140%);backdrop-filter:blur(12px) saturate(140%);
  box-shadow:0 6px 24px #0000002e,inset 0 1px 0 #ffffff40;text-shadow:0 1px 3px #0006}
section.hero:not(.ph-hero) .cta .btn:hover{background:#ffffff33}

/* mobile: smaller "Popular in Gokarna" tiles (2 per row) */
@media(max-width:700px){
  .uni.u4{grid-template-columns:repeat(2,1fr);gap:.7rem}
  .uni.u4 .pl,.uni.u4 .pl:nth-child(n){aspect-ratio:1/1.15;min-height:0}
  .uni.u4 .pl div.t{padding:.7rem}
  .uni.u4 .pl h3{font-size:1rem;line-height:1.15}
  .uni.u4 .pl p{font-size:.75rem;line-height:1.3;margin-top:.2rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
}

/* "Need a website like this?" strip at the bottom of every page */
.webcredit{display:block;background:#04141a;color:#ffffffb3;text-align:center;text-decoration:none;font:500 .85rem 'Bricolage Grotesque',sans-serif;padding:.9rem 5rem;border-top:1px solid #ffffff1a}
.webcredit b{color:var(--sun);font-weight:700;margin-left:.2rem}
.webcredit:hover{color:#fff}
