/* Dolphin Charter — panel effects (spotlight edges, spring tilt, unfold reveals, ambient dust) */
@property --ang{syntax:"<angle>";inherits:false;initial-value:0deg}

/* ---------- panel shell ---------- */
.pnl{position:relative;isolation:isolate}
#qform{position:relative}
.p-glow,.p-edge,.p-orbit,.p-glare{position:absolute;inset:0;pointer-events:none;border-radius:inherit}
/* soft light pooling under the cursor */
.p-glow{z-index:0;opacity:0;transition:opacity .6s var(--ease);
  background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%),rgba(226,210,172,.09),rgba(200,177,131,.035) 40%,transparent 70%)}
/* 1px border that ignites near the cursor */
.p-edge{z-index:5;padding:1px;opacity:0;transition:opacity .5s var(--ease);
  background:radial-gradient(240px circle at var(--mx,50%) var(--my,50%),rgba(255,244,220,.95),rgba(226,210,172,.45) 35%,rgba(200,177,131,0) 70%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0)}
/* a comet of light that travels around the border */
.p-orbit{z-index:5;padding:1px;opacity:0;transition:opacity .7s var(--ease);
  background:conic-gradient(from var(--ang),transparent 0 62%,rgba(200,177,131,.15) 74%,rgba(255,240,205,.95) 86%,rgba(200,177,131,.15) 94%,transparent 100%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);
  animation:orbit 4.2s linear infinite;animation-play-state:paused}
@keyframes orbit{to{--ang:360deg}}
/* specular glare that follows the tilt */
.p-glare{z-index:4;opacity:0;mix-blend-mode:soft-light;transition:opacity .5s var(--ease);
  background:radial-gradient(520px circle at var(--gx,50%) var(--gy,0%),rgba(255,248,230,.55),rgba(255,248,230,0) 55%)}
.pnl>*:not(.p-glow):not(.p-edge):not(.p-orbit):not(.p-glare):not(.wm){position:relative;z-index:1}
.pnl.hot .p-glow,.pnl.hot .p-edge,.pnl.hot .p-glare{opacity:1}
.pnl.hot .p-orbit,.pnl.live .p-orbit{opacity:.9;animation-play-state:running}
.tilt .sheen{display:none}
.tilt{transition:border-color .4s,box-shadow .6s var(--ease);will-change:transform}
.tc:hover,.cc:hover{box-shadow:none}
.tc .bd,.cc .bd{transition:transform .6s var(--ease)}
.tc .ph img,.cc .ph img{transition:transform 1.4s var(--ease),translate .9s var(--ease)}

/* ---------- unfold reveal for card grids ---------- */
.stagger.unfold>*{opacity:0;transform:perspective(1400px) translateY(70px) rotateX(16deg) scale(.95);filter:blur(10px);
  clip-path:inset(12% 0 0 0);transform-origin:50% 0;
  transition:opacity 1.2s var(--ease) var(--d,0s),transform 1.5s var(--ease) var(--d,0s),filter 1.2s var(--ease) var(--d,0s),clip-path 1.5s var(--ease) var(--d,0s)}
.stagger.unfold.in>*{opacity:1;transform:none;filter:none;clip-path:inset(0 0 0 0)}
.stagger.unfold.in>.tilt.settled{transition:border-color .4s,box-shadow .6s var(--ease)}
/* gold curtain that slides off card photos */
.curtain{position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(100deg,#b59c6c,var(--gold2) 50%,#b59c6c);transform-origin:100% 50%;transform:scaleX(1)}
.curtain::after{content:"";position:absolute;inset:0;background:var(--navy);transform-origin:0 50%;transform:scaleX(1)}
.in .curtain::after{transform:scaleX(0);transition:transform .7s cubic-bezier(.7,0,.2,1) calc(var(--d,0s) + .25s)}
.in .curtain{transform:scaleX(0);transition:transform 1s cubic-bezier(.7,0,.2,1) calc(var(--d,0s) + .75s)}
.unfold .ph img{scale:1.22;transition:scale 2.4s var(--ease) calc(var(--d,0s) + .8s),transform 1.4s var(--ease),translate .9s var(--ease)}
.unfold.in .ph img{scale:1}

/* ---------- headings: rise + one pass of gold light ---------- */
h2.sh{background:linear-gradient(100deg,var(--ivory) 0 42%,#fff6dc 48%,var(--gold2) 50%,#fff6dc 52%,var(--ivory) 58% 100%);background-size:320% 100%;background-position:100% 0;
  -webkit-background-clip:text;background-clip:text;color:transparent}
h2.sh.lit{animation:hsweep 2.6s var(--ease) .5s forwards}
@keyframes hsweep{to{background-position:0 0}}

/* ---------- stats ---------- */
.stats .wrap>div::after{content:"";position:absolute;left:50%;bottom:26px;width:56px;height:1px;margin-left:-28px;background:linear-gradient(90deg,transparent,var(--gold2),transparent);transform:scaleX(0);transition:transform 2s var(--ease)}
.stats .wrap.in>div::after{transform:scaleX(1)}
.stats .wrap.in>div:nth-child(2)::after{transition-delay:.15s}.stats .wrap.in>div:nth-child(3)::after{transition-delay:.3s}.stats .wrap.in>div:nth-child(4)::after{transition-delay:.45s}
.stats b{text-shadow:0 0 0 rgba(226,210,172,0);transition:text-shadow 1.2s}
.stats .wrap.in b{text-shadow:0 0 28px rgba(226,210,172,.28)}

/* ---------- services: roman numeral watermark ---------- */
.svc>div .wm{position:absolute;right:14px;bottom:-30px;font-family:"Cormorant Garamond",serif;font-style:italic;font-size:150px;line-height:1;color:rgba(200,177,131,.07);transform:translate(20px,20px);opacity:0;transition:transform 1s var(--ease),opacity .8s;pointer-events:none;z-index:0}
.svc>div:hover .wm,.svc>div.live .wm{transform:none;opacity:1}
.svc>div h3{transition:color .4s,transform .6s var(--ease)}
.svc>div:hover h3{color:var(--gold2);transform:translateX(6px)}

/* ---------- plans table ---------- */
.plans tbody tr{opacity:0;transform:translateY(22px);transition:opacity 1s var(--ease) var(--d,0s),transform 1s var(--ease) var(--d,0s)}
.plans table.in tbody tr{opacity:1;transform:none}
.plans tbody tr td:first-child{position:relative}
.plans tbody tr td:first-child::before{content:"";position:absolute;left:0;top:18%;bottom:18%;width:2px;background:linear-gradient(var(--gold3),var(--gold));transform:scaleY(0);transition:transform .5s var(--ease)}
.plans tbody tr:hover td:first-child::before{transform:scaleY(1)}
.plans tbody tr:hover td.p b{color:var(--gold3);text-shadow:0 0 18px rgba(226,210,172,.4)}
td.p b{transition:color .4s,text-shadow .4s}
.plans tr.pop td{background:linear-gradient(90deg,rgba(200,177,131,.04),rgba(226,210,172,.14) 50%,rgba(200,177,131,.04)) 0 0/200% 100%;animation:popflow 7s linear infinite}
@keyframes popflow{to{background-position:-200% 0}}
.badge{position:relative;overflow:hidden}
.badge::after{content:"";position:absolute;top:0;left:-70%;width:50%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,.75),transparent);transform:skewX(-20deg);animation:btnshine 3.6s ease-in-out infinite}

/* ---------- fleet chips ---------- */
.fl span{position:relative;overflow:hidden}
.fl span::after{content:"";position:absolute;inset:0;background:linear-gradient(100deg,transparent 30%,rgba(243,231,200,.12) 50%,transparent 70%);transform:translateX(-100%);transition:transform .9s var(--ease)}
.fl span:hover::after{transform:translateX(100%)}
.fl span:hover::before{background:var(--gold3);box-shadow:0 0 10px var(--gold2)}

/* ---------- process flow: a spark travels the line, steps light in turn ---------- */
.flow .spark{position:absolute;top:27px;left:12.5%;width:7px;height:7px;margin-left:-3px;border-radius:50%;background:#fff3d6;box-shadow:0 0 12px 3px rgba(243,231,200,.7),0 0 30px 6px rgba(200,177,131,.35);opacity:0;z-index:1}
.flow.in .spark{animation:spark 6.4s cubic-bezier(.45,0,.3,1) 2.4s infinite}
@keyframes spark{0%{left:12.5%;opacity:0}6%{opacity:1}94%{opacity:1}100%{left:87.5%;opacity:0}}
.flow.in>div i{animation:steplit 6.4s ease-in-out 2.4s infinite}
.flow.in>div:nth-child(3) i{animation-delay:3.95s}.flow.in>div:nth-child(4) i{animation-delay:5.5s}.flow.in>div:nth-child(5) i{animation-delay:7.05s}
@keyframes steplit{0%,100%{box-shadow:0 0 0 0 rgba(226,210,172,0);color:var(--gold);background:var(--navy2)}6%,18%{box-shadow:0 0 26px 2px rgba(226,210,172,.45);color:var(--navy);background:var(--gold2)}30%{box-shadow:0 0 0 0 rgba(226,210,172,0);color:var(--gold);background:var(--navy2)}}

/* ---------- promises: icon halo ---------- */
.prom svg{transition:transform .8s var(--ease),filter .8s}
.prom>div:hover svg,.prom>div.live svg{transform:translateY(-4px) scale(1.08);filter:drop-shadow(0 0 10px rgba(226,210,172,.55))}

/* ---------- reviews: stars ignite one by one ---------- */
.revs .st span{display:inline-block;opacity:.15;transform:scale(.4) rotate(-40deg);transition:opacity .5s,transform .7s cubic-bezier(.3,1.6,.5,1),text-shadow .6s}
.revs.in .st span{opacity:1;transform:none;text-shadow:0 0 12px rgba(226,210,172,.6)}
.revs blockquote::before{transition:transform 1.2s var(--ease),color .6s}
.revs blockquote:hover::before{transform:translateY(8px) rotate(-6deg);color:rgba(200,177,131,.22)}

/* ---------- column cards: arrow line + category glint ---------- */
.cc .cat{transition:letter-spacing .6s var(--ease),color .4s}
.cc:hover .cat{letter-spacing:.38em;color:var(--gold2)}

/* ---------- FAQ ---------- */
details{position:relative}
details::before{content:"";position:absolute;left:-18px;top:22px;bottom:22px;width:1px;background:linear-gradient(var(--gold3),var(--gold),transparent);transform:scaleY(0);transform-origin:top;transition:transform .7s var(--ease)}
details[open]::before{transform:scaleY(1)}
details[open] summary{color:var(--gold2)}

/* ---------- click ripple ---------- */
.rip{position:absolute;border-radius:50%;pointer-events:none;z-index:0;width:10px;height:10px;margin:-5px 0 0 -5px;background:radial-gradient(circle,rgba(255,246,226,.75),rgba(226,210,172,.25) 45%,transparent 70%);animation:rip .9s var(--ease) forwards}
@keyframes rip{to{transform:scale(46);opacity:0}}
.btn,.chs a,form button{position:relative;overflow:hidden}

/* ---------- ambient gold dust ---------- */
.dust{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
.tours>.wrap,.plans>.wrap,.column>.wrap,.contact>.wrap{position:relative;z-index:1}

@media (hover:none),(pointer:coarse){
  .p-glow,.p-glare{display:none}
}
@media (prefers-reduced-motion:reduce){
  .stagger.unfold>*,.plans tbody tr{opacity:1!important;transform:none!important;filter:none!important;clip-path:none!important}
  .curtain,.flow .spark,.dust{display:none}
  .unfold .ph img{scale:1}
  h2.sh{color:var(--ivory);background:none}
  .revs .st span{opacity:1;transform:none}
  .prom svg path,.prom svg circle{stroke-dashoffset:0!important}
  .kick::before,.kick::after,.flow::before,.rule,.stats .wrap>div::after{transform:none!important}
  .rule-wrap::after{transform:rotate(45deg)!important}
}
