/* The /about/ page, seven-section editorial story (build/about_story.py, assets/js/about-story.js). Everything is scoped to body.as.
   The default rules are the finished layout (reduced motion, or the script not loading); .as-anim adds the hidden starting states. */
body.as{--ink:#121212;--char:#1C1C1C;--ivory:#FFFFFF;--sage:var(--card);--line-d:rgba(255,255,255,.2);--line-l:rgba(20,21,18,.18);--gut:clamp(18px,3.4vw,56px);
  --disp:Anton,Impact,"Arial Narrow",sans-serif;--serif:"Instrument Serif",Georgia,"Times New Roman",serif;--sans:Manrope,Inter,system-ui,sans-serif;
  margin:0;background:var(--char);color:var(--ink);font:400 16px/1.6 var(--sans);overflow-x:clip}
.as *,.as *::before,.as *::after{box-sizing:border-box}
.as img{display:block;width:100%;height:100%;object-fit:cover}
.as figure{margin:0;overflow:hidden}
.as h1,.as h2,.as h3,.as p{margin:0}
.as-serif{font-family:var(--serif);font-weight:400;letter-spacing:-.012em}
.as-serif em{font-style:italic}
.as-d-t,.as-f-h{font-family:var(--disp);font-weight:400;letter-spacing:.002em;line-height:1.04;text-transform:uppercase}
.as-k{font:600 11.5px/1.4 var(--sans);letter-spacing:.17em;text-transform:uppercase}
.as .ln{display:block;overflow:hidden;padding-block:.04em}
.as .ln>i{display:block;font-style:inherit;transition:transform 1s cubic-bezier(.16,1,.3,1)}
.as-links{display:flex;flex-wrap:wrap;gap:8px 22px;margin-top:16px!important}
.as-links a{color:inherit;font-weight:600;font-size:14.5px;text-decoration:underline;text-underline-offset:4px}

/* reveals (assets/js/about-story.js adds .in) */
.as-anim .rv{opacity:0;transform:translateY(26px);transition:opacity .9s ease,transform 1s cubic-bezier(.16,1,.3,1)}
.as-anim .rv.in{opacity:1;transform:none}
.as-anim .ln:not(.in)>i{transform:translateY(112%)}
.as .m{overflow:hidden}
.as .m img{transition:transform 1.5s cubic-bezier(.16,1,.3,1)}
.as-anim .m img{clip-path:inset(100% 0 0 0);transition:clip-path 1.2s cubic-bezier(.65,0,.2,1),transform 1.5s cubic-bezier(.16,1,.3,1)}
.as-anim .m:not(.in) img{transform:scale(1.2)}
.as-anim .m.in img{clip-path:inset(0)}

/* top bar: minimal, the colour flips with whatever is behind it */
.as-nav{position:fixed;inset:0 0 auto 0;z-index:148;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:16px var(--gut);color:#fff;mix-blend-mode:difference;pointer-events:none}
.as-nav>*{pointer-events:auto;background:none;border:0;padding:6px 0;color:inherit;font:600 11.5px/1 var(--sans);letter-spacing:.14em;text-transform:uppercase;text-decoration:none;cursor:pointer}
.as-nav-m{justify-self:start}.as-nav-t{justify-self:end}
.as-brand{font-family:var(--serif);font-size:19px;font-weight:400;letter-spacing:.01em;text-transform:none;transition:opacity .3s}
@media (min-width:768px){.as:has(.fsb.on) .as-brand{opacity:0;pointer-events:none}}
.as .mnav-btn{display:none!important}

/* the floating search bar stays see-through; over dark sections its text turns light */
.as .fsb.fsb-d{color:var(--ivory);border-color:rgba(255,255,255,.65);background:rgba(28,29,27,.26)}
.as .fsb.fsb-d input{color:var(--ivory)}
.as .fsb.fsb-d input::placeholder{color:var(--ivory)}

/* 1. opening */
.as-o{position:relative;background:var(--char);color:var(--ivory)}
.as-o-stage{position:relative;height:100vh;height:100svh;overflow:hidden;display:grid;place-items:center}
.as-anim .as-o{height:280vh}
.as-anim .as-o-stage{position:sticky;top:0}
.as-o-h{--fs:min(25vh,27vw);--fb:min(25vh,15.6vw);text-align:center;font-weight:400;line-height:.98;margin-top:-1vh!important}
.as-o-h .ln{padding:0;will-change:transform,opacity}
.as-o-h .s{font:400 var(--fs)/1.02 var(--serif);letter-spacing:-.015em}
.as-o-h .s>i{transform-origin:50% 100%}
.as-o-h .b{font:400 var(--fb)/1.08 var(--disp)}
.as-o-h .ln>i{transition-duration:1.3s}
.as-o-h .l2>i{transition-delay:.12s}.as-o-h .l3>i{transition-delay:.24s}
.as-o-img{position:absolute;left:50%;top:50%;width:min(23vw,44vh);aspect-ratio:1.55;transform:translate(-50%,-50%);z-index:2}
.as-anim .as-o-img{left:0;top:0;width:100%;height:100%;aspect-ratio:auto;transform:none;clip-path:inset(50%);will-change:clip-path}
.as-anim .as-o-img img{will-change:transform}
.as-o-c{position:absolute;bottom:clamp(16px,3.6vh,34px);z-index:3;font:600 10.5px/1.5 var(--sans);letter-spacing:.14em;text-transform:uppercase;transition:opacity 1s ease 1s}
.as-o-c.left{left:var(--gut)}.as-o-c.right{right:var(--gut);text-align:right}
.as-anim .as-o:not(.in) .as-o-c{opacity:0}
.as-nav>*{transition:opacity 1s ease .7s}
.as-anim:not(.as-go) .as-nav>*{opacity:0}

/* 2. rooted in Mysuru */
.as-r{position:relative;z-index:1;background:var(--sage);padding:clamp(70px,13vh,140px) var(--gut) clamp(70px,14vh,150px)}
.as-r-h{font-size:clamp(46px,8.6vw,136px);line-height:1;margin-top:18px!important}
.as-r-g{display:grid;grid-template-columns:7fr 5fr;gap:clamp(24px,5vw,80px);margin-top:clamp(36px,7vh,80px);align-items:start}
.as-r-a{aspect-ratio:1.5}
.as-r-t{padding-top:clamp(0px,5vh,50px)}
.as-r-t>p{font-size:clamp(17px,1.5vw,21px);line-height:1.5}
.as-r-b{aspect-ratio:1.5;margin-top:clamp(28px,6vh,60px)!important}

/* 3. founder: the words on one side; on the other the photo in its own panel, a light mat on a fine grid, with nothing over it */
.as-f{background:var(--char);color:var(--ivory);position:relative}
.as-f-stage{position:relative;display:flex;flex-direction:column;padding:clamp(70px,12vh,120px) var(--gut) clamp(60px,10vh,110px);overflow:hidden}
.as-f-col{display:contents}
.as-f-head{order:1}
.as-f-h{font-size:clamp(58px,17vw,84px)}
.as-f-sub{font-size:clamp(24px,6vw,30px);margin-top:12px!important;font-style:italic}
.as-f-ph{order:2;display:grid;place-items:center;margin:30px 0 0!important;padding:clamp(22px,6vw,44px);border:1px solid var(--line-d);border-radius:22px;background-color:#242424;
  background-image:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.07) 1px,transparent 1px);background-size:44px 44px;background-position:center}
.as-f-mat{display:block;width:min(100%,340px);padding:9px;border-radius:16px;background:var(--ivory);box-shadow:0 26px 60px rgba(0,0,0,.45)}
.as .as-f-mat img{display:block;width:100%;height:auto;aspect-ratio:591/1115;object-fit:cover;border-radius:9px}
.as-f-name{order:3;margin-top:24px!important;font:400 clamp(70px,24vw,130px)/1 var(--disp);text-align:center;white-space:nowrap}
.as-f-name b{display:inline-block;overflow:hidden;font-weight:400;vertical-align:top}
.as-f-name u{display:inline-block;text-decoration:none;will-change:transform}
.as-f-txt{order:4;margin-top:22px;font-size:15.5px;line-height:1.6}
.as-f-txt p+p{margin-top:12px}
@media (min-width:1024px){
  .as-f-stage{height:100vh;height:100svh;padding:0;display:block}
  .as-f-col{position:absolute;left:var(--gut);top:11vh;bottom:4vh;width:calc(53% - var(--gut) - 28px);display:flex;flex-direction:column;justify-content:center;gap:2.4vh}
  .as-f-h{font-size:min(5vw,9.6vh);transform-origin:0 0}
  .as-f-sub{font-size:min(2.2vw,3.8vh)}
  .as-f-name{margin:0!important;font-size:min(10.8vw,20vh);text-align:left}
  .as-f-txt{margin:0;max-width:40em;font-size:min(15.5px,2.35vh);line-height:1.5}
  .as-f-txt p+p{margin-top:.6em}
  .as-f-ph{position:absolute;right:var(--gut);top:11vh;bottom:4vh;left:53%;margin:0!important;padding:2.2vh;z-index:2;grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(0,1fr)}
  .as-f-mat{justify-self:center;width:auto;height:100%;min-height:0;aspect-ratio:609/1133;padding:min(9px,1vh)}
  .as .as-f-mat img{height:100%;width:100%;aspect-ratio:auto}
  .as-anim .as-f{height:360vh}
  .as-anim .as-f-stage{position:sticky;top:0}
  .as-anim .as-f-ph{clip-path:inset(50%);will-change:clip-path}
  .as-anim .as-f-ph img{will-change:transform}
  .as-anim .as-f-h{will-change:transform}
  .as-anim .as-f-head .ln>i{transition:none}
  .as-anim .as-f-sub,.as-anim .f-p{opacity:0}
  .as-anim .as-f-name u{transform:translateY(105%)}
}
@media (max-width:1023px){
  .as-anim .as-f-mat img{clip-path:inset(30% 20%);transition:clip-path 1.4s cubic-bezier(.65,0,.2,1)}
  .as-anim .as-f-ph.in img{clip-path:inset(0)}
  .as-anim .as-f-name u{transform:translateY(105%);transition:transform 1s cubic-bezier(.16,1,.3,1)}
  .as-anim .as-f-name.in u{transform:none}
  .as-anim .as-f-name.in b:nth-child(n+3) u{transition-delay:.08s}.as-anim .as-f-name.in b:nth-child(n+5) u{transition-delay:.16s}.as-anim .as-f-name.in b:nth-child(n+7) u{transition-delay:.24s}
  .as-anim .f-p,.as-anim .as-f-sub{opacity:0;transform:translateY(18px);transition:opacity .8s ease,transform .9s cubic-bezier(.16,1,.3,1)}
  .as-anim .f-p.in,.as-anim .as-f-sub.in{opacity:1;transform:none}
}

/* 4. philosophy */
.as-p-h{background:var(--sage);padding:clamp(80px,16vh,170px) var(--gut);text-align:center}
.as-p-h h2{font-size:clamp(42px,7.6vw,122px);line-height:1.1;max-width:1320px;margin-inline:auto}
.as-in{display:inline-block;width:1.2em;height:.82em;vertical-align:-.08em;margin-inline:.03em;border-radius:3px}
.as-p-i{position:relative;display:grid;grid-template-columns:repeat(12,1fr);align-items:center;column-gap:16px;min-height:100vh;min-height:100svh;padding:clamp(70px,10vh,100px) var(--gut);overflow:hidden}
.as-p-i.dark{background:var(--char);color:var(--ivory)}
.as-p-i.light{background:var(--bg);color:var(--ink)}
.as-p-n{position:absolute;right:var(--gut);top:clamp(46px,8vh,80px);font:400 clamp(70px,13vw,210px)/1 var(--serif);opacity:.28}
.as-p-i.rev .as-p-n{right:auto;left:var(--gut)}
.as-anim .as-p-n.rv.in{opacity:.28}
.as-p-m{grid-column:6/12;grid-row:1;height:min(70vh,46vw);z-index:0}
.as-p-c{grid-column:1/8;grid-row:1;z-index:1;align-self:end;padding-bottom:6vh}
.as-p-c h3{font-size:clamp(66px,12.6vw,206px);line-height:1}
.as-p-c p{max-width:27em;margin-top:16px;font-size:clamp(16px,1.35vw,19px);line-height:1.5}
.as-p-i.rev .as-p-m{grid-column:2/8}
.as-p-i.rev .as-p-c{grid-column:6/13;text-align:right}
.as-p-i.rev .as-p-c p{margin-left:auto}
.as-p-i.light h3{color:var(--ink)}
.as-p-i.dark h3{color:var(--ivory)}
@media (min-width:768px){.as-p-i{position:sticky;top:0}}

/* 5. destinations and services */
.as-d{position:relative;z-index:1;background:var(--sage);padding:clamp(70px,13vh,140px) var(--gut)}
.as-d-h{font-size:clamp(54px,11.4vw,186px);line-height:1.03}
.as-d-reg{list-style:none;display:flex;flex-wrap:wrap;gap:4px clamp(14px,2.2vw,34px);margin:22px 0 0;padding:0;font:400 clamp(21px,2.6vw,38px)/1.2 var(--serif)}
.as-d-reg li+li::before{content:"·";margin-right:clamp(14px,2.2vw,34px);opacity:.5}
.as-d-x{display:grid;grid-template-columns:minmax(190px,3fr) 6fr 3fr;gap:clamp(20px,3vw,44px);margin-top:clamp(36px,8vh,84px);align-items:start}
.as-d-b{display:flex;align-items:baseline;gap:12px;width:100%;padding:12px 0;border:0;border-top:1px solid var(--line-l);background:none;color:inherit;text-align:left;font:400 clamp(25px,2.7vw,40px)/1.1 var(--serif);cursor:pointer;opacity:.5;transition:opacity .3s,padding .4s cubic-bezier(.16,1,.3,1)}
.as-d-b span{font:600 11px/1 var(--sans);letter-spacing:.1em}
.as-d-b.on,.as-d-b:hover,.as-d-b:focus-visible{opacity:1}
.as-d-b.on{padding-left:12px}
.as-d-stage{position:relative;aspect-ratio:1.45;overflow:hidden;background:#E6E6E6}
.as-d-pic{position:absolute;inset:0;clip-path:inset(0 0 100% 0);transition:clip-path .9s cubic-bezier(.65,0,.2,1);z-index:1}
.as-d-pic img{transform:scale(1.1);transition:transform 1.5s cubic-bezier(.16,1,.3,1)}
.as-d-pic.on{clip-path:inset(0);z-index:2}
.as-d-pic.on img{transform:none}
.as-d-pic.was{clip-path:inset(0);z-index:1}
.as-d-info{display:none}
.as-d-info.on{display:block;animation:as-up .7s cubic-bezier(.16,1,.3,1) both}
.as-d-info h3{font-size:clamp(28px,2.7vw,40px);line-height:1.08;margin-top:10px}
.as-d-info h3+p{margin-top:12px;font-size:15.5px;line-height:1.55}
@keyframes as-up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.as-s{margin-top:clamp(60px,12vh,120px)}
.as-s>h3{margin-bottom:16px}
.as-s-r{border-top:1px solid var(--line-l)}
.as-s-r:last-child{border-bottom:1px solid var(--line-l)}
.as-s-r summary{display:grid;grid-template-columns:clamp(36px,6vw,90px) 1fr 24px;align-items:center;padding:clamp(14px,2.2vh,22px) 0;cursor:pointer;list-style:none}
.as-s-r summary::-webkit-details-marker{display:none}
.as-s-r summary span{font:600 11px/1 var(--sans);letter-spacing:.1em}
.as-s-r summary b{font:400 clamp(26px,3.6vw,54px)/1.08 var(--serif);letter-spacing:-.01em;transition:transform .4s cubic-bezier(.16,1,.3,1)}
.as-s-r summary:hover b{transform:translateX(8px)}
.as-s-r summary i{position:relative;width:18px;height:18px}
.as-s-r summary i::before,.as-s-r summary i::after{content:"";position:absolute;left:0;right:0;top:50%;height:1.5px;background:currentColor;transition:transform .35s}
.as-s-r summary i::after{transform:rotate(90deg)}
.as-s-r[open] summary i::after{transform:none}
.as-s-b{max-width:760px;padding:0 0 26px clamp(36px,6vw,90px);font-size:15.5px;animation:as-up .5s ease both}
.as-s-b ol,.as-s-b ul{margin:12px 0 0;padding-left:20px}
.as-s-b li+li{margin-top:5px}

/* 6. why */
.as-w{position:relative;z-index:1;background:var(--char);color:var(--ivory);padding:clamp(80px,15vh,160px) var(--gut)}
.as-w-h{font-size:clamp(50px,8.5vw,140px);line-height:1.08}
.as-w-h .as-in{width:1.1em;height:.76em;vertical-align:-.04em}
.as-w-l{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:0 clamp(20px,3vw,48px);margin:clamp(44px,9vh,96px) 0 0;padding:0}
.as-w-l li{padding:20px 0 34px;border-top:1px solid var(--line-d)}
.as-w-l span{font:600 11px/1 var(--sans);letter-spacing:.1em;opacity:.7}
.as-w-l h3{font-size:clamp(28px,2.9vw,42px);line-height:1.08;margin-top:12px}
.as-w-l p{margin-top:10px;font-size:15.5px;line-height:1.55;color:rgba(255,255,255,.82)}
.as-w-l a{color:inherit;text-underline-offset:3px}

/* 7. final call */
.as-c{position:relative;z-index:1;min-height:100vh;min-height:100svh;display:grid;place-items:center;overflow:hidden;color:var(--ivory);text-align:center;background:var(--char)}
.as-c-bg{position:absolute;inset:0;will-change:transform}
.as-c::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(0,0,0,.42),rgba(0,0,0,.34) 45%,rgba(0,0,0,.62))}
.as-c-in{position:relative;z-index:2;padding:90px var(--gut) 60px}
.as-c h2{font-size:clamp(58px,11.6vw,190px);line-height:.98}
.as-c-in>p:not(.as-c-s){margin-top:18px;font-size:clamp(17px,1.5vw,21px)}
.as-c-b{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:28px}
.as-btn{display:inline-flex;align-items:center;height:52px;padding:0 28px;border:1px solid var(--ivory);border-radius:999px;background:var(--ivory);color:#111;font:600 12px/1 var(--sans);letter-spacing:.13em;text-transform:uppercase;text-decoration:none;cursor:pointer;transition:background .25s,color .25s,transform .25s}
.as-btn:hover{transform:translateY(-2px)}
.as-btn.ghost{background:transparent;color:var(--ivory)}
.as-btn.ghost:hover{background:var(--ivory);color:#111}
.as-c-s{display:flex;flex-wrap:wrap;justify-content:center;gap:4px 16px;margin-top:30px!important;font-size:12.5px}
.as-c-s a{color:inherit;opacity:.85;text-underline-offset:3px}
.as .dx-foot{margin-top:0;background:var(--sage);position:relative;z-index:1}
.as :focus-visible{outline:2px solid currentColor;outline-offset:3px}

@media (max-width:1023px){
  .as-d-x{grid-template-columns:1fr 1.7fr}
  .as-d-infos{grid-column:1/-1}
  .as-w-l{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:767px){
  .as-nav{padding:14px 16px}
  .as-brand{font-size:17px}
  .as-o-img{width:52vw;top:45%}
  .as-o-c{font-size:9px;max-width:44vw}
  .as-r-g{grid-template-columns:1fr}
  .as-p-i{display:block;min-height:0;padding:64px var(--gut)}
  .as-p-n{top:20px}
  .as-p-m{height:62vw;margin-top:44px}
  .as-p-c{padding:0;margin-top:-.42em;position:relative}
  .as-p-c h3{font-size:19.5vw}
  .as-p-i.rev .as-p-c{text-align:left}
  .as-p-i.rev .as-p-c p{margin-left:0}
  .as-p-i.rev .as-p-n{left:auto;right:var(--gut)}
  .as-d-h{font-size:14.2vw}
  .as-d-x{display:block}
  .as-d-list{display:flex;flex-wrap:wrap;gap:0 16px}
  .as-d-b{width:auto;border:0;padding:6px 0;font-size:24px;gap:6px}
  .as-d-b span{display:none}
  .as-d-b.on{padding-left:0;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:1px}
  .as-d-stage{margin-top:14px}
  .as-d-infos{margin-top:18px}
  .as-w-l{grid-template-columns:1fr}
  .as-w-h{font-size:14.4vw}
  .as-c h2{font-size:17vw}
  .as-btn{height:48px;padding:0 22px}
}
@media (prefers-reduced-motion:reduce){
  .as *{animation:none!important;transition:none!important}
}

/* 10 Nov 2026: the facts list (AP-10 F1), "How to find us" (AP-11 D1) and "Last updated" sit on the dark page background: ivory text, as the story sections use */
.as .tt-glance,.as .tt-updated{color:var(--ivory)}
.as .tt-glance a{color:var(--ivory);text-underline-offset:3px}