/* ================= v3 additions (loaded after styles.css) ================= */
/* pictures wrapped in <picture> for phone crops */
.pic>picture>img{position:absolute;inset:0;z-index:0;width:100%;height:100%;object-fit:cover;transition:transform 1.6s var(--out)}
.foot-cta>picture>img{inset:-10% 0;height:120%}
@media (hover:hover){.duo-panel:hover>picture>img{transform:scale(1.04)}}

/* headline words rise one after another */
.h2 .w{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.14em;margin-bottom:-.14em}
.h2 .w>span{display:inline-block}
html.js .h2.split[data-r]{opacity:1;transform:none}
html.js .h2.split .w>span{transform:translateY(112%)}
html.js .h2.split.in .w>span{transform:none;transition:transform 1.05s var(--out);transition-delay:calc(var(--k,0)*42ms)}
html.failsafe .h2.split .w>span{transform:none!important}

/* hero: reassurance line + Google rating */
.hero-meta{display:flex;align-items:center;flex-wrap:wrap;gap:10px 28px;margin-top:clamp(18px,2vw,28px)}
.hero-note{font-size:.88rem;color:rgba(255,255,255,.82)}
.hero .link-u{color:#fff}
.rating{display:inline-flex;align-items:center;gap:9px;font-size:.88rem;color:rgba(255,255,255,.86);transition:color .25s var(--out)}
.rating .stars{color:#F2C04E;font-size:.8rem;letter-spacing:.1em}
.rating b{font-weight:600;color:#fff}
@media (hover:hover){.rating:hover{color:#fff}}
html.js .hero-meta{opacity:0}
html.js.ready .hero-meta{opacity:1;transition:opacity 1s var(--out) 1.18s}
html.failsafe .hero-meta{opacity:1!important}

/* route builder */
.tile-btn{position:absolute;inset:0;z-index:2;width:100%;display:flex;flex-direction:column;justify-content:flex-end;align-items:flex-start;gap:7px;text-align:left;padding:clamp(18px,1.9vw,30px);color:#fff}
.tile-btn:focus-visible{outline:2px solid var(--cyan);outline-offset:-5px}
.tile-h{font-family:var(--disp);font-size:clamp(1.05rem,.9rem + .7vw,1.5rem);letter-spacing:-.03em;line-height:1.15}
.tile-p{font-size:.93rem;line-height:1.45;color:rgba(255,255,255,.86)}
.tile-go{display:flex;align-items:center;gap:10px;margin-top:8px;font-size:.7rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:#fff;opacity:0;transform:translateY(6px);transition:opacity .3s var(--out),transform .4s var(--out)}
.tile>img{transition:transform 1.6s var(--out),filter .6s var(--out)}
.tiles .tile:not(.sel)>img{filter:brightness(.6) saturate(.78)}
.tile.sel::before{content:"";position:absolute;inset:0;z-index:3;border:2px solid var(--cyan);pointer-events:none}
.tile.sel .tile-go{opacity:1;transform:none}
@media (hover:hover){.tiles .tile:hover>img{filter:none}.tile:hover .tile-go{opacity:1;transform:none}}
.route{margin-top:clamp(22px,2.6vw,40px)}
.route-panels{display:grid}
.route-panel{grid-area:1/1;opacity:0;visibility:hidden;transition:opacity .25s var(--in),visibility 0s .25s}
.route-panel.on{opacity:1;visibility:visible;transition:opacity .5s var(--out)}
.route-kicker{font-size:.74rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--on-dark-2)!important}
.route-kicker b{font-weight:600;color:var(--cyan)}
.route-steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(12px,1.6vw,26px);margin-top:clamp(16px,1.8vw,24px)}
.route-steps li{border-top:1.5px solid rgba(82,196,208,.7);padding-top:14px;display:flex;flex-direction:column;gap:10px;opacity:0;transform:translateY(14px)}
.route-panel.on .route-steps li{opacity:1;transform:none;transition:opacity .7s var(--out),transform .9s var(--out)}
.route-panel.on .route-steps li:nth-child(1){transition-delay:.10s}
.route-panel.on .route-steps li:nth-child(2){transition-delay:.17s}
.route-panel.on .route-steps li:nth-child(3){transition-delay:.24s}
.route-panel.on .route-steps li:nth-child(4){transition-delay:.31s}
.route-panel.on .route-steps li:nth-child(5){transition-delay:.38s}
.route-steps h4{font-family:var(--disp);font-weight:400;font-size:clamp(.84rem,.78rem + .3vw,1rem);letter-spacing:-.03em;line-height:1.25;margin:0 0 6px;color:#fff}
.route-steps p{font-size:.9rem;line-height:1.5}
.route-foot{display:flex;justify-content:space-between;align-items:center;gap:18px 30px;flex-wrap:wrap;margin-top:clamp(26px,3vw,44px);padding-top:clamp(20px,2.2vw,30px);border-top:1px solid var(--line-dark)}
.route-foot p{max-width:36rem;font-size:.95rem}
@media (max-width:960px){
  .route-steps{grid-template-columns:1fr;gap:0}
  .route-steps li{flex-direction:row;gap:16px;padding:14px 0;border-top:1px solid var(--line-dark)}
  .route-steps li .num{padding-top:3px}
}
@media (max-width:520px){
  .tiles{grid-template-columns:repeat(2,minmax(0,1fr))}
  .tile{aspect-ratio:3/3.7}
  .tile-p{font-size:.8rem}
  .tile-btn{padding:14px}
  .tile-go{display:none}
}

/* your first visit */
.first-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(30px,6vw,110px);align-items:start}
.first-list{margin-top:clamp(26px,3.4vw,48px)}
.first-list li{display:grid;grid-template-columns:auto 1fr;gap:18px;padding:clamp(18px,2vw,24px) 0;border-top:1px solid var(--line-dark)}
.first-list li:last-child{border-bottom:1px solid var(--line-dark)}
.first-list .num{padding-top:4px}
.first-list h3{font-family:var(--disp);font-size:clamp(.95rem,.88rem + .35vw,1.14rem);letter-spacing:-.03em;margin-bottom:6px}
.first-list p{font-size:.97rem}
.first-cta{display:flex;align-items:center;gap:16px 28px;flex-wrap:wrap;margin-top:clamp(26px,3vw,40px)}
.first-cta .link-u{color:#fff}
.map{position:relative;aspect-ratio:16/10;overflow:hidden;background:var(--ink)}
.map iframe{position:absolute;inset:0;width:100%;height:100%;border:0;filter:grayscale(1) invert(.92) contrast(.88) brightness(.95)}
.map::after{content:"";position:absolute;inset:0;background:#0B6B70;mix-blend-mode:color;opacity:.7;pointer-events:none}
.place-row{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(18px,3vw,44px);margin-top:clamp(20px,2.4vw,30px)}
.place-row h3{font-size:.72rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--cyan);margin-bottom:12px}
.place-row p{font-size:.97rem;line-height:1.6}
.place-row a{color:#fff}
.hours{margin:0}
.hours div{display:flex;justify-content:space-between;gap:16px;padding:7px 0;border-bottom:1px solid var(--line-dark);font-size:.94rem}
.hours dt{color:var(--on-dark-2)}
.hours dd{color:#fff;text-align:right}
.open-state{display:inline-flex;align-items:center;gap:9px;margin-top:12px;font-size:.86rem;font-weight:600;color:#fff!important}
.open-state::before{content:"";width:8px;height:8px;border-radius:50%;background:#8C9A99}
.open-state[data-open="1"]::before{background:#4FD08A;box-shadow:0 0 0 4px rgba(79,208,138,.2)}
.open-state[hidden]{display:none}
.rating-lg{margin-top:clamp(18px,2vw,26px)}
@media (max-width:960px){.first-grid{grid-template-columns:1fr}}
@media (max-width:460px){.place-row{grid-template-columns:1fr}}

/* phone dock: the Book button is always one tap away */
.dock{position:fixed;z-index:57;left:74px;right:14px;bottom:calc(14px + env(safe-area-inset-bottom,0px));display:none;opacity:0;transform:translateY(18px);pointer-events:none;transition:opacity .3s var(--in),transform .3s var(--in)}
.dock .btn{flex:1;justify-content:center;padding-block:16px;box-shadow:0 16px 34px -10px rgba(0,0,0,.7)}
.dock.show{opacity:1;transform:none;pointer-events:auto;transition:opacity .45s var(--out),transform .6s var(--out)}
@media (max-width:1080px){.dock{display:flex}}

@media (prefers-reduced-motion:reduce){
  html.js .h2.split .w>span,.route-steps li{transform:none;opacity:1}
}