/* Nandanvan hospitality group — site styles
   Palette: garden ink, leaf, khadi, marigold, kumkum
   Type: Marcellus (display) / Karla (text) */

:root{
  --ink:#0F2119;
  --ink-80:rgba(15,33,25,.80);
  --ink-60:rgba(15,33,25,.62);
  --leaf:#2F5A45;
  --leaf-soft:#4C7A63;
  --khadi:#E9E6D7;
  --khadi-deep:#DCD8C4;
  --paper:#FBFAF3;
  --marigold:#E3A11B;
  --marigold-deep:#B97E0C;
  --kumkum:#8C2B3E;
  --rule:rgba(15,33,25,.16);

  --f-display:"Marcellus",Georgia,"Times New Roman",serif;
  --f-text:"Karla","Helvetica Neue",Arial,sans-serif;

  --step--1:clamp(.82rem,.79rem + .14vw,.9rem);
  --step-0:clamp(1rem,.96rem + .2vw,1.09rem);
  --step-1:clamp(1.2rem,1.12rem + .4vw,1.4rem);
  --step-2:clamp(1.45rem,1.3rem + .75vw,1.85rem);
  --step-3:clamp(1.8rem,1.5rem + 1.5vw,2.6rem);
  --step-4:clamp(2.3rem,1.7rem + 3vw,4.1rem);

  --wrap:min(1180px,calc(100% - 2.5rem));
  --gap:clamp(1.25rem,3vw,2.5rem);
  --band:clamp(3.5rem,7vw,6.5rem);
  --shadow:0 18px 40px -26px rgba(15,33,25,.55);
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}
body{
  margin:0;background:var(--paper);color:var(--ink);
  font-family:var(--f-text);font-size:var(--step-0);line-height:1.65;
  font-variant-numeric:oldstyle-nums;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--marigold);outline-offset:3px;border-radius:2px}

h1,h2,h3,h4{font-family:var(--f-display);font-weight:400;line-height:1.12;margin:0 0 .5em;letter-spacing:.005em}
h1{font-size:var(--step-4)}
h2{font-size:var(--step-3)}
h3{font-size:var(--step-1)}
p{margin:0 0 1.1em;max-width:68ch}
.lede{font-size:var(--step-1);line-height:1.5;color:var(--ink-80);max-width:56ch}

.wrap{width:var(--wrap);margin-inline:auto}
.band{padding-block:var(--band)}
.band--tint{background:var(--khadi)}
.band--ink{background:var(--ink);color:var(--paper)}
.band--ink p{color:rgba(251,250,243,.78)}
.band--ink a{color:var(--marigold)}
.skip{position:absolute;left:-9999px}
.skip:focus{left:1rem;top:1rem;z-index:99;background:var(--ink);color:var(--paper);padding:.6rem 1rem}

/* ---------- masthead ---------- */
.masthead{position:sticky;top:0;z-index:50;background:rgba(251,250,243,.94);backdrop-filter:blur(8px);border-bottom:1px solid var(--rule)}
.masthead__inner{width:var(--wrap);margin-inline:auto;display:flex;align-items:center;gap:1rem;min-height:72px}
.brand{display:flex;align-items:center;gap:.65rem;text-decoration:none;margin-right:auto}
.brand svg{width:34px;height:34px;flex:none}
.brand__name{font-family:var(--f-display);font-weight:400;font-size:1.28rem;letter-spacing:.02em;display:block;line-height:1.05}
.brand__sub{display:block;font-size:.66rem;letter-spacing:.2em;color:var(--ink-60);text-transform:uppercase;margin-top:.15rem}
.nav{display:flex;gap:clamp(.9rem,2vw,1.7rem);align-items:center}
.nav a{text-decoration:none;font-size:.95rem;padding:.35rem 0;border-bottom:2px solid transparent;color:var(--ink-80)}
.nav a:hover{color:var(--ink);border-bottom-color:var(--marigold)}
.nav a[aria-current="page"]{color:var(--ink);border-bottom-color:var(--leaf)}
.navtoggle{display:none;background:none;border:1px solid var(--rule);border-radius:6px;padding:.5rem .7rem;font:inherit;font-size:.9rem;cursor:pointer}
@media (max-width:860px){
  .navtoggle{display:block}
  .nav{position:absolute;inset:72px 0 auto 0;background:var(--paper);border-bottom:1px solid var(--rule);flex-direction:column;align-items:flex-start;gap:0;padding:.5rem 1.25rem 1.25rem;display:none}
  .nav[data-open="true"]{display:flex}
  .nav a{width:100%;padding:.7rem 0;border-bottom:1px solid var(--rule)}
}

/* ---------- arches (the motif) ---------- */
.arch{
  position:relative;border-radius:999px 999px 10px 10px;overflow:hidden;
  background:linear-gradient(170deg,var(--leaf),var(--ink));
  aspect-ratio:3/4.4;display:flex;flex-direction:column;justify-content:flex-end;
  padding:1.4rem;color:var(--paper);text-decoration:none;box-shadow:var(--shadow);
  isolation:isolate;
}
.arch::before{
  content:"";position:absolute;inset:0;z-index:-1;opacity:.5;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='48' height='48'%3E%3Cpath d='M24 0c6 8 12 12 24 12-12 0-18 4-24 12-6-8-12-12-24-12 12 0 18-4 24-12z' fill='none' stroke='%23FBFAF3' stroke-opacity='.35'/%3E%3C/svg%3E");
  background-size:48px 48px;
}
.arch::after{content:"";position:absolute;inset:auto 0 0 0;height:62%;z-index:-1;background:linear-gradient(to top,rgba(15,33,25,.92),rgba(15,33,25,0))}
.arch--marigold{background:linear-gradient(170deg,#C98A18,#7A4B0A)}
.arch--kumkum{background:linear-gradient(170deg,#9B3348,#4A1521)}
.arch--leaf{background:linear-gradient(170deg,#3F7158,#13291F)}
.arch__type{font-size:.78rem;letter-spacing:.04em;color:rgba(251,250,243,.74);margin-bottom:.3rem}
.arch h3{color:var(--paper);margin:0 0 .3rem;font-size:var(--step-1)}
.arch p{color:rgba(251,250,243,.8);font-size:var(--step--1);margin:0;max-width:30ch}
a.arch{transition:transform .35s ease,box-shadow .35s ease}
a.arch:hover{transform:translateY(-6px);box-shadow:0 26px 50px -26px rgba(15,33,25,.7)}

/* ---------- hero ---------- */
.hero{padding-block:clamp(2.5rem,6vw,5rem) var(--band);background:
  radial-gradient(120% 80% at 88% 0%,rgba(227,161,27,.16),transparent 60%),var(--paper)}
.hero__grid{display:grid;grid-template-columns:1.05fr .95fr;gap:var(--gap);align-items:center}
.hero__arches{display:grid;grid-template-columns:repeat(3,1fr);gap:.9rem;align-items:end}
.hero__arches .arch:nth-child(2){aspect-ratio:3/5.3}
.hero h1{margin-bottom:.35em}
.hero .kicker{font-size:.95rem;color:var(--leaf);margin:0 0 1.1rem}
@media (max-width:900px){.hero__grid{grid-template-columns:1fr}.hero__arches{gap:.6rem}}
@media (max-width:640px){
  .hero__arches{grid-template-columns:1fr}
  .arch,.hero__arches .arch:nth-child(2){aspect-ratio:auto;min-height:11rem;border-radius:7rem 7rem 10px 10px;justify-content:flex-end}
  .arch p{max-width:40ch}
}

.reveal{opacity:0;transform:translateY(18px)}
.js-ready .reveal{animation:rise .8s cubic-bezier(.2,.7,.3,1) forwards}
.js-ready .reveal:nth-child(2){animation-delay:.09s}
.js-ready .reveal:nth-child(3){animation-delay:.18s}
@keyframes rise{to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none}}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--f-text);font-size:.95rem;
  padding:.85rem 1.5rem;border-radius:999px;text-decoration:none;border:1px solid transparent;cursor:pointer;
  transition:background .25s ease,color .25s ease,border-color .25s ease}
.btn--primary{background:var(--ink);color:var(--paper)}
.btn--primary:hover{background:var(--leaf)}
.btn--ghost{border-color:var(--ink);color:var(--ink)}
.btn--ghost:hover{background:var(--ink);color:var(--paper)}
.btn--light{border-color:rgba(251,250,243,.55);color:#FBFAF3}
.btn--light:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.btn--gold{background:var(--marigold);color:var(--ink);font-weight:600}
.btn--gold:hover{background:var(--marigold-deep);color:var(--paper)}
.btnrow{display:flex;flex-wrap:wrap;gap:.75rem;margin-top:1.6rem}

/* ---------- layout helpers ---------- */
.grid{display:grid;gap:var(--gap)}
.grid--3{grid-template-columns:repeat(auto-fit,minmax(240px,1fr))}
.grid--2{grid-template-columns:repeat(auto-fit,minmax(300px,1fr))}
.split{display:grid;grid-template-columns:.8fr 1.2fr;gap:var(--gap);align-items:start}
@media (max-width:820px){.split{grid-template-columns:1fr}}
.sectionhead{max-width:50ch;margin-bottom:clamp(1.8rem,4vw,3rem)}

.feature{border-top:2px solid var(--ink);padding-top:1rem}
.feature h3{margin-bottom:.35em}
.feature p{font-size:var(--step--1);color:var(--ink-60);margin:0}

.facts{width:100%;border-collapse:collapse;margin:0 0 1.5rem;font-size:var(--step--1)}
.facts th,.facts td{text-align:left;padding:.75rem .5rem;border-bottom:1px solid var(--rule);vertical-align:top}
.facts th{width:36%;font-weight:600;color:var(--leaf)}

.ticklist{list-style:none;padding:0;margin:0 0 1.5rem;display:grid;gap:.55rem}
.ticklist li{padding-left:1.6rem;position:relative;color:var(--ink-80)}
.ticklist li::before{content:"";position:absolute;left:0;top:.62em;width:.6rem;height:.6rem;border-radius:50%;background:var(--marigold)}

.pricecard{background:var(--paper);border:1px solid var(--rule);border-radius:10px 10px 10px 10px;padding:1.6rem}
.band--tint .pricecard{box-shadow:var(--shadow)}
.pricecard h3{margin-bottom:.2em}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.pricecard .from{font-family:var(--f-display);font-size:var(--step-2);color:var(--kumkum);display:block;margin-bottom:.6rem}

.menu{display:grid;gap:2rem 4rem;grid-template-columns:1fr 1fr}
@media (max-width:720px){.menu{grid-template-columns:1fr}}
.menu__group h3{border-bottom:1px solid var(--rule);padding-bottom:.4rem;margin-bottom:.7rem}
.menu__item{display:flex;justify-content:space-between;gap:1rem;padding:.3rem 0;font-size:var(--step--1)}
.menu__item span:last-child{color:var(--leaf);white-space:nowrap}

.quote{font-family:var(--f-display);font-size:var(--step-2);line-height:1.35;max-width:26ch;margin:0}
.quote+cite{display:block;margin-top:1rem;font-style:normal;font-size:var(--step--1);color:var(--ink-60)}

.crumbs{font-size:var(--step--1);color:var(--ink-60);padding:1rem 0 0}
.crumbs a{text-decoration:none;border-bottom:1px solid var(--rule)}
.crumbs a:hover{border-bottom-color:var(--marigold)}

.pagehero{background:var(--ink);color:var(--paper);padding-block:clamp(3rem,7vw,5.5rem);
  background-image:radial-gradient(90% 120% at 100% 0%,rgba(227,161,27,.22),transparent 55%)}
.pagehero h1{color:var(--paper);max-width:18ch}
.pagehero p{color:rgba(251,250,243,.8);max-width:52ch}
.pagehero .crumbs{margin-bottom:1.6rem}
.pagehero .crumbs{color:rgba(251,250,243,.6);padding-top:0}
.pagehero .crumbs a{color:rgba(251,250,243,.8)}

/* ---------- form ---------- */
.form{display:grid;gap:1rem;max-width:44rem}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
@media (max-width:640px){.form__row{grid-template-columns:1fr}}
label{display:grid;gap:.35rem;font-size:var(--step--1);color:var(--leaf);font-weight:600}
input,select,textarea{font:inherit;font-size:var(--step-0);padding:.7rem .8rem;border:1px solid var(--rule);
  border-radius:6px;background:var(--paper);color:var(--ink);width:100%}
input:focus,select:focus,textarea:focus{border-color:var(--leaf)}
textarea{min-height:8rem;resize:vertical}

/* ---------- footer ---------- */
.footer{background:var(--ink);color:rgba(251,250,243,.72);padding-block:clamp(3rem,6vw,4.5rem) 2rem;font-size:var(--step--1)}
.footer a{color:rgba(251,250,243,.78);text-decoration:none}
.footer a:hover{color:var(--marigold)}
.footer h4{font-family:var(--f-display);color:var(--paper);font-size:1.05rem;margin:0 0 .8rem;font-weight:400}
.footer ul{list-style:none;padding:0;margin:0;display:grid;gap:.45rem}
.footer__grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:var(--gap)}
@media (max-width:820px){.footer__grid{grid-template-columns:1fr 1fr}}
@media (max-width:480px){.footer__grid{grid-template-columns:1fr}}
.footer__base{margin-top:2.5rem;padding-top:1.5rem;border-top:1px solid rgba(251,250,243,.15);display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between}

.callbar{position:fixed;left:0;right:0;bottom:0;z-index:40;display:none;background:var(--ink);padding:.6rem;gap:.6rem}
.callbar .btn{flex:1;justify-content:center;padding:.7rem}
@media (max-width:700px){.callbar{display:flex}body{padding-bottom:4.2rem}}