/**
 * @license
 * MyFonts Webfont Build ID 3867246, 2020-12-16T11:57:38-0500
 * 
 * The fonts listed in this notice are subject to the End User License
 * Agreement(s) entered into by the website owner. All other parties are 
 * explicitly restricted from using the Licensed Webfonts(s).
 * 
 * You may obtain a valid license at the URLs below.
 * 
 * Webfont: Bauhaus 93 Std Regular by URW Type Foundry
 * URL: https://www.myfonts.com/collections/urw-foundry
 
 * © 2026 MyFonts Inc. */
/* Licensed webfont: MyFonts order #7348748, Webfonts 10,000 pageviews/month, House of R, Inc., expires 22 Oct 2027 ("Ordered Version" kit = same design as before) */
@font-face{font-family:"Bauhaus 93";src:url("bauhaus93std.woff2") format("woff2"),url("bauhaus93std.woff") format("woff");font-display:swap}
/* Too Much Tours · shared styles · Script 01 v2 + Update 03
   Palette is the brand guide only: 5 colors + white. No tints, no greys.
   Corners: photos, cards, galleries, map frames square (max 4px). Buttons, EN/ES toggle, tags rounded. */
:root{
  --green:#006747; --yellow:#F9D317; --blue:#009DC6; --pink:#DE1081; --ink:#000000; --paper:#FFFFFF;
  /* Bauhaus 93: brand display face, MyFonts webfont licence (see @font-face at the top) */
  --f-display:"Bauhaus 93","Arial Black",system-ui,sans-serif;
  --f-body:"Quicksand","Trebuchet MS",system-ui,sans-serif;
  --gutter:clamp(16px,4vw,48px);
  --maxw:1180px;
  --r-box:4px;
  color-scheme:light;
}
*{box-sizing:border-box}
html{scroll-behavior:auto}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--f-body);font-size:17px;line-height:1.6;font-weight:500}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:var(--gutter)}
h1,h2,h3{font-family:var(--f-display);font-weight:400;line-height:1.08;letter-spacing:.01em;text-wrap:balance;margin:0}
h1{font-size:clamp(2.4rem,6vw,4.2rem)}
h2{font-size:clamp(1.9rem,4.2vw,3rem);color:var(--green)}
h3{font-size:1.3rem}
p{margin:0}
.sec{padding-block:clamp(56px,8vw,96px)}
.sec-head{display:grid;gap:.6rem;margin-bottom:clamp(24px,3.5vw,40px);max-width:62ch}
.sec-head p{font-size:1.08rem}
.sec-head .ph{justify-self:start}
.prose{display:grid;gap:1rem;max-width:66ch;font-size:1.08rem}

/* placeholder tag: rounded, clearly marked */
.ph{display:inline-block;font-size:.78rem;font-weight:700;color:var(--ink);background:var(--paper);border:1.5px solid var(--ink);border-radius:999px;padding:.15em .75em;line-height:1.5}
.ph--inline{font-size:.8rem;vertical-align:middle}

/* the one button style: yellow with green text */
.btn{display:inline-flex;align-items:center;justify-content:center;font-family:var(--f-display);font-size:1rem;letter-spacing:.02em;text-decoration:none;padding:.75em 1.6em;border-radius:999px;border:2px solid var(--yellow);background:var(--yellow);color:var(--green);cursor:pointer;transition:background .15s,color .15s,border-color .15s}
.btn:hover{background:var(--green);color:var(--yellow);border-color:var(--green)}
/* on yellow or green grounds the button keeps its colors but gains an edge so it never disappears */
.on-yellow .btn{border-color:var(--green)}
.on-green .btn:hover{background:var(--paper);color:var(--green);border-color:var(--paper)}
.link{font-weight:700;color:var(--green);text-underline-offset:4px;text-decoration-thickness:2px}

/* top bar */
.topbar{background:var(--yellow);color:var(--green);text-align:center;font-family:var(--f-display);font-size:.95rem;letter-spacing:.04em;padding:.45em 16px}
.topbar a{color:inherit;text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:3px}   /* Update 32 Fix 1 */

/* header: 2 links each side of a centered logo, EN/ES far right */
.site-head{position:sticky;top:0;z-index:30;background:var(--paper);border-bottom:2px solid var(--ink)}
.site-head .head{max-width:none}
.head{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;column-gap:clamp(12px,1.5vw,24px);padding-block:.5rem;--tools-w:236px}
.nav{display:flex;align-items:center;justify-content:space-evenly;gap:1rem;font-family:var(--f-display);font-size:clamp(1.05rem,1.5vw,1.3rem);letter-spacing:.02em}
.nav--l{padding-left:var(--tools-w)}
.right .nav--r{flex:1}
.nav > a,.nav .dd > button{text-decoration:none;padding:.35em .1em;border:0;border-bottom:3px solid transparent;background:none;font:inherit;color:var(--ink);cursor:pointer;letter-spacing:inherit;white-space:nowrap}
.nav > a:hover,.nav .dd > button:hover,.nav [aria-current="page"]{border-bottom-color:var(--pink)}
.right{display:flex;align-items:center;gap:1rem}
.head-tools{display:flex;align-items:center;justify-content:flex-end;gap:10px;flex:none;width:var(--tools-w)}
.btn--sm{font-size:.9rem;padding:.55em 1.1em;white-space:nowrap}
.brand img{width:clamp(120px,12vw,150px);height:auto}
.lang{display:flex;border:2px solid var(--ink);border-radius:999px;overflow:hidden;flex:none}
.lang button{font:700 .85rem var(--f-body);border:0;background:var(--paper);color:var(--ink);padding:.3em .8em;cursor:pointer}
.lang button[aria-pressed="true"]{background:var(--green);color:var(--paper)}

/* Tours dropdown: hover on desktop, tap on touch */
.dd{position:relative}
.dd__menu{position:absolute;top:100%;left:50%;transform:translateX(-50%);min-width:280px;background:var(--paper);border:2px solid var(--ink);padding:.4rem 0;display:none;z-index:40}
.dd__menu a{display:block;padding:.6em 1.1em;text-decoration:none;font-family:var(--f-body);font-weight:700;font-size:1rem;letter-spacing:0}
.dd__menu a:hover{background:var(--yellow);color:var(--green)}
.dd:hover .dd__menu,.dd:focus-within .dd__menu,.dd.open .dd__menu{display:block}

.menu-btn{display:none;width:42px;height:42px;border:2px solid var(--ink);border-radius:var(--r-box);background:var(--paper);cursor:pointer;padding:0}
.menu-btn span{display:block;width:20px;height:3px;background:var(--ink);margin:4px auto}
.mobile-nav{display:none}
@media (max-width:1200px){
  .head{grid-template-columns:auto 1fr auto;column-gap:8px}
  .head-tools{width:auto}
  .head > .nav,.right .nav{display:none}
  .menu-btn{display:block}
  .brand{justify-self:center}
  .brand img{width:clamp(92px,24vw,130px)}
  .head-tools{gap:6px}
  .lang button{padding:.28em .6em;font-size:.8rem}
  .btn--sm{font-size:.82rem;padding:.5em .85em}
  .mobile-nav{display:grid;padding:0 var(--gutter) .8rem;border-top:2px solid var(--ink)}
  .mobile-nav[hidden]{display:none!important}
  .mobile-nav > a,.mobile-nav button{font:400 1.15rem var(--f-display);text-align:left;text-decoration:none;padding:.65em 0;border:0;border-bottom:2px solid var(--ink);background:none;color:var(--ink);cursor:pointer;width:100%}
  .mobile-nav .sub{display:grid;padding-left:1rem;border-bottom:2px solid var(--ink)}
  .mobile-nav .sub[hidden]{display:none}
  .mobile-nav .sub a{font-weight:700;text-decoration:none;padding:.5em 0}
}
@media (max-width:360px){.lang button{padding:.25em .45em}.btn--sm{padding:.5em .7em}}

/* photo placeholders: solid brand color, square corners */
.photo{position:relative;border-radius:var(--r-box);overflow:hidden;display:grid;place-items:center}
.photo .ph{position:absolute;left:12px;bottom:12px}
.bg-blue{background:var(--blue)} .bg-green{background:var(--green)} .bg-pink{background:var(--pink)} .bg-yellow{background:var(--yellow)} .bg-ink{background:var(--ink)}

/* hero (home): video only */
.hero{position:relative;width:100%;aspect-ratio:16/9;max-height:680px;min-height:340px;background:var(--ink) url("../img/pattern.webp") center/cover no-repeat;overflow:hidden}
.hero__tag{position:absolute;top:16px;left:16px}
.hero__ctas{position:absolute;left:0;right:0;bottom:clamp(20px,5vw,48px);display:flex;justify-content:center;flex-wrap:wrap;gap:.9rem;padding-inline:16px}

/* tour page hero */
.thero{background:var(--green);color:var(--paper)}
.thero .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);align-items:center;padding-block:clamp(40px,6vw,72px)}
.thero h1{color:var(--yellow)}
.thero__hook{font-family:var(--f-display);font-size:clamp(1.3rem,2.4vw,1.8rem);margin-top:.6rem}
.thero__price{margin:1.4rem 0 1.6rem;display:grid;gap:.15rem}
.thero__price strong{font-family:var(--f-display);font-weight:400;font-size:clamp(2.2rem,4vw,3rem);line-height:1}
.thero .photo{aspect-ratio:4/3}
@media (max-width:820px){.thero .wrap{grid-template-columns:1fr}}

/* about */
.about{background:var(--yellow)}
.about .wrap{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);gap:clamp(24px,5vw,64px);align-items:center}
.about__body{display:grid;gap:1rem;max-width:60ch;font-size:1.1rem}
.about__lede{font-weight:700;font-size:1.2rem}
.about img{width:min(100%,300px);justify-self:center}
@media (max-width:760px){.about .wrap{grid-template-columns:1fr}.about img{width:200px;justify-self:start}}

/* tour cards: square, thin black border, no shadow. Rows line up across cards (subgrid) */
.tours__top{display:flex;justify-content:space-between;align-items:flex-end;gap:1rem;flex-wrap:wrap}
.slider-ctrl{display:flex;gap:.5rem;margin-bottom:clamp(24px,3.5vw,40px)}
.slider-ctrl button{width:44px;height:44px;border-radius:999px;border:2px solid var(--ink);background:var(--paper);font:400 1.3rem var(--f-display);cursor:pointer;color:var(--ink)}
.slider-ctrl button:hover{background:var(--yellow);color:var(--green)}
.slider{display:grid;grid-auto-flow:column;grid-template-rows:repeat(5,auto);grid-auto-columns:minmax(280px,calc((100% - 2*28px)/3));column-gap:28px;overflow-x:auto;scroll-snap-type:x mandatory;padding:2px 2px 20px;scrollbar-width:thin}
@media (max-width:900px){.slider{grid-auto-columns:minmax(260px,82%)}}
.card{grid-row:span 5;display:grid;grid-template-rows:subgrid;row-gap:0;scroll-snap-align:start;background:var(--paper);border:2px solid var(--ink);border-radius:var(--r-box);overflow:hidden;min-width:0;cursor:pointer}
.card > *{margin-inline:24px}
.card .photo{margin:0;aspect-ratio:3/2;border-radius:0;border-bottom:2px solid var(--ink)}
.card .photo svg{width:46%;height:auto}
.card h3{color:var(--green);font-size:1.45rem;margin-top:22px}
.card h3 a{text-decoration:none}
.card .hook{margin-top:.55rem}
.price{margin-top:1rem;display:grid;gap:.1rem;align-content:start}
.price strong{font-family:var(--f-display);font-weight:400;font-size:1.8rem;line-height:1.1}
.price small{font-size:.86rem;font-weight:600}
.card__actions{display:flex;align-items:center;gap:1.2rem;flex-wrap:wrap;margin-top:1rem;margin-bottom:24px}

/* maps */
.maps{background:var(--blue)}
.maps h2{color:var(--paper)}
.maps .sec-head p{color:var(--paper)}
.tabs{display:flex;gap:.5rem;flex-wrap:wrap;margin-bottom:18px}
.tabs button{font:400 1rem var(--f-display);letter-spacing:.02em;padding:.6em 1.3em;border-radius:999px;border:2px solid var(--paper);background:transparent;color:var(--paper);cursor:pointer}
.tabs button[aria-selected="true"]{background:var(--yellow);border-color:var(--yellow);color:var(--green)}
.map__grid{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:clamp(20px,4vw,44px);align-items:start}
@media (max-width:860px){.map__grid{grid-template-columns:1fr}}
.map__solo{width:100%}
.map__frame{background:var(--paper);border:2px solid var(--ink);border-radius:var(--r-box);overflow:hidden}
.map__frame svg{width:100%;height:auto;display:block}
.map__note{font-size:.85rem;font-weight:700;margin-top:.7rem}
.maps .map__note{color:var(--paper)}
.stops{list-style:none;margin:0;padding:0;display:grid;gap:.7rem}
.stops li{display:grid;grid-template-columns:36px minmax(0,1fr);gap:.8rem;align-items:start;background:var(--paper);border:2px solid var(--ink);border-radius:var(--r-box);padding:.8rem .95rem}
.stops strong{display:block}
.stops span{font-size:.95rem}
.pin{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;font-family:var(--f-display);font-size:1rem}
.pin--1{background:var(--pink);color:var(--paper)} .pin--2{background:var(--blue);color:var(--paper)} .pin--3{background:var(--paper);color:var(--ink);border:2px solid var(--ink)} .pin--4{background:var(--yellow);color:var(--green)}
.map-light{background:var(--paper)}
.map-light .tabs button{border-color:var(--ink);color:var(--ink)}

/* how it works */
.how .wrap{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(24px,4vw,56px);align-items:center}
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.5vw,28px)}
.steps li{display:grid;gap:.6rem;align-content:start}
.step-n{width:56px;height:56px;border-radius:50%;display:grid;place-items:center;font-family:var(--f-display);font-size:1.5rem}
.steps li:nth-child(1) .step-n{background:var(--yellow);color:var(--green)}
.steps li:nth-child(2) .step-n{background:var(--blue);color:var(--paper)}
.steps li:nth-child(3) .step-n{background:var(--pink);color:var(--paper)}
.steps h3{color:var(--green)}
.how img{width:180px}
@media (max-width:860px){.how .wrap{grid-template-columns:1fr}.how img{width:140px}}
@media (max-width:640px){.steps{grid-template-columns:1fr}}

/* why us */
.why{background:var(--green);color:var(--paper)}
.why h2,.why h3{color:var(--yellow)}
.why__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(18px,2.6vw,32px)}
@media (max-width:980px){.why__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.why__grid{grid-template-columns:1fr}}
.why__item{display:grid;gap:.6rem;align-content:start}
.why__item svg{width:56px;height:56px}

/* gallery and photo strips: square */
.gallery__grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:minmax(150px,auto);gap:10px}
.gallery__grid .photo{place-items:end start}
.gallery__grid .photo:nth-child(1){grid-column:span 2;grid-row:span 2}
@media (max-width:640px){.gallery__grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
.strip{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
.strip .photo{aspect-ratio:1}
@media (max-width:640px){.strip{grid-template-columns:repeat(2,minmax(0,1fr))}}
.ig-slot{margin-top:14px;border:2px dashed var(--ink);border-radius:var(--r-box);padding:1rem;text-align:center;font-weight:700;font-size:.9rem}

/* teaser */
.teaser{background:var(--yellow)}
.teaser .wrap{display:flex;align-items:center;gap:clamp(16px,4vw,40px);flex-wrap:wrap}
.teaser img{width:min(220px,50vw)}
.teaser h2{font-size:clamp(1.6rem,3.4vw,2.4rem)}

/* tour page blocks */
.games{display:grid;gap:12px}
.game{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,2fr) minmax(0,1fr) auto;gap:1rem;align-items:center;border:2px solid var(--ink);border-radius:var(--r-box);padding:16px 20px;background:var(--paper)}
.game__date{font-family:var(--f-display);font-size:1.35rem;color:var(--green);line-height:1.1}
.game__match{font-weight:700;font-size:1.1rem}
.game__meta{font-size:.95rem}
.game__price{font-family:var(--f-display);font-size:1.3rem}
@media (max-width:760px){.game{grid-template-columns:1fr;gap:.35rem}.game .btn{justify-self:start;margin-top:.5rem}}
.games__note{margin-top:14px;font-size:.95rem}
.empty-cal{border:2px dashed var(--ink);border-radius:var(--r-box);padding:20px;display:grid;gap:.8rem;justify-items:start}

.incl{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width:860px){.incl{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.incl{grid-template-columns:1fr}}
.incl li{border:2px solid var(--ink);border-radius:var(--r-box);padding:16px 18px;display:grid;gap:.3rem;align-content:start;background:var(--paper)}
.incl strong{font-family:var(--f-display);font-weight:400;font-size:1.2rem;color:var(--green)}

.timeline{list-style:none;margin:0;padding:0;display:grid;gap:0;max-width:720px}
.timeline li{display:grid;grid-template-columns:150px minmax(0,1fr);gap:1rem;padding:14px 0;border-bottom:2px solid var(--ink)}
.timeline li:first-child{border-top:2px solid var(--ink)}
.timeline time,.timeline .t{font-family:var(--f-display);color:var(--green);font-size:1.15rem}
@media (max-width:560px){.timeline li{grid-template-columns:1fr;gap:.2rem}}

.kbyg{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 40px;max-width:980px;list-style:none;margin:0;padding:0}
.kbyg + *{}
@media (max-width:700px){.kbyg{grid-template-columns:1fr}}
.kbyg li{padding-left:1.4em;position:relative}
.kbyg li::before{content:"";position:absolute;left:0;top:.55em;width:.6em;height:.6em;background:var(--pink);border-radius:50%}

.locals{background:var(--yellow)}
.locals .wrap{display:flex;gap:1.5rem 3rem;align-items:center;justify-content:space-between;flex-wrap:wrap;padding-block:clamp(36px,5vw,56px)}
.locals h2{font-size:clamp(1.5rem,3vw,2.1rem)}
.locals p{max-width:60ch;margin-top:.5rem}

.seelist{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px;counter-reset:s}
.seelist li{border:2px solid var(--ink);border-radius:var(--r-box);padding:14px 16px 14px 56px;position:relative;counter-increment:s;font-weight:600}
.seelist li::before{content:counter(s);position:absolute;left:14px;top:12px;width:30px;height:30px;border-radius:50%;background:var(--green);color:var(--paper);font-family:var(--f-display);display:grid;place-items:center;font-size:.95rem}

/* booking form */
.book{background:var(--green);color:var(--paper)}
.book h2{color:var(--yellow)}
.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px 20px;max-width:820px}
.form .full{grid-column:1/-1}
@media (max-width:640px){.form{grid-template-columns:1fr}}
.field{display:grid;gap:.35rem}
.field label,.field legend{font-weight:700}
.field input,.field select{font:600 1rem var(--f-body);padding:.7em .8em;border:2px solid var(--ink);border-radius:var(--r-box);background:var(--paper);color:var(--ink);width:100%}
.field fieldset{border:0;padding:0;margin:0;display:flex;gap:1.2rem;flex-wrap:wrap}
.field fieldset label{font-weight:600;display:flex;gap:.4rem;align-items:center}
.check{display:flex;gap:.6rem;align-items:flex-start;font-weight:600}
.check input{width:20px;height:20px;margin-top:.2em;accent-color:var(--yellow);flex:none}
.check a{color:var(--yellow)}
.form__note{font-size:.9rem;font-weight:700}
.form .btn:hover{background:var(--paper);color:var(--green);border-color:var(--paper)}
.hp{position:absolute;left:-9999px}

/* shop page */
.do-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
@media (max-width:860px){.do-grid{grid-template-columns:1fr}}
.do{border:2px solid var(--ink);border-radius:var(--r-box);padding:22px;display:grid;gap:.7rem;align-content:start}
.do img{width:96px;height:auto}
.do h3{color:var(--green)}
.info-list{list-style:none;margin:0;padding:0;display:grid;gap:.8rem}
.info-list strong{display:block;font-family:var(--f-display);font-weight:400;color:var(--green);font-size:1.1rem}

/* faq */
.faq{display:grid;gap:10px;max-width:820px}
.faq details{border:2px solid var(--ink);border-radius:var(--r-box);background:var(--paper)}
.faq summary{cursor:pointer;padding:16px 20px;font-family:var(--f-display);font-size:1.15rem;color:var(--green);list-style:none;display:flex;justify-content:space-between;gap:1rem}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-size:1.4rem;line-height:1}
.faq details[open] summary::after{content:"\2212"}
.faq details > div{padding:0 20px 18px;display:grid;gap:.6rem}

/* faq link */
.faq-link{text-align:center;padding-block:28px;font-weight:700;font-size:1.05rem}

/* footer */
.foot{background:var(--ink);color:var(--paper);padding-block:clamp(48px,7vw,72px) 28px}
.foot__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,56px);align-items:start}
@media (max-width:860px){.foot__grid{grid-template-columns:1fr}}
.foot__logo{width:190px;height:auto}
.foot h3{color:var(--yellow);font-size:1.15rem;margin-bottom:.8rem}
.foot a{color:var(--paper);text-underline-offset:3px}
.social{display:flex;gap:.6rem}
.social a{width:44px;height:44px;display:grid;place-items:center;border-radius:999px;background:var(--pink)}
.social a:hover{background:var(--yellow)}
.social svg{width:24px;height:24px}
.concepts{display:flex;gap:.7rem;flex-wrap:wrap}
.concepts a{text-decoration:none;font-family:var(--f-display);font-size:1rem;border-radius:var(--r-box);padding:.55em .9em}
.concepts a:nth-child(1){background:var(--pink);color:var(--paper)}
.concepts a:nth-child(2){background:var(--paper);color:var(--ink)}
.foot__sticker{width:150px}
.foot__contact{display:grid;gap:.3rem;margin-top:1rem;font-size:.95rem}
.foot__legal{border-top:2px solid var(--paper);margin-top:clamp(28px,4vw,44px);padding-top:18px;display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:.9rem}
.foot__legal a{color:var(--yellow)}

.notice{background:var(--yellow);color:var(--green);border:2px solid var(--green);border-radius:var(--r-box);padding:.8rem 1rem;font-weight:700}
@media (prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important;scroll-behavior:auto!important}}

/* ===== Update 04: booking section ===== */
.book__grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:clamp(20px,3vw,36px);align-items:start}
@media (max-width:900px){.book__grid{grid-template-columns:1fr}}
.summary{position:sticky;top:110px;background:var(--yellow);color:var(--ink);border:2px solid var(--ink);border-radius:var(--r-box);padding:24px}
@media (max-width:900px){.summary{position:static}}
.summary__eyebrow{font-weight:700;font-size:.8rem;letter-spacing:.08em;text-transform:uppercase;color:var(--green)}
.summary h3{font-size:1.5rem;color:var(--green);margin:.3rem 0 1rem}
.summary dl{margin:0;display:grid}
.summary dl > div{display:grid;grid-template-columns:110px minmax(0,1fr);gap:.8rem;padding:.6rem 0;border-top:2px solid var(--ink)}
.summary dt{font-weight:700;font-size:.85rem}
.summary dd{margin:0;font-weight:600;font-size:.95rem}
.summary [data-sum].is-empty{opacity:1;font-style:italic}

.bform{background:var(--paper);color:var(--ink);border:2px solid var(--ink);border-radius:var(--r-box);padding:clamp(20px,3vw,32px);display:grid;gap:24px}
.bform .fgroup{display:grid;gap:20px}
.bform .fgroup + .fgroup{padding-top:24px;border-top:2px solid var(--ink)}
.bform .grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
@media (max-width:600px){.bform .grid2{grid-template-columns:1fr}}
.bform .field{display:grid;gap:.45rem;align-content:start}
.bform label,.bform .flabel{font-weight:700;font-size:.92rem}
.bform input[type=text],.bform input:not([type]),.bform input[type=email],.bform input[type=tel]{font:600 1rem var(--f-body);height:48px;padding:0 .9em;border:2px solid var(--ink);border-radius:var(--r-box);background:var(--paper);color:var(--ink);width:100%}
.bform input:focus-visible{outline:3px solid var(--blue);outline-offset:1px}

/* date and game chips */
.chips{display:grid;grid-template-columns:repeat(auto-fill,minmax(82px,1fr));gap:8px}
.chips--games{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}
.chip{position:relative;cursor:pointer;font-weight:600}
.chip input,.pill input{position:absolute;opacity:0;width:1px;height:1px}
.chip > span{display:grid;justify-items:center;gap:0;padding:.55em .4em;border:2px solid var(--ink);border-radius:var(--r-box);background:var(--paper);transition:background .12s,color .12s;line-height:1.25;text-align:center;min-height:58px;align-content:center}
.chip small{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.chip b{font-family:var(--f-display);font-weight:400;font-size:1.05rem}
.chip--game > span{justify-items:start;text-align:left;padding:.7em .9em}
.chip--game small{text-transform:none;letter-spacing:0;font-size:.88rem}
.chip:hover > span{background:var(--yellow)}
.chip input:checked + span{background:var(--green);color:var(--yellow);border-color:var(--green)}
.chip input:focus-visible + span,.pill input:focus-visible + span{outline:3px solid var(--blue);outline-offset:2px}

/* steppers */
.stepper{display:grid;grid-template-columns:48px minmax(0,1fr) 48px;height:48px;border:2px solid var(--ink);border-radius:var(--r-box);overflow:hidden;max-width:220px}
.stepper button{border:0;background:var(--paper);font:400 1.4rem var(--f-display);color:var(--green);cursor:pointer}
.stepper button:hover{background:var(--yellow)}
.stepper input{border:0;border-inline:2px solid var(--ink);text-align:center;font:400 1.15rem var(--f-display);width:100%;min-width:0;-moz-appearance:textfield;appearance:textfield;background:var(--paper);color:var(--ink)}
.stepper input::-webkit-outer-spin-button,.stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}

/* pill toggles */
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pill{position:relative;cursor:pointer}
.pill > span{display:inline-flex;align-items:center;height:48px;padding:0 1.2em;border:2px solid var(--ink);border-radius:999px;background:var(--paper);font-weight:700;font-size:.95rem;transition:background .12s,color .12s}
.pill:hover > span{background:var(--yellow)}
.pill input:checked + span{background:var(--green);color:var(--yellow);border-color:var(--green)}
.pill--check{justify-self:start}
.pill--check > span::before{content:"";width:16px;height:16px;border:2px solid currentColor;border-radius:3px;margin-right:.6em;display:inline-block}
.pill--check input:checked + span::before{background:var(--yellow);border-color:var(--yellow);box-shadow:inset 0 0 0 3px var(--green)}

.consents{display:grid;gap:.5rem;font-size:.85rem}
.consents .check{font-weight:600;font-size:.85rem}
.consents .check input{width:18px;height:18px;accent-color:var(--green)}
.consents a{color:var(--green)}
.btn--block{width:100%;border-color:var(--green);padding-block:.95em;font-size:1.1rem}
.bform .btn--block:hover{background:var(--green);color:var(--yellow)}

/* ===== Update 04: Know before you go ===== */
.facts{list-style:none;margin:0 0 clamp(28px,4vw,44px);padding:0;display:grid;grid-template-columns:repeat(var(--n,5),minmax(0,1fr));border:2px solid var(--ink);border-radius:var(--r-box)}
.fact{display:grid;gap:.35rem;align-content:start;padding:20px 18px}
.fact + .fact{border-left:2px solid var(--ink)}
.fact svg{width:40px;height:40px;margin-bottom:.3rem}
.fact__label{font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em;color:var(--green)}
.fact__value{font-weight:700;font-size:1rem;line-height:1.35}
@media (max-width:900px){
  .facts{grid-template-columns:repeat(2,minmax(0,1fr));border:0;gap:8px}
  .fact,.fact + .fact{border:2px solid var(--ink);border-radius:var(--r-box)}
  .fact:last-child:nth-child(odd){grid-column:1/-1}
}
.kcols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(20px,3vw,32px);margin-bottom:clamp(28px,4vw,44px)}
@media (max-width:700px){.kcols{grid-template-columns:1fr}}
.kcol{border-top:4px solid var(--green);padding-top:16px}
.kcol h3,.gtk-title{color:var(--green);font-size:1.35rem;margin-bottom:.8rem}
.ticks{list-style:none;margin:0;padding:0;display:grid;gap:.55rem}
.ticks li{position:relative;padding-left:1.8em;font-weight:600}
.ticks li::before{content:"";position:absolute;left:0;top:.2em;width:1.1em;height:1.1em;border-radius:50%;background:var(--yellow);border:2px solid var(--ink)}
.ticks li::after{content:"";position:absolute;left:.38em;top:.43em;width:.32em;height:.55em;border-right:2.5px solid var(--green);border-bottom:2.5px solid var(--green);transform:rotate(45deg)}
.gcards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
@media (max-width:900px){.gcards{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.gcards{grid-template-columns:1fr}}
.gcard{border:2px solid var(--ink);border-radius:var(--r-box);padding:16px 18px;display:grid;gap:.35rem;align-content:start}
.gcard h4{margin:0;font-family:var(--f-display);font-weight:400;font-size:1.1rem;color:var(--pink)}
.gcard p{font-size:.95rem}
@media (max-width:900px){.summary{padding:18px}.summary h3{margin-bottom:.6rem}.summary dl > div{grid-template-columns:96px minmax(0,1fr);padding:.45rem 0}}

/* ===== Update 05: color balance ===== */
.btn--pink{background:var(--pink);border-color:var(--pink);color:var(--paper)}
.btn--pink:hover{background:var(--ink);border-color:var(--ink);color:var(--paper)}
.about{background:var(--pink);color:var(--paper)}
.about h2,.about .about__lede{color:var(--paper)}
#tours-title,#gallery-title,#games-title,#inc-title,#see-title,#do-title,#merch-title{color:var(--pink)}
.maps{background:var(--blue);color:var(--ink)}
.maps h2,.maps .sec-head p,.maps .map__note{color:var(--ink)}
.tabs button{border-color:var(--ink);color:var(--ink)}
.tabs button[aria-selected="true"]{background:var(--ink);border-color:var(--ink);color:var(--yellow)}
.why{background:var(--ink)}
.why h2{color:var(--yellow)}
.why__item:nth-child(1) h3{color:var(--yellow)} .why__item:nth-child(2) h3{color:var(--blue)} .why__item:nth-child(3) h3{color:var(--pink)} .why__item:nth-child(4) h3{color:var(--paper)}
.teaser{background:var(--blue);color:var(--ink)}
.teaser h2{color:var(--ink)}
.thero--green{background:var(--green);color:var(--paper)}
.thero--blue{background:var(--blue);color:var(--ink)} .thero--blue h1{color:var(--ink)}
.thero--pink{background:var(--pink);color:var(--paper)} .thero--pink h1{color:var(--paper)}
.thero--pink .btn:hover,.thero--blue .btn:hover{background:var(--ink);color:var(--yellow);border-color:var(--ink)}
.book{background:var(--ink)}
.book .sec-head p{color:var(--paper)}
.game__date,.timeline time,.timeline .t{color:var(--pink)}
.incl li{border-top-width:8px}
.incl li:nth-child(4n+1){border-top-color:var(--green)} .incl li:nth-child(4n+2){border-top-color:var(--pink)} .incl li:nth-child(4n+3){border-top-color:var(--blue)} .incl li:nth-child(4n+4){border-top-color:var(--yellow)}
.incl strong{color:var(--ink)}
.seelist li:nth-child(4n+1)::before{background:var(--pink);color:var(--paper)}
.seelist li:nth-child(4n+2)::before{background:var(--blue);color:var(--ink)}
.seelist li:nth-child(4n+3)::before{background:var(--green);color:var(--paper)}
.seelist li:nth-child(4n+4)::before{background:var(--yellow);color:var(--green)}
.fact{border-top:8px solid transparent}
.fact:nth-child(5n+1){border-top-color:var(--yellow)} .fact:nth-child(5n+2){border-top-color:var(--blue)} .fact:nth-child(5n+3){border-top-color:var(--pink)} .fact:nth-child(5n+4){border-top-color:var(--green)} .fact:nth-child(5n+5){border-top-color:var(--ink)}
.fact__label{color:var(--ink)}
.kcol:nth-child(1){border-top-color:var(--pink)} .kcol:nth-child(2){border-top-color:var(--blue)}
.kcol h3,.gtk-title{color:var(--ink)}
.gcard{border-left-width:8px}
.gcard:nth-child(4n+1){border-left-color:var(--pink)} .gcard:nth-child(4n+2){border-left-color:var(--blue)} .gcard:nth-child(4n+3){border-left-color:var(--green)} .gcard:nth-child(4n+4){border-left-color:var(--yellow)}
.gcard h4{color:var(--ink)}
.do{border-top-width:8px}
.do:nth-child(1){border-top-color:var(--blue)} .do:nth-child(2){border-top-color:var(--pink)} .do:nth-child(3){border-top-color:var(--yellow)}

/* ===== Update 05: FAQ accordion ===== */
.faq{gap:0;border-top:2px solid var(--ink)}
.qa{border:0;border-bottom:2px solid var(--ink);border-radius:0;background:var(--paper)}
.qa summary{display:grid;grid-template-columns:40px minmax(0,1fr) 36px;align-items:center;gap:16px;padding:18px 4px;cursor:pointer;list-style:none;font-family:var(--f-body);color:var(--ink)}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:none}
.qa__n{width:40px;height:40px;border-radius:50%;display:grid;place-items:center;font-family:var(--f-display);font-size:1.05rem}
.qa__q{font-weight:700;font-size:1.12rem;line-height:1.35}
.qa__ind{width:32px;height:32px;border-radius:50%;border:2px solid var(--ink);position:relative;justify-self:end}
.qa__ind::before,.qa__ind::after{content:"";position:absolute;left:50%;top:50%;width:12px;height:2.5px;background:var(--ink);transform:translate(-50%,-50%)}
.qa__ind::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .15s}
.qa[open] .qa__ind::after{transform:translate(-50%,-50%) rotate(0deg)}
.qa__a{padding:0 4px 20px 56px;color:var(--ink)}
.qa__a p{max-width:68ch}
.qa__a .link{color:var(--ink)}
.qa--0 .qa__n{background:var(--pink);color:var(--paper)} .qa--0[open] .qa__ind{background:var(--pink);border-color:var(--pink)}
.qa--1 .qa__n{background:var(--blue);color:var(--ink)} .qa--1[open] .qa__ind{background:var(--blue);border-color:var(--blue)}
.qa--2 .qa__n{background:var(--green);color:var(--paper)} .qa--2[open] .qa__ind{background:var(--green);border-color:var(--green)}
.qa--3 .qa__n{background:var(--yellow);color:var(--green)} .qa--3[open] .qa__ind{background:var(--yellow);border-color:var(--yellow)}
.qa--0[open] .qa__ind::before,.qa--0[open] .qa__ind::after,.qa--2[open] .qa__ind::before,.qa--2[open] .qa__ind::after{background:var(--paper)}
#faq-title{color:var(--ink)}
@media (max-width:560px){.qa summary{grid-template-columns:34px minmax(0,1fr) 30px;gap:12px}.qa__n{width:34px;height:34px}.qa__a{padding-left:4px}}

/* ===== Update 05: footer ===== */
.foot__top{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding-bottom:28px;border-bottom:2px solid var(--paper)}
.foot__top .foot__logo{width:170px}
.foot__cols{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,56px);padding-block:32px;border-bottom:2px solid var(--paper)}
@media (max-width:760px){.foot__cols{grid-template-columns:1fr}}
.foot__list{list-style:none;margin:0;padding:0;display:grid;gap:.5rem;font-size:.98rem}
.foot__list a{color:var(--paper)}
.foot__list a:hover{color:var(--yellow)}
.foot__concepts{display:flex;justify-content:space-between;align-items:center;gap:1.5rem;padding-block:32px;flex-wrap:wrap}
.foot__concepts .foot__sticker{width:110px}
.foot__ph{font-size:.8rem;margin-top:.7rem;color:var(--paper)}
.foot__legal{margin-top:0;padding-top:18px;font-size:.82rem;align-items:center}
.foot__legal-links{display:flex;gap:1.2rem;flex-wrap:wrap}
.faq .qa{border:0;border-bottom:2px solid var(--ink);border-radius:0}
.do{display:flex;flex-direction:column;gap:.7rem}
.do img{height:84px;width:auto}
.do > div:last-child{margin-top:auto;padding-top:.3rem}
.faq .qa summary::after,.faq .qa[open] summary::after{content:none}
.faq .qa > .qa__a{padding:0 4px 20px 60px}
@media (max-width:560px){.faq .qa > .qa__a{padding-left:4px}}

/* ===== Update 06: color ratio. Primary green + yellow + white; pink and blue as accents; black only in the footer ===== */
.head-tools .btn--pink:hover{background:var(--green);border-color:var(--green);color:var(--yellow)}
.about{background:var(--yellow);color:var(--ink)}
.about h2{color:var(--green)} .about .about__lede{color:var(--ink)}
#tours-title,#gallery-title,#games-title,#inc-title,#see-title,#do-title,#merch-title{color:var(--green)}
.tabs button[aria-selected="true"]{background:var(--yellow);border-color:var(--yellow);color:var(--green)}
.why{background:var(--green);color:var(--paper)}
.why h2,.why__item:nth-child(n) h3{color:var(--yellow)}
.teaser{background:var(--yellow)}
.teaser h2{color:var(--green)}
.thero--yellow{background:var(--yellow);color:var(--ink)} .thero--yellow h1{color:var(--green)}
.book{background:var(--green)}
.book .sec-head p{color:var(--paper)}
.incl li:nth-child(n){border-top-color:var(--green)}
.incl strong{color:var(--green)}
.seelist li:nth-child(n)::before{background:var(--green);color:var(--paper)}
.kcol:nth-child(n){border-top-color:var(--green)}
.kcol h3,.gtk-title{color:var(--green)}
.gcard:nth-child(n){border-left-color:var(--green)}
.gcard h4{color:var(--green)}
.do:nth-child(n){border-top-color:var(--green)}
.qa--0 .qa__n{background:var(--green);color:var(--paper)} .qa--0[open] .qa__ind{background:var(--green);border-color:var(--green)}
.qa--1 .qa__n{background:var(--pink);color:var(--paper)} .qa--1[open] .qa__ind{background:var(--pink);border-color:var(--pink)}
.qa--1[open] .qa__ind::before,.qa--1[open] .qa__ind::after{background:var(--paper)}

/* hero video: covers the hero, no interaction; the pattern shows until it loads */
.hero{container-type:size}
.hero__video{position:absolute;inset:0;overflow:hidden}
.hero__video iframe{position:absolute;top:50%;left:50%;width:max(100%,calc(100cqh * 16 / 9));height:max(100%,calc(100cqw * 9 / 16));transform:translate(-50%,-50%);border:0;pointer-events:none}

/* ===== Update XX ===== */
/* 1. all-caps headings via CSS only */
h1,h2,h3,h4,.summary h3,.gcard h4{text-transform:uppercase;letter-spacing:.03em}
h1{letter-spacing:.02em}
h4,.gcard h4{letter-spacing:.04em}
.thero__hook{text-transform:uppercase;letter-spacing:.03em}
.thero__hook--long{font-family:var(--f-body);font-weight:700;text-transform:none;letter-spacing:0;font-size:clamp(1.1rem,1.8vw,1.3rem);line-height:1.45}
@media (max-width:560px){
  h1{font-size:clamp(2rem,9vw,2.6rem)}
  h2{font-size:clamp(1.55rem,7vw,2rem)}
  .thero__hook{font-size:1.15rem}
  .thero__hook--long{font-size:1.05rem}
}

/* 2. Raimundo */
.raimundo{margin:0;display:grid;justify-items:center;gap:.6rem;text-align:center}
.raimundo img{width:min(100%,240px)}
.raimundo h3{color:var(--green);font-size:1.25rem}
.raimundo p{font-size:.9rem;font-weight:700}
@media (max-width:760px){.raimundo{justify-items:start;text-align:left}.raimundo img{width:170px}}
.foot__raimundo{display:flex;align-items:center;gap:14px;max-width:340px}
.foot__raimundo .foot__sticker{width:80px;flex:none}
.foot__raimundo p{font-size:.85rem;color:var(--paper)}
.lost__wrap{display:flex;gap:clamp(24px,5vw,64px);align-items:center;flex-wrap:wrap;min-height:50vh}
.lost__wrap img{width:min(240px,60vw)}
.lost h1{color:var(--ink)}

/* 4. Tours: click goes to the home tours section, hover opens the list; anchors clear the sticky header */
.nav .dd > .dd__trigger{text-decoration:none;padding:.35em .1em;border-bottom:3px solid transparent;color:var(--ink);white-space:nowrap}
.nav .dd > .dd__trigger:hover{border-bottom-color:var(--pink)}
[id]{scroll-margin-top:110px}
@media (max-width:1200px){[id]{scroll-margin-top:84px}}
.mnav-row{display:flex;align-items:center;border-bottom:2px solid var(--ink)}
.mobile-nav .mnav-row > a{flex:1;border-bottom:0}
.mobile-nav .mnav-arrow{width:44px;height:44px;flex:none;border:0;border-left:2px solid var(--ink);padding:0;position:relative}
.mobile-nav .mnav-arrow::after{content:"";position:absolute;left:50%;top:45%;width:10px;height:10px;border-right:3px solid var(--ink);border-bottom:3px solid var(--ink);transform:translate(-50%,-50%) rotate(45deg);transition:transform .15s}
.mobile-nav .mnav-arrow[aria-expanded="true"]::after{transform:translate(-50%,-20%) rotate(-135deg)}

/* 5. home map: map + a balanced pair (address, hours) aligned to the map's edges */
.map__grid--home{align-items:stretch}
.map__pair{display:grid;grid-template-rows:1fr 1fr;gap:14px}
.map__box{background:var(--paper);border:2px solid var(--ink);border-radius:var(--r-box);padding:20px 22px;display:grid;align-content:center;gap:.4rem}
.map__box h3{color:var(--green);font-size:1.15rem}
.map__foot{display:flex;justify-content:space-between;align-items:center;gap:1rem;flex-wrap:wrap;margin-top:14px}
.map__foot .map__note{margin:0}
@media (max-width:860px){.map__pair{grid-template-rows:none}}

/* 7. headers on blue are white; body text on blue stays black */
.maps h2,.maps .map__box h3{color:var(--paper)}
.maps .map__box h3{color:var(--green)}
.maps .sec-head p,.maps .map__note{color:var(--ink)}

/* 6. secondary pages: white base, blue strongest, pink accent, green/yellow small */
.page--sub .sec h2,.page--sub h1:not(.thero h1){color:var(--ink)}
.page--sub .maps h2,.page--sub .book h2,.page--sub .locals h2{color:var(--paper)}
.page--sub #see-title{color:var(--pink)}
.page--sub .seelist li:nth-child(odd)::before{background:var(--pink);color:var(--paper)}
.page--sub .seelist li:nth-child(even)::before{background:var(--blue);color:var(--ink)}
.page--sub .maps .map__frame[style*="F9D317"]{background:var(--paper)!important}
.page--sub .kcol:nth-child(n){border-top-color:var(--pink)}
.page--sub .kcol h3,.page--sub .gtk-title{color:var(--ink)}
.page--sub .gcard:nth-child(n){border-left-color:var(--pink)}
.page--sub .gcard h4{color:var(--ink)}
.page--sub .incl li:nth-child(n){border-top-color:var(--blue)}
.page--sub .incl strong{color:var(--ink)}
.page--sub .do:nth-child(n){border-top-color:var(--pink)}
.page--sub .do h3{color:var(--ink)}
.page--sub .locals{background:var(--pink);color:var(--paper)}
.page--sub .locals p{color:var(--paper)}
.page--sub .book{background:var(--blue);color:var(--ink)}
.page--sub .book .sec-head p{color:var(--ink)}
.page--sub .summary{background:var(--paper)}
.page--sub .summary__eyebrow{color:var(--pink)}
.page--sub .summary h3{color:var(--ink)}
.page--sub .chip:hover > span,.page--sub .pill:hover > span{background:var(--paper);border-color:var(--pink)}
.page--sub .chip input:checked + span,.page--sub .pill input:checked + span{background:var(--pink);border-color:var(--pink);color:var(--paper)}
.page--sub .stepper button{color:var(--pink)}
.page--sub .stepper button:hover{background:var(--paper);color:var(--ink)}
.page--sub .consents a{color:var(--ink)}
.page--sub .ticks li::before{background:var(--paper);border-color:var(--pink)}
.page--sub .ticks li::after{border-color:var(--pink)}
.page--sub .link{color:var(--ink)}
.page--sub .qa--0 .qa__n{background:var(--pink);color:var(--paper)} .page--sub .qa--0[open] .qa__ind{background:var(--pink);border-color:var(--pink)}
.page--sub .qa--1 .qa__n{background:var(--blue);color:var(--ink)} .page--sub .qa--1[open] .qa__ind{background:var(--blue);border-color:var(--blue)}
.page--sub .qa--0[open] .qa__ind::before,.page--sub .qa--0[open] .qa__ind::after{background:var(--paper)}
.page--sub .qa--1[open] .qa__ind::before,.page--sub .qa--1[open] .qa__ind::after{background:var(--ink)}
.maps h1{color:var(--paper)!important}

/* Update XX #9-10 */
.brand img{width:auto;height:72px}
@media (max-width:1200px){.brand img{width:auto;height:56px}}
.slider--2{grid-auto-columns:minmax(280px,calc((100% - 28px)/2))}
@media (min-width:901px){.slider-ctrl--2{display:none}}
@media (max-width:900px){.slider--2{grid-auto-columns:minmax(260px,82%)}}
.teaser img{height:auto}
.do img{object-fit:contain}
.page--sub #do-title,.page--sub #games-title,.page--sub #inc-title,.page--sub #gallery-title,.page--sub #merch-title,.page--sub #tours-title{color:var(--ink)}

/* Update 10 */
/* 1 header: bigger logo and nav, same height (less padding), more room between EN/ES and Book Now */
.head{padding-block:.2rem;--tools-w:250px}
.brand img{width:auto;height:84px}
.nav{font-size:clamp(1.12rem,1.62vw,1.42rem)}
.head-tools{gap:18px}
@media (max-width:1200px){.head{padding-block:.5rem}.brand img{width:auto;height:56px}.head-tools{gap:6px}}
/* 2 two tour cards: smaller, centered as a pair; stacked full width on mobile */
.slider--2{grid-auto-columns:minmax(0,380px);justify-content:center;overflow:visible;scroll-snap-type:none}
.slider-ctrl--2{display:none!important}
@media (max-width:900px){.slider--2{grid-auto-flow:row;grid-template-rows:none;grid-template-columns:minmax(0,1fr);grid-auto-columns:auto;row-gap:24px}}
/* 3 shop hours: day group left, time right */
.hours{display:grid;grid-template-columns:max-content max-content;column-gap:1.5rem;row-gap:.25rem;margin:0}
.hours > div{display:contents}
.hours dt{font-weight:700;margin:0}
.hours dd{margin:0}
.foot .hours dt{color:var(--paper)}
/* 4 teaser: compact */
.sec.teaser{padding-block:clamp(22px,3vw,34px)}
.teaser .wrap{gap:clamp(14px,3vw,28px);justify-content:center}
.teaser .sec-head h2{margin-bottom:.3rem}
/* 5 Bocas Getaways line */
.bg-line{text-align:center;padding-block:28px;font-weight:700;font-size:1.05rem;margin:0}
/* 6 surfing globe bigger (file is 1200px wide: max 600px on screen) */
.how img{width:340px;max-width:100%;height:auto}
@media (max-width:1100px){.how img{width:260px}}
@media (max-width:860px){.how img{width:240px;justify-self:center}}
/* 7 cassette bigger (file is 1200px wide: max 600px on screen) */
.teaser img{width:min(270px,60vw);height:auto}
.do img{height:120px;width:auto;max-width:100%}
html,body{overflow-x:clip}

/* Update 11: real photos (never stretched: cells match each photo's ratio, or object-fit:cover where cropping is allowed) */
.photo--img{background:var(--ink)}
.photo > img.fill{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* home gallery: same layout, every cell 3:2, big one spans 2x2 */
.gallery__grid--pics{grid-auto-rows:auto}
.gallery__grid--pics > .photo{aspect-ratio:3/2}
.gallery__grid--pics > .photo:nth-child(1){aspect-ratio:auto}
/* full-width photo, edge to edge, no padding */
.fullbleed{margin:0;padding:0;line-height:0;background:var(--ink)}
.fullbleed__img{display:block;width:100%;height:auto}
/* shop gallery: portrait full height on the left, 1 landscape over 2 on the right; widths solved so both sides line up */
.sgal{--g:10px;display:grid;gap:var(--g);grid-template-columns:calc(40% - var(--g) / 7.5) 1fr 1fr;grid-template-areas:"p a a" "p b c"}
.sgal__p{grid-area:p}.sgal__a{grid-area:a;aspect-ratio:3/2}.sgal__b{grid-area:b;aspect-ratio:3/2}.sgal__c{grid-area:c;aspect-ratio:3/2}
.sgal > div{overflow:hidden;border-radius:var(--r-box);min-width:0}
.sgal img{display:block;width:100%;height:100%;object-fit:cover}
@media (max-width:640px){
  .sgal{display:grid;grid-template-columns:1fr;grid-template-areas:none}
  .sgal > div{grid-area:auto;aspect-ratio:auto}
  .sgal img{height:auto;object-fit:initial}
}
/* baseball gallery: justified rows, same height per row, widths from each photo's proportions */
.jgal{display:grid;gap:10px}
.jrow{display:flex;gap:10px}
.jcell{position:relative;min-width:0;overflow:hidden;border-radius:var(--r-box)}
.jcell > img.fill,.jcell > .photo{position:absolute;inset:0;width:100%;height:100%}
.jcell > img.fill{object-fit:cover}
@media (max-width:640px){.jrow{flex-direction:column}.jcell{flex:none!important;width:100%}}

/* Update 12 */
/* baseball: one sliding row, same height, natural widths, no crop */
.hgal-sec{padding-top:0}
.hgal{position:relative}
.hgal__track{--h:clamp(260px,34vw,440px);display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:thin;padding-bottom:10px;overscroll-behavior-x:contain}
.hgal__img{flex:none;height:var(--h);width:auto;max-width:none;display:block;border-radius:var(--r-box);scroll-snap-align:start}
.hgal__track:focus-visible{outline:3px solid var(--pink);outline-offset:4px}
.hgal__btn{position:absolute;top:calc(50% - 5px);transform:translateY(-50%);z-index:2;width:46px;height:46px;border-radius:50%;border:2px solid var(--ink);background:var(--paper);color:var(--ink);font:400 1.8rem/1 var(--f-display);cursor:pointer;display:grid;place-items:center;padding:0 0 4px}
.hgal__btn:hover{background:var(--yellow);color:var(--green)}
.hgal__btn:disabled{opacity:0;pointer-events:none}
.hgal__btn--prev{left:-14px}.hgal__btn--next{right:-14px}
@media (max-width:640px){.hgal__btn{display:none}.hgal__track{--h:300px}}
/* walking: about + what you'll see side by side, compact */
.sec.duo{padding-block:clamp(40px,5vw,64px)}
.duo .wrap{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,4vw,56px);align-items:start}
.duo .sec-head{margin-bottom:14px;gap:.5rem}
.duo .prose{font-size:.98rem;line-height:1.55;gap:.65rem;max-width:none}
.seelist--compact{display:block;counter-reset:s}
.seelist--compact li{border:0;border-radius:0;padding:7px 0 7px 40px;font-weight:600;font-size:.98rem;line-height:1.4;position:relative}
.seelist--compact li::before{left:0;top:6px;width:28px;height:28px;font-size:.85rem}
@media (max-width:860px){.duo .wrap{grid-template-columns:1fr}}
/* FAQ: two independent columns, smaller questions */
.faq--2col{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:clamp(24px,3vw,40px);align-items:start;max-width:none;border-top:0}
.faq__col{border-top:2px solid var(--ink)}
.faq--2col .qa__q{font-size:1rem}
.faq--2col .qa summary{padding:14px 4px}
@media (max-width:760px){.faq--2col{grid-template-columns:1fr}.faq__col + .faq__col{border-top:0}}
/* footer: 4 even columns + one thin bar */
.foot{padding-block:clamp(40px,5vw,56px) 18px}
.foot__main{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,3vw,40px);align-items:start;padding-bottom:28px}
.foot h3{font-size:1.05rem;margin:0 0 .75rem;line-height:1.2}
.foot__brand{display:grid;gap:.7rem;justify-items:start}
.foot__brand .foot__logo{width:150px;height:auto}
.foot__tag{font-family:var(--f-display);color:var(--yellow);font-size:.9rem;letter-spacing:.03em;text-transform:uppercase}
.foot__raimundo{display:flex;align-items:center;gap:10px;max-width:none}
.foot__raimundo .foot__sticker{width:56px;height:auto;flex:none}
.foot__raimundo p{font-size:.8rem}
.foot__list{gap:.4rem;font-size:.95rem}
.foot__addr{font-size:.95rem;margin:0 0 .7rem}
.foot .hours{font-size:.92rem;column-gap:1rem}
.foot .social{margin-top:.9rem}
.foot .social a{width:38px;height:38px}.foot .social svg{width:20px;height:20px}
.foot__bar{border-top:1px solid rgba(255,255,255,.35);padding-top:14px;display:flex;align-items:center;justify-content:space-between;gap:.6rem 1.4rem;flex-wrap:wrap;font-size:.8rem}
.foot__bar-links{display:flex;gap:1.1rem;flex-wrap:wrap}
.foot__bar a{color:var(--yellow)}
.lang--foot{border-color:var(--paper)}
.lang--foot button{background:transparent;color:var(--paper);font-size:.75rem;padding:.22em .7em}
.lang--foot button[aria-pressed="true"]{background:var(--yellow);color:var(--green)}
@media (max-width:900px){.foot__main{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.foot__main{grid-template-columns:1fr;gap:22px}.foot__bar{justify-content:flex-start}}

/* ================= Update 13 ================= */
/* 3 yellow buttons: black text */
.btn{color:var(--ink)}
.btn:hover{background:var(--ink);color:var(--yellow);border-color:var(--ink)}
.on-yellow .btn,.btn--block{border-color:var(--ink)}
.bform .btn--block:hover,.form .btn:hover{background:var(--ink);color:var(--yellow);border-color:var(--ink)}
.on-green .btn:hover{background:var(--paper);color:var(--ink);border-color:var(--paper)}
/* 2 hero color per page, white small text */
.thero--blue{background:var(--blue);color:var(--paper)}
.thero--pink{background:var(--pink);color:var(--paper)}
.thero--green{background:var(--green);color:var(--paper)}
.thero--blue h1,.thero--pink h1{color:var(--paper)}
.thero--green h1{color:var(--yellow)}
.thero .thero__hook,.thero .thero__price,.thero .thero__price span,.thero .thero__price strong,.thero p{color:var(--paper)}
.thero--blue .btn:hover,.thero--pink .btn:hover,.thero--green .btn:hover{background:var(--ink);color:var(--yellow);border-color:var(--ink)}
.hchips{display:flex;flex-wrap:wrap;gap:8px;margin-top:.7rem}
.hchip{font-size:.85rem;font-weight:700;border:1.5px solid var(--paper);border-radius:999px;padding:.3em .85em;line-height:1.25;color:var(--paper)}
/* 4 headings: black on white/yellow, white on blue/pink, yellow on green */
main h1,main h2,main h3,main h4,
#tours-title,#gallery-title,#games-title,#inc-title,#see-title,#do-title,#merch-title,#about-title,#how-title,#teaser-title,#kbyg-title,#sg-title,#faq-title,#sched-title{color:var(--ink)}
.card h3,.do h3,.kcol h3,.gtk-title,.incl strong,.raimundo h3,.summary h3,.about h2,.steps h3,.map__box h3,.info-list strong{color:var(--ink)}
.why h2,.why h3,#why-title{color:var(--yellow)}
.maps h1,.maps h2,#map-title,#route-title,#find-title,#book-title,#loc-title,.locals h2{color:var(--paper)}
.maps .map__box h3,.maps .summary h3{color:var(--ink)}
.thero--blue h1,.thero--pink h1{color:var(--paper)}
.thero--green h1{color:var(--yellow)}
/* 6 fewer borders and color bars */
.facts{border:1.5px solid var(--ink);gap:0}
.fact,.fact + .fact,.fact:nth-child(n){border:0!important}
.fact__label{color:var(--ink)}
@media (max-width:860px){.facts{border:1.5px solid var(--ink);gap:0}.fact,.fact + .fact{border:0!important}}
.kcol,.kcol:nth-child(n){border-top:0!important;padding-top:0}
.card,.do,.map__box,.stops li,.incl li,.empty-cal,.summary,.qa{border-width:1.5px}
.do,.do:nth-child(n),.page--sub .do:nth-child(n){border:1.5px solid var(--ink)!important}
.incl li,.incl li:nth-child(n){border-top-width:1.5px!important;border-top-color:var(--ink)!important}
/* 7 footer: Logo | Explore | Concepts | Visit | Contact */
.foot__main{display:flex;justify-content:space-between;align-items:flex-start;gap:24px;flex-wrap:nowrap}
.foot__main > div{min-width:0}
.foot__brand .foot__logo{width:140px}
.foot h3{font-size:1rem}
.foot__list{font-size:.9rem}
.foot__shop{font-weight:700;font-size:.9rem;margin:0 0 .2rem}
.foot__addr{font-size:.9rem;max-width:24ch}
.foot .hours{font-size:.86rem}
.concepts--col{display:grid;gap:.55rem;justify-items:start}
.concepts--col a{font-size:.92rem;padding:.5em .85em;text-decoration:none;font-family:var(--f-display);border-radius:var(--r-box)}
.concepts--col a:nth-child(1){background:var(--paper);color:var(--ink)}
.concepts--col a:nth-child(2){background:var(--pink);color:var(--paper)}
.social{gap:.5rem}
@media (max-width:1000px){.foot__main{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}}
@media (max-width:560px){.foot__main{grid-template-columns:1fr;gap:20px}}
/* contact row with WhatsApp icon (shop page) */
.contact-row{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}
.wa-ico{width:32px;height:32px;border-radius:50%;background:var(--pink);display:grid;place-items:center;flex:none}
.wa-ico svg{width:18px;height:18px}
#find{padding-bottom:clamp(36px,5vw,56px)}
/* 8 Bocas Getaways banner */
.bgb{padding:clamp(20px,3vw,32px) var(--gutter)}
.bgb__in{max-width:780px;margin:0 auto;display:flex;align-items:center;justify-content:center;gap:12px 24px;flex-wrap:wrap;border:1.5px solid var(--ink);border-radius:var(--r-box);padding:12px 20px;background:var(--paper)}
.bgb__logo{height:48px;width:auto;display:block}
.bgb__txt{font-weight:700;font-size:1.05rem;margin:0}
.bgb .btn{padding:.6em 1.3em;font-size:.95rem}
.bgb + .faq-link{padding-top:0}
/* 9 home tour cards: colored panel under the photo */
.card--blue{background:var(--blue);color:var(--paper)}
.card--pink{background:var(--pink);color:var(--paper)}
.card--blue h3,.card--pink h3,.card--blue h3 a,.card--pink h3 a,.card--blue .hook,.card--pink .hook,.card--blue .price small,.card--pink .price small{color:var(--paper)}
.card .price strong{justify-self:start;background:var(--yellow);color:var(--ink);font-size:1.3rem;padding:.18em .55em;border-radius:var(--r-box);line-height:1.15}
.card--blue .link,.card--pink .link{color:var(--paper)}
.card .photo{border-bottom:1.5px solid var(--ink)}
/* 10 full-width photo capped at ~70% of the screen */
.fullbleed__img{height:min(70vh,66.65vw);object-fit:cover;object-position:50% 35%}
/* 11 find us: content to the top, button under the boxes, less blue below */
.map__pair{grid-template-rows:1fr 1fr auto}
.map__box{align-content:start;padding:18px 20px}
.map__pair > .btn{justify-self:start}
.map__grid--home .map__note{margin-top:10px}
#map{padding-bottom:clamp(36px,5vw,56px)}
/* 12 teaser tighter */
.sec.teaser{padding-block:clamp(11px,1.5vw,17px)}
.teaser .wrap{align-items:center}
.teaser img{width:min(225px,50vw)}
.teaser .sec-head{align-content:center}
/* 13 read more */
.prose--more .more{display:grid;gap:.65rem}
.prose--more .more[hidden]{display:none}
.more-btn{justify-self:start;background:none;border:0;padding:0;font:700 .98rem var(--f-body);color:var(--ink);text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:2px;cursor:pointer}
.more-btn__close{display:none}
.more-btn[aria-expanded="true"] .more-btn__open{display:none}
.more-btn[aria-expanded="true"] .more-btn__close{display:inline}
#see-title,.page--sub #see-title{color:var(--ink)}
/* 14/20 Good to know accordion, yellow accent */
.gtks{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:clamp(20px,3vw,40px);align-items:start}
.gtk{border-bottom:1.5px solid var(--ink)}
.gtk__col .gtk:first-child{border-top:1.5px solid var(--ink)}
.gtk summary{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:12px 2px;cursor:pointer;list-style:none;font-weight:700}
.gtk summary::-webkit-details-marker{display:none}
.gtk__ico{width:26px;height:26px;border-radius:50%;background:var(--yellow);position:relative;flex:none}
.gtk__ico::before,.gtk__ico::after{content:"";position:absolute;left:50%;top:50%;width:11px;height:2.5px;background:var(--ink);transform:translate(-50%,-50%)}
.gtk__ico::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .15s}
.gtk[open] .gtk__ico::after{transform:translate(-50%,-50%) rotate(0deg)}
.gtk p{padding:0 2px 14px;font-size:.95rem}
@media (max-width:700px){.gtks{grid-template-columns:1fr}.gtk__col + .gtk__col .gtk:first-child{border-top:0}}
/* 20 what's included as an icon list */
.incl2-title{font-size:1.35rem;margin-bottom:.9rem}
.incl2{list-style:none;margin:0 0 clamp(28px,4vw,44px);padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px 28px}
.incl2 li{display:grid;grid-template-columns:40px minmax(0,1fr);gap:12px;align-items:start}
.incl2 svg{width:40px;height:40px}
.incl2 strong{display:block;font-family:var(--f-display);font-weight:400;font-size:1.1rem;text-transform:uppercase;letter-spacing:.03em}
.incl2 span{font-size:.95rem}
@media (max-width:860px){.incl2{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:520px){.incl2{grid-template-columns:1fr}}
/* 21 route + schedule timeline on blue */
.tl{list-style:none;margin:0;padding:0;display:grid}
.tl li{display:grid;grid-template-columns:36px minmax(0,1fr);gap:14px;padding-bottom:16px;position:relative}
.tl li:not(:last-child)::before{content:"";position:absolute;left:17px;top:36px;bottom:0;width:2px;background:var(--ink)}
.tl .pin{width:36px;height:36px;position:relative;z-index:1}
.tl .pin--2{background:#000;color:#fff}
.tl__dot{width:16px;height:16px;border-radius:50%;background:var(--paper);border:2px solid var(--ink);margin:10px auto 0;position:relative;z-index:1}
.tl__time{display:inline-block;background:var(--yellow);color:var(--ink);font-family:var(--f-display);font-size:.85rem;padding:.15em .65em;border-radius:999px;margin-bottom:.3rem}
.tl strong{display:block;line-height:1.3}
.tl__line{display:block;font-size:.95rem}
/* 18 upcoming games card */
.empty-cal--card{border:0;background:var(--pink);color:var(--paper);padding:clamp(20px,3vw,28px)}
.empty-cal--card .ph{background:var(--paper);color:var(--ink);border-color:var(--paper)}
/* 19 sliding gallery: no scrollbar */
.hgal__track{scrollbar-width:none;padding-bottom:0}
.hgal__track::-webkit-scrollbar{display:none}
/* 23 shop hero subline sentence case */
.thero__hook--long{text-transform:none}
/* 24 shop cards: graphics same height, buttons aligned at the bottom */
.do img.do__bg{height:120px;width:auto}
@media (max-width:640px){.teaser img{width:150px}.teaser .wrap{gap:10px}}

/* ================= Update 14 ================= */
/* 3 headers on white rotate pink / blue / dark green by section; yellow grounds get dark green */
section[data-hc="pink"] :is(h1,h2){color:var(--pink)!important}
section[data-hc="blue"] :is(h1,h2){color:var(--blue)!important}
section[data-hc="green"] :is(h1,h2){color:var(--green)!important}
.about h2,.about h3,.teaser h2,.book--yellow h2,.thero--yellow h1,.raimundo h3{color:var(--green)!important}
/* 17 shop hero on yellow: dark green title, black subline */
.thero--yellow{background:var(--yellow);color:var(--ink)}
.thero--yellow .thero__hook,.thero--yellow p,.thero--yellow span{color:var(--ink)}
.thero--yellow .btn{border-color:var(--ink)}
/* 4 Bocas Getaways line: one editorial style everywhere, close to the FAQ line */
.bg-line{text-align:center;padding:28px var(--gutter) 6px;font-weight:700;font-size:1.05rem;margin:0}
.bg-line .link,.page--sub .bg-line .link{color:var(--ink)}
.bg-line + .faq-link{padding-top:0;margin-top:0}
.faq-link{padding-top:6px}
main > .bg-line:last-child{padding-bottom:28px}
/* 7 home tour cards: white, color in the details */
.card{background:var(--paper)}
.card--c-blue{border:2px solid var(--blue)}
.card--c-pink{border:2px solid var(--pink)}
.card--c-blue h3,.card--c-blue h3 a{color:var(--blue)!important}
.card--c-pink h3,.card--c-pink h3 a{color:var(--pink)!important}
.card--c-blue .price strong{background:var(--blue);color:var(--paper)}
.card--c-pink .price strong{background:var(--pink);color:var(--paper)}
.card .hook,.card .price small{color:var(--ink)}
.card .link{color:var(--ink)}
.card--c-blue .photo{border-bottom-color:var(--blue)}
.card--c-pink .photo{border-bottom-color:var(--pink)}
/* 9 full-width photo: whole photo, 70% wide, centered */
.fullbleed{background:var(--paper);line-height:0;padding:0 0 clamp(40px,6vw,72px)}
.fullbleed__img{width:70%;height:auto;margin:0 auto;object-fit:initial;display:block}
/* 10/13 tighter gap after the photo galleries */
.gal-sec,.hgal-sec{padding-bottom:clamp(16px,2vw,24px)}
.gal-sec + .sec,.hgal-sec + .sec{padding-top:clamp(24px,3vw,36px)}
/* 12 upcoming games: white card, blue border */
.empty-cal--blue{border:2px solid var(--blue);background:var(--paper);color:var(--ink);padding:clamp(20px,3vw,28px)}
.empty-cal--blue .ph{background:var(--blue);color:var(--paper);border-color:var(--blue)}
/* 6 Know before you go: one editorial layout */
.kb{border-top:1.5px solid var(--ink)}
.kb-row{display:grid;grid-template-columns:200px minmax(0,1fr);gap:clamp(16px,3vw,40px);padding:20px 0;border-bottom:1.5px solid var(--ink);align-items:start}
.kb-label{font-family:var(--f-display);font-weight:400;font-size:1.1rem;letter-spacing:.03em;text-transform:uppercase;margin:0;line-height:1.25}
.kb-label--pink{color:var(--pink)!important}.kb-label--blue{color:var(--blue)!important}.kb-label--green{color:var(--green)!important}
.kb-facts{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 28px}
.kb-facts li{display:grid;grid-template-columns:30px minmax(0,1fr);gap:12px;align-items:start}
.kb-facts svg{width:30px;height:30px}
.kb-fact__label{display:block;font-size:.75rem;font-weight:700;text-transform:uppercase;letter-spacing:.07em}
.kb-fact__value{display:block;font-weight:600;line-height:1.35}
.kb-list{margin:0}
.kb-list strong{font-weight:700}
.kb-gtk{margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px 28px}
.kb-gtk dt{font-weight:700}
.kb-gtk dd{margin:.15rem 0 0;font-size:.95rem}
@media (max-width:760px){.kb-row{grid-template-columns:1fr;gap:10px}.kb-facts,.kb-gtk{grid-template-columns:1fr}}
/* 5 booking: the form reads as a form, the summary reads as information */
.bform{background:var(--paper);border:2px solid var(--ink);border-radius:8px;box-shadow:0 8px 24px rgba(0,0,0,.18);padding:clamp(18px,2.5vw,28px)}
.bform__title{font-family:var(--f-display);font-weight:400;font-size:1.2rem;color:var(--ink)!important;margin:0 0 .4rem;text-transform:uppercase;letter-spacing:.03em}
.bform input[type=text],.bform input:not([type]),.bform input[type=email],.bform input[type=tel],.bform input[type=number]{background:#F2F2F2;border:1.5px solid #D6D6D6;border-radius:8px;padding:.7em .85em;font:inherit;color:var(--ink)}
.bform input::placeholder{color:#8A8A8A;opacity:1}
.bform input:focus{outline:none;border-color:var(--pink);box-shadow:0 0 0 3px rgba(222,16,129,.25);background:var(--paper)}
.bform .chip > span,.bform .pill > span{cursor:pointer;transition:background .12s,border-color .12s}
.bform .chip:hover > span,.bform .pill:hover > span{border-color:var(--pink);background:#FFF0F7}
.bform .chip input:checked + span,.bform .pill input:checked + span{background:var(--pink);border-color:var(--pink);color:var(--paper)}
.bform .chip input:focus-visible + span,.bform .pill input:focus-visible + span{outline:3px solid rgba(222,16,129,.4);outline-offset:2px}
.bform .stepper{border-radius:8px}
.bform .stepper button{cursor:pointer}
.bform .stepper button:hover,.bform .stepper button:active{background:#FFF0F7;color:var(--pink)}
.bform .btn--block{width:100%;font-size:1.2rem;padding-block:1em;margin-top:.6rem}
.summary,.page--sub .summary{border:0;box-shadow:none;background:#FEF8D8}
.book--yellow .summary{background:#E3F4FA}
.summary dl > div{border-color:rgba(0,0,0,.12)}
/* 16 baseball booking on yellow, dark green header */
.book--yellow,.page--sub .book--yellow{background:var(--yellow);color:var(--ink)}
.book--yellow .sec-head p{color:var(--ink)}
/* 15 route: light sea; timeline tighter so both columns match */
.tl li{padding-bottom:10px;gap:12px}
.tl .pin{width:32px;height:32px;font-size:.92rem}
.tl li:not(:last-child)::before{left:15px;top:32px}
.tl__dot{margin-top:8px}
.tl strong{font-size:.95rem}
.tl__line{font-size:.88rem}
.tl__time{font-size:.78rem;margin-bottom:.15rem}

/* ================= Update 15 ================= */
/* B1 headers: black + one accent per page (accent set by data-hc) */
section[data-hc="black"] :is(h1,h2){color:var(--ink)!important}
.kbyg2 h3,.book h3.fstep,.kq__t{color:var(--ink)}
/* Part A: magazine galleries */
.mz{display:flex;gap:10px;align-items:flex-start;width:100%}
.mz__rows{display:flex;flex-direction:column;gap:10px;min-width:0;flex:1}
.mz__row{display:flex;gap:10px}
.mz__t{margin:0;flex:none;position:relative;border-radius:var(--r-box);overflow:hidden;background:#eee;transition:transform .28s ease,box-shadow .28s ease;z-index:0}
.mz__img{display:block;width:100%;height:100%;object-fit:cover}
.mz--flat{flex-wrap:wrap}
.mz--flat .mz__lead,.mz--flat .mz__rows,.mz--flat .mz__row{display:contents}
@media (hover:hover) and (pointer:fine){
  .mz__t:hover,.sgal > div:hover{transform:scale(1.07);box-shadow:0 14px 30px rgba(0,0,0,.35);z-index:3}
}
.sgal > div{transition:transform .28s ease,box-shadow .28s ease;position:relative;z-index:0}
.sgal{overflow:visible}
/* lightbox (touch) */
.lbx{position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.92);display:flex;align-items:center;justify-content:center}
.lbx[hidden]{display:none}
.lbx__img{max-width:94vw;max-height:86vh;object-fit:contain;border-radius:var(--r-box)}
.lbx__close{position:absolute;top:14px;right:14px;width:46px;height:46px;border-radius:50%;border:0;background:var(--paper);color:var(--ink);font-size:2rem;line-height:1;cursor:pointer}
.lbx__nav{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;border:0;background:rgba(255,255,255,.85);color:var(--ink);font-size:1.8rem;cursor:pointer}
.lbx__prev{left:10px}.lbx__next{right:10px}
/* B2 Know before you go: facts box + key lines + drop-downs */
.kbyg2 .facts{border:1.5px solid var(--ink)!important;border-radius:var(--r-box);margin-bottom:18px}
.kbyg2 .fact{border:0!important}
.kb-key{list-style:none;margin:0 0 18px;padding:0;display:grid;gap:.35rem}
.kb-key li{font-weight:700;padding-left:22px;position:relative}
.kb-key li::before{content:"";position:absolute;left:0;top:.45em;width:10px;height:10px;border-radius:50%;background:var(--pink)}
.kq-list{border-top:1.5px solid var(--ink)}
.kq{border-bottom:1.5px solid var(--ink)}
.kq summary{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:14px 2px;cursor:pointer;list-style:none}
.kq summary::-webkit-details-marker{display:none}
.kq__t{font-weight:700;font-size:1.02rem}
.kq__ind{width:28px;height:28px;border-radius:50%;border:2px solid var(--ink);position:relative;flex:none}
.kq__ind::before,.kq__ind::after{content:"";position:absolute;left:50%;top:50%;width:11px;height:2.5px;background:var(--ink);transform:translate(-50%,-50%)}
.kq__ind::after{transform:translate(-50%,-50%) rotate(90deg);transition:transform .15s}
.kq[open] .kq__ind::after{transform:translate(-50%,-50%) rotate(0deg)}
.kq__a{padding:0 2px 16px}
.kq__a .ticks{margin:0}
/* B3 booking: receipt summary (white, zig-zag edges, dashed rows, total) */
.summary,.page--sub .summary,.book--yellow .summary{background:var(--paper)!important;border:0;box-shadow:0 6px 18px rgba(0,0,0,.12);border-radius:0;padding:28px 24px;position:relative}
.summary--receipt{--zz:9px;-webkit-mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/calc(2*var(--zz)) 51% repeat-x,conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) top/calc(2*var(--zz)) 51% repeat-x;mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/calc(2*var(--zz)) 51% repeat-x,conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) top/calc(2*var(--zz)) 51% repeat-x;box-shadow:none!important;padding-block:34px!important}
.summary dl > div{border-top:0!important;border-bottom:1.5px dashed rgba(0,0,0,.35)!important}
.summary__total{border-bottom:0!important;border-top:2px solid var(--ink)!important;margin-top:6px;padding-top:.7rem!important}
.summary__total dt,.summary__total dd{font-family:var(--f-display);font-weight:400;font-size:1.05rem;text-transform:uppercase}
/* B3 form: numbered steps, fillable fields, tappable chips, compact centered submit */
.fstep{display:flex;align-items:center;gap:10px;font-family:var(--f-display);font-weight:400;font-size:1.1rem;text-transform:uppercase;letter-spacing:.03em;margin:.6rem 0 .5rem}
.fstep:not(:first-of-type){margin-top:1.4rem;padding-top:1.2rem;border-top:1.5px solid #E2E2E2}
.fstep__n{width:28px;height:28px;border-radius:50%;background:var(--pink);color:var(--paper);display:grid;place-items:center;font-size:.9rem;flex:none}
.req{color:var(--pink);font-weight:700;margin-left:2px}
.ifield{position:relative;display:block}
.ifield .ficon{position:absolute;left:12px;top:50%;transform:translateY(-50%);width:18px;height:18px;color:#7A7A7A;pointer-events:none}
.ficon--lead{width:18px;height:18px;vertical-align:-3px;margin-right:6px;color:#7A7A7A}
.bform .ifield input{padding-left:40px!important}
.bform input:not([type=checkbox]):not([type=radio]):not([type=number]){min-height:52px;transition:border-color .15s,box-shadow .15s,transform .15s}
.bform input:focus{transform:translateY(-1px);box-shadow:0 0 0 3px rgba(222,16,129,.25),0 6px 14px rgba(0,0,0,.1)!important}
.bform .chip > span,.bform .pill > span{box-shadow:0 2px 6px rgba(0,0,0,.12);transition:transform .15s,box-shadow .15s,background .12s,border-color .12s}
.bform .chip:hover > span,.bform .pill:hover > span{transform:translateY(-2px);box-shadow:0 6px 12px rgba(0,0,0,.16)}
.bform .chip input:checked + span,.bform .pill input:checked + span{background:var(--pink)!important;border-color:var(--pink)!important;color:var(--paper)!important}
.bform .chip input:checked + span *{color:var(--paper)!important}
.bform__submit{display:flex;justify-content:center;margin-top:1.2rem}
.btn--submit{font-size:1.1rem;padding:.85em 2em;border-color:var(--ink)}
.bform__title{display:none}
/* B4 WhatsApp icon: dark green circle */
.social a[aria-label="WhatsApp"],.wa-ico{background:var(--green)!important}
/* B5 home cards: plain prices, centered buttons */
.card .price strong,.card--c-blue .price strong,.card--c-pink .price strong{background:none!important;color:var(--ink)!important;padding:0;font-size:1.8rem}
.card__actions{justify-content:center}
/* B6 full-width photo: 85% */
.fullbleed__img{width:85%}
/* B13 shop hero blue */
.thero--blue{background:var(--blue);color:var(--paper)}
.thero--blue h1,.thero--blue p,.thero--blue .thero__hook{color:var(--paper)!important}
.thero--blue .btn{background:var(--yellow);color:var(--ink);border-color:var(--yellow)}
/* B14 merch tag: looks like a button, does nothing */
.btn--tag{cursor:default;background:var(--paper);color:var(--ink);border:2px solid var(--ink)}
.btn--tag:hover{background:var(--paper);color:var(--ink);border-color:var(--ink)}
/* B16 numbers on blue are white */
.qa--1 .qa__n,.page--sub .qa--1 .qa__n,.page--sub .seelist li:nth-child(even)::before,.pin--2{color:var(--paper)!important}
.book__grid{align-items:start}

/* ================= Update 16 ================= */
/* 1 galleries: no hover enlarge; click opens the preview */
.mz__t:hover,.sgal > div:hover{transform:none!important;box-shadow:none!important}
.mz__img,.sgal img{cursor:pointer}
.lbx__img{max-width:92vw;max-height:88vh;object-fit:contain}
/* 2 Know before you go drop-downs: same as the FAQ, two columns */
.kb-faq{margin-top:4px}
.qa--kb summary{grid-template-columns:minmax(0,1fr) 36px}
.qa--kb .qa__a{padding:0 4px 18px 4px}
.qa--kb .qa__a .ticks{margin:0}
.qa--kb[open] .qa__ind{background:var(--pink);border-color:var(--pink)}
.qa--kb[open] .qa__ind::before,.qa--kb[open] .qa__ind::after{background:var(--paper)}
/* 3 booking form: clear title, ~25-30% more compact */
.bform{padding:clamp(16px,2vw,22px)}
.bform__head{font-family:var(--f-display);font-weight:400;font-size:1.5rem;line-height:1.1;text-transform:uppercase;letter-spacing:.03em;color:var(--ink)!important;margin:0 0 .5rem}
.bform .fstep{font-size:.92rem;margin:.3rem 0 .35rem}
.bform .fstep:not(:first-of-type){margin-top:.8rem;padding-top:.7rem}
.bform .fstep__n{width:22px;height:22px;font-size:.75rem}
.bform .fgroup,.bform .grid2{gap:.55rem .9rem}
.bform .field{gap:.25rem}
.bform label,.bform .flabel{font-size:.82rem}
.bform input:not([type=checkbox]):not([type=radio]):not([type=number]){min-height:40px;font-size:.9rem;padding-block:.45em}
.bform .ifield .ficon{width:16px;height:16px;left:11px}
.bform .ifield input{padding-left:36px!important}
.bform .chip > span{min-height:44px;padding:.35em .3em;font-size:.85rem}
.bform .pill > span{height:38px;font-size:.85rem;padding:0 1em}
.bform .stepper input,.bform .stepper button{height:38px}
.bform .consents{gap:.35rem;font-size:.8rem;margin-top:.5rem}
.bform__submit{margin-top:.8rem}
.btn--submit{font-size:1rem;padding:.7em 1.8em}
/* 4 home tour cards: same padding, rows lined up, even spacing */
.card > *{margin-inline:24px}
.card h3{margin-top:22px;margin-bottom:0}
.card .hook{margin-top:10px}
.card .price{margin-top:14px;align-content:start}
.card__actions{margin-top:18px;margin-bottom:24px;align-self:end}
/* 7 walking: about / see headers pink */
.duo h2,.duo #see-title,.duo #about-title{color:var(--pink)!important}
/* 11 shop intro text */
.shop-intro{max-width:68ch;display:grid;gap:.8rem;font-size:1.12rem;line-height:1.6;margin:-6px 0 clamp(24px,3vw,36px)}
/* 3b tighter form: smaller gaps, 40px fields, details in 3 columns on wide screens */
.bform{gap:12px}
.bform .fgroup{gap:10px}
.bform .fgroup + .fgroup{padding-top:12px;border-top:1.5px solid #E2E2E2}
.bform .field{gap:.2rem}
.bform input[type=text],.bform input:not([type]),.bform input[type=email],.bform input[type=tel]{height:40px;min-height:40px!important;font-size:.9rem}
.bform .fstep:not(:first-of-type){margin-top:.2rem;padding-top:.6rem}
.bform .chips{gap:6px;grid-template-columns:repeat(auto-fill,minmax(70px,1fr))}
.bform .stepper{max-width:200px}
@media (min-width:1100px){.bform .fgroup .grid2:has(#f-name){grid-template-columns:repeat(3,minmax(0,1fr))}}
/* ===== Update 17 ===== */
/* A1 loading screen */
.ldr{position:fixed;inset:0;z-index:9999;background:#fff;display:grid;place-items:center;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .25s ease,visibility 0s linear .25s}
.ldr img{width:100px;height:auto;animation:ldr-bob 1.2s ease-in-out infinite}
html.ldr-on .ldr{opacity:1;visibility:visible;pointer-events:auto;transition:opacity .25s ease}
@keyframes ldr-bob{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-8px) rotate(2deg)}}
@media (prefers-reduced-motion:reduce){.ldr img{animation:none!important}}
/* A2 footer: logo | concepts | contact */
.foot{padding-block:clamp(28px,3.5vw,40px) 14px}
.foot__main.foot__main--3{display:grid!important;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:start;gap:24px;padding-bottom:22px}
.foot__main--3 > *{margin:0}
.foot__main--3 .foot__brand{justify-self:start;line-height:0}
.foot__main--3 .foot__col--c{justify-self:center}
.foot__main--3 .foot__col--r{justify-self:end}
.foot__main--3 h3{margin-top:0}
.foot__main--3 .foot__brand .foot__logo{width:150px;display:block}
.foot__main--3 .social{margin-top:.6rem}
/* A3 form titles */
.bform__head{font-size:clamp(1.7rem,3.2vw,2.4rem)!important;text-align:center;margin:0 0 .9rem!important}
/* A4 home hero carousel */
.hero.hcar{background:#000}
.hcar__slides,.hcar__s{position:absolute;inset:0}
.hcar__s{opacity:0;transition:opacity 1.2s ease}
.hcar__s.is-on{opacity:1}
.hcar__img{width:100%;height:100%;object-fit:cover;display:block}
.hcar__shade{position:absolute;inset:auto 0 0 0;height:60%;background:linear-gradient(to top,rgba(0,0,0,.55),rgba(0,0,0,.18) 55%,rgba(0,0,0,0));pointer-events:none}
.hcar .hero__ctas{bottom:clamp(46px,7vw,84px);z-index:2}
.hcar__dots{position:absolute;left:0;right:0;bottom:clamp(14px,2.2vw,24px);display:flex;justify-content:center;gap:10px;z-index:2}
.hcar__dot{width:11px;height:11px;border-radius:50%;border:2px solid #fff;background:transparent;padding:0;cursor:pointer}
.hcar__dot[aria-current="true"]{background:#fff}
/* A6 find our shop: boxes fit their content, Maps button centered */
.map__grid--home{align-items:start}
.map__pair{grid-template-rows:none!important;align-content:start}
.map__pair > .btn{justify-self:center!important}
/* A7 the route (walking) */
.duo #wroute-title{color:var(--pink)!important}
.wroute{margin-top:2px}
.pend{display:inline-block;font-size:.75rem;font-weight:700;background:#eee;color:#555;padding:.1em .5em;border-radius:4px;margin-left:.3rem}
/* A9 / A13 stepper: three equal-height parts, number centered */
.stepper,.bform .stepper{height:44px;align-items:stretch}
.stepper > button,.stepper > input,.bform .stepper input,.bform .stepper button{height:100%!important;min-height:0!important;margin:0;padding:0!important;line-height:1;box-sizing:border-box}
.stepper > button{display:flex;align-items:center;justify-content:center}
.stepper > input{text-align:center}
/* A9 date field + calendar */
.dpick{position:relative;max-width:300px}
.dpick__input{cursor:pointer;caret-color:transparent}
.dpick__pop{position:absolute;top:calc(100% + 6px);left:0;z-index:30;width:min(300px,calc(100vw - 48px));background:#fff;border:1.5px solid var(--ink);border-radius:8px;box-shadow:0 10px 28px rgba(0,0,0,.2);padding:12px}
.dpick__pop[hidden]{display:none}
.dpick__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}
.dpick__month{font-family:var(--f-display);font-size:1.05rem;text-transform:uppercase;letter-spacing:.02em}
.dpick__nav{width:34px;height:34px;border:1.5px solid var(--ink);border-radius:50%;background:#fff;color:var(--ink);font-size:1.3rem;line-height:1;cursor:pointer;display:grid;place-items:center;padding:0 0 3px}
.dpick__nav:hover:not(:disabled){background:#FFF0F7;color:var(--pink);border-color:var(--pink)}
.dpick__nav:disabled{opacity:.25;cursor:default}
.dpick__grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;text-align:center}
.dpick__dow{font-size:.72rem;font-weight:700;color:#777;padding:2px 0 4px}
.dpick__d{aspect-ratio:1;width:100%;border:1.5px solid var(--pink);border-radius:50%;background:#FFF0F7;font:700 .88rem var(--f-body);color:var(--ink);cursor:pointer;padding:0}
.dpick__d:hover:not(:disabled),.dpick__d[aria-pressed="true"]{background:var(--pink);color:#fff}
.dpick__d:disabled{background:none;border-color:transparent;color:#c8c8c8;font-weight:500;cursor:default}
.dpick__d:focus-visible,.dpick__nav:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
/* A10 baseball photo header */
.bbhead{position:relative;height:clamp(360px,50vw,660px);overflow:hidden;background:#000;display:grid;place-items:center;text-align:center}
.bbhead__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.bbhead::after{content:"";position:absolute;inset:0;background:rgba(0,0,0,.4)}
.bbhead__txt{position:relative;z-index:1;padding-inline:var(--gutter)}
.bbhead h2{display:grid;gap:.25em;margin:0;text-transform:uppercase;color:#fff!important;font-size:clamp(1.3rem,3vw,2.2rem);line-height:1.05}
.bbhead__big{color:var(--yellow);font-size:clamp(2.6rem,8.4vw,6.6rem);line-height:.95}
.bbhead__sub{color:#fff;letter-spacing:.04em}
/* A12 game day route: white time boxes, yellow numbered circles with black numbers */
.tl__time{background:#fff!important;color:var(--ink)!important}
.tl .pin[class]{background:var(--yellow)!important;color:var(--ink)!important;border:0!important}
/* A14 shop hero: the photo, title bottom-left */
.shero{position:relative;height:clamp(380px,52vw,720px);overflow:hidden;background:#000}
.shero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 40%}
.shero__shade{position:absolute;inset:0;background:linear-gradient(to top right,rgba(0,0,0,.6),rgba(0,0,0,.2) 40%,rgba(0,0,0,0) 65%);pointer-events:none}
.shero__txt{position:absolute;left:0;bottom:0;padding:0 var(--gutter) clamp(24px,4vw,48px)}
.shero h1{color:#fff!important;font-size:clamp(2.6rem,7vw,5.6rem);line-height:.95;margin:0}
/* mosaic dots exist only for the mobile slider */
.mz__dots{display:none}

/* ----- PART B: mobile only ----- */
/* B1 header + menu (wherever the menu icon shows) */
.lang--menu{display:none}
@media (max-width:1200px){
  .head{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important}
  .head > .menu-btn{justify-self:start}
  .head > .right{justify-self:end}
  .head-tools .lang{display:none}
  .mobile-nav .mnav-row > a{font:400 1.15rem var(--f-display);text-decoration:none;color:var(--ink);padding:.65em 0}
  .mobile-nav .mnav-row .mnav-arrow{border:0!important;width:44px;height:auto;align-self:stretch}
  .mobile-nav .lang--menu{display:inline-flex;justify-self:start;margin-top:1rem;border:2px solid var(--ink)}
  .mobile-nav .lang--menu button{width:auto;border:0;padding:.35em 1em;font:700 .9rem var(--f-body);text-align:center}
  .mobile-nav .lang--menu button[aria-pressed="true"]{background:var(--green);color:var(--paper)}
}
/* B4 booking: form first, receipt below, nothing overlaps */
@media (max-width:900px){
  .book__grid{gap:20px}
  .book__grid > .bform{order:1}
  .book__grid > .summary{order:2;margin:0;position:static!important;transform:none}
}
/* B2 alignment + B3 sliders */
@media (max-width:760px){
  .wrap{width:100%;max-width:none;box-sizing:border-box}
  img,svg,video{max-width:100%}
  .sec-head{margin-inline:auto;text-align:center;justify-items:center;max-width:none}
  .sec-head .ph{justify-self:center}
  .about__body > h2,.about__lede{text-align:center}
  .raimundo{justify-items:center!important;text-align:center!important;justify-self:center}
  .raimundo img{width:170px}
  .thero .wrap > div:first-child{text-align:center}
  .thero .hchips,.hchips{justify-content:center}
  .thero__price{justify-content:center}
  .card{text-align:center}
  .card__actions{justify-content:center}
  .card .price{justify-items:center;text-align:center}
  .do{align-items:center;text-align:center}
  .do > div:last-child{display:flex;justify-content:center}
  .why__item{text-align:center;justify-items:center}
  .why__item svg{margin-inline:auto}
  .teaser .wrap{justify-items:center;text-align:center}
  .teaser img{margin-inline:auto}
  .locals .wrap{text-align:center;justify-items:center}
  .tabs{justify-content:center}
  .map__note,.faq-link,.bg-line,.ig-slot{text-align:center}
  .how img{justify-self:center}
  .shop-intro{max-width:none}
  .stepper,.bform .stepper{max-width:none}
  .dpick{max-width:none}
  .foot__main.foot__main--3{grid-template-columns:1fr;justify-items:center;text-align:center;gap:22px}
  .foot__main--3 > *{justify-self:center!important}
  .foot__main--3 .concepts--col{justify-items:center;align-items:center}
  .foot__main--3 .social{justify-content:center}
  .foot__bar{justify-content:center;text-align:center}
  /* B3 swipe slider: one photo at a time, same height, next photo peeks, dots below */
  .mz.mz--slide{display:flex;gap:8px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;margin-inline:calc(-1 * var(--gutter));width:auto;padding-inline:calc(var(--gutter) + 8px);position:relative;-webkit-overflow-scrolling:touch}
  .mz.mz--slide::-webkit-scrollbar{display:none}
  .mz--slide .mz__lead,.mz--slide .mz__rows,.mz--slide .mz__row{display:contents}
  .mz--slide .mz__t{flex:0 0 calc(100vw - 2 * var(--gutter) - 16px);width:auto!important;height:auto!important;aspect-ratio:1/1;scroll-snap-align:center}
  .mz--slide .mz__img{width:100%;height:100%;object-fit:cover}
  .mz__dots{display:flex;justify-content:center;gap:8px;margin-top:14px}
  .mz__dot{width:9px;height:9px;border-radius:50%;border:1.5px solid var(--ink);background:transparent;padding:0;cursor:pointer}
  .mz__dot[aria-current="true"]{background:var(--ink)}
}
.ifield .ficon{z-index:1}

/* ===== Update 18 ===== */
/* C1 Phosphor Light icons */
.fact svg{width:40px;height:40px}
.ficon{fill:currentColor}
.ticks li::before{background:var(--pink)!important;border:0!important;border-radius:0!important;width:1.25em!important;height:1.25em!important;top:.1em!important;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M172.24,99.76a6,6,0,0,1,0,8.48l-56,56a6,6,0,0,1-8.48,0l-24-24a6,6,0,0,1,8.48-8.48L112,151.51l51.76-51.75A6,6,0,0,1,172.24,99.76ZM230,128A102,102,0,1,1,128,26,102.12,102.12,0,0,1,230,128Zm-12,0a90,90,0,1,0-90,90A90.1,90.1,0,0,0,218,128Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M172.24,99.76a6,6,0,0,1,0,8.48l-56,56a6,6,0,0,1-8.48,0l-24-24a6,6,0,0,1,8.48-8.48L112,151.51l51.76-51.75A6,6,0,0,1,172.24,99.76ZM230,128A102,102,0,1,1,128,26,102.12,102.12,0,0,1,230,128Zm-12,0a90,90,0,1,0-90,90A90.1,90.1,0,0,0,218,128Z'/%3E%3C/svg%3E") center/contain no-repeat}
.ticks li::after{display:none!important}
.ticks li{padding-left:1.9em}
.qa__ind{border:0!important;width:36px!important;height:36px!important;background:var(--ink);-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M128,26A102,102,0,1,0,230,128,102.12,102.12,0,0,0,128,26Zm0,192a90,90,0,1,1,90-90A90.1,90.1,0,0,1,128,218Zm46-90a6,6,0,0,1-6,6H134v34a6,6,0,0,1-12,0V134H88a6,6,0,0,1,0-12h34V88a6,6,0,0,1,12,0v34h34A6,6,0,0,1,174,128Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M128,26A102,102,0,1,0,230,128,102.12,102.12,0,0,0,128,26Zm0,192a90,90,0,1,1,90-90A90.1,90.1,0,0,1,128,218Zm46-90a6,6,0,0,1-6,6H134v34a6,6,0,0,1-12,0V134H88a6,6,0,0,1,0-12h34V88a6,6,0,0,1,12,0v34h34A6,6,0,0,1,174,128Z'/%3E%3C/svg%3E") center/contain no-repeat}
.qa__ind::before,.qa__ind::after{display:none!important}
.qa[open] .qa__ind{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M174,128a6,6,0,0,1-6,6H88a6,6,0,0,1,0-12h80A6,6,0,0,1,174,128Zm56,0A102,102,0,1,1,128,26,102.12,102.12,0,0,1,230,128Zm-12,0a90,90,0,1,0-90,90A90.1,90.1,0,0,0,218,128Z'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M174,128a6,6,0,0,1-6,6H88a6,6,0,0,1,0-12h80A6,6,0,0,1,174,128Zm56,0A102,102,0,1,1,128,26,102.12,102.12,0,0,1,230,128Zm-12,0a90,90,0,1,0-90,90A90.1,90.1,0,0,0,218,128Z'/%3E%3C/svg%3E")}
.qa--kb[open] .qa__ind{background:var(--pink)!important}
.mobile-nav .mnav-arrow::after{border:0!important;width:22px!important;height:22px!important;background:var(--ink);transform:translate(-50%,-50%)!important;top:50%!important;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M212.24,100.24l-80,80a6,6,0,0,1-8.48,0l-80-80a6,6,0,0,1,8.48-8.48L128,167.51l75.76-75.75a6,6,0,0,1,8.48,8.48Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 256 256'%3E%3Cpath d='M212.24,100.24l-80,80a6,6,0,0,1-8.48,0l-80-80a6,6,0,0,1,8.48-8.48L128,167.51l75.76-75.75a6,6,0,0,1,8.48,8.48Z'/%3E%3C/svg%3E") center/contain no-repeat;transition:transform .15s}
.mobile-nav .mnav-arrow[aria-expanded="true"]::after{transform:translate(-50%,-50%) rotate(180deg)!important}
.lbx__close,.lbx__nav{display:grid;place-items:center;padding:0}
.lbx__close svg{width:26px;height:26px}
.lbx__nav svg{width:24px;height:24px}
.dpick__nav{padding:0!important}
.dpick__nav svg{width:18px;height:18px}
.slider-ctrl button{display:grid;place-items:center;padding:0}
.slider-ctrl button svg{width:22px;height:22px}
.social a{color:#fff}
.social svg{width:24px;height:24px;fill:currentColor}
.foot .social svg{width:22px;height:22px}

/* D1 perforated edges: the receipt's zig-zag, same size everywhere */
.zz-tb{--zz:9px;-webkit-mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/calc(2*var(--zz)) 51% repeat-x,conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) top/calc(2*var(--zz)) 51% repeat-x;mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/calc(2*var(--zz)) 51% repeat-x,conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) top/calc(2*var(--zz)) 51% repeat-x}
.zz-b{--zz:9px;-webkit-mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/calc(2*var(--zz)) 100% repeat-x;mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/calc(2*var(--zz)) 100% repeat-x}
.sec.teaser.zz-tb{padding-block:clamp(24px,3vw,34px)}
.locals,.page--sub .locals{background:transparent!important}
.locals .wrap{display:block!important;padding-block:clamp(32px,4vw,48px)}
.coupon{background:var(--pink);color:var(--paper);display:flex;gap:1.5rem 3rem;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:clamp(30px,4vw,44px) clamp(22px,4vw,48px)}
.coupon h2{color:var(--paper)!important}
.coupon p{color:var(--paper)}
.card .price{position:relative;padding-top:16px;margin-top:16px!important}
.card .price::before{content:"";position:absolute;top:0;left:-24px;right:-24px;border-top:2px dashed currentColor;opacity:.55}
.card--c-blue .price::before{border-color:var(--blue);opacity:1}
.card--c-pink .price::before{border-color:var(--pink);opacity:1}

/* B1 form as a floating panel */
.bform,.page--sub .bform{border:0!important;border-radius:18px!important;box-shadow:0 22px 48px rgba(0,0,0,.22),0 3px 10px rgba(0,0,0,.08)!important;background:var(--paper)}
/* B2 calendar inline on desktop */
.dpick--inline{display:flex;flex-wrap:wrap;gap:12px 18px;align-items:flex-start;max-width:none}
.dpick--inline > .ifield{flex:1 1 200px;max-width:260px}
.dpick--inline .dpick__input{cursor:default}
.dpick--inline .dpick__pop{position:static;flex:0 0 300px;width:300px;box-shadow:none;border:1.5px solid #E2E2E2;border-radius:12px;padding:12px 12px 14px}
.dpick__d[aria-pressed="true"]{background:var(--pink)!important;color:#fff!important;border-color:var(--pink)!important}

/* A6 receipt line flashes when the form changes it */
@keyframes sumflash{0%{background:rgba(249,211,23,.6)}100%{background:rgba(249,211,23,0)}}
.summary dl > div.flash{animation:sumflash .9s ease-out}

/* A5 Ken Burns on the home hero */
@keyframes kb{from{transform:scale(1)}to{transform:scale(1.06)}}
.hcar__s.is-on .hcar__img{animation:kb 6.5s linear forwards}
.hcar__s.was-on .hcar__img{transform:scale(1.06)}

/* A2 scroll entrances (classes added by script; plays once) */
.rv{opacity:0;transform:translateY(24px);transition:opacity .42s ease,transform .42s ease;transition-delay:var(--d,0s)}
.rv.rv--zoom{transform:scale(.96)}
.rv.rv-in{opacity:1;transform:none}
.steps li.rv .step-n{transform:scale(.3);transition:transform .38s cubic-bezier(.34,1.56,.64,1);transition-delay:calc(var(--d,0s) + .08s)}
.steps li.rv-in .step-n{transform:none}
/* A4 route maps draw themselves */
.rmap--anim .rdraw{stroke-dashoffset:1}
.rmap--anim.draw .rdraw{stroke-dashoffset:0;transition:stroke-dashoffset var(--rl,1.8s) linear var(--rd,0s)}
.rmap--anim .rpin{transform:scale(0);transform-box:fill-box;transform-origin:center}
.rmap--anim.draw .rpin{animation:pinpop .35s cubic-bezier(.34,1.56,.64,1) var(--pd,0s) both}
@keyframes pinpop{from{transform:scale(0)}to{transform:scale(1)}}
/* A3 hover lifts (desktop) + Raimundo wiggle */
@media (hover:hover) and (pointer:fine){
  .btn:not(.btn--tag){transition:transform .18s ease,box-shadow .18s ease,background-color .15s,color .15s,border-color .15s}
  .btn:not(.btn--tag):hover{transform:translateY(-3px);box-shadow:0 8px 16px rgba(0,0,0,.18)}
  .card,.do{transition:transform .2s ease,box-shadow .2s ease}
  .card:hover,.do:hover{transform:translateY(-4px);box-shadow:0 12px 26px rgba(0,0,0,.14)}
  .raimundo img:hover,.do img[src$="st_walk.webp"]:hover,.do img[src$="surf2.webp"]:hover,.how img:hover{animation:wiggle .55s ease-in-out}
}
@keyframes wiggle{0%,100%{transform:rotate(0)}20%{transform:rotate(-7deg)}45%{transform:rotate(6deg)}70%{transform:rotate(-4deg)}88%{transform:rotate(2deg)}}
@media (max-width:760px){
  .coupon{flex-direction:column;text-align:center;justify-content:center}
}
@media (prefers-reduced-motion:reduce){.rv,.rv.rv--zoom{opacity:1!important;transform:none!important}.hcar__s.is-on .hcar__img,.hcar__s.was-on .hcar__img{transform:none!important;animation:none!important}}

/* ================= Updates 19 + 20 : design system ================= */
/* A1-A4 tokens: set once, used everywhere below */
:root{
  --green:#006747;--yellow:#F9D317;--blue:#009DC6;--pink:#DE1081;--ink:#000000;--paper:#FFFFFF;--field:#F2F2F2;
  --fs-hero:72px;--fs-h2:48px;--fs-h3:24px;--fs-lead:20px;--fs-body:18px;--fs-small:14px;--fs-label:13px;
  --sp-sec:96px;--sp-head:32px;--pad-card:32px;--gap:24px;--gutter:48px;--maxw:1200px;
  --r-card:12px;--r-photo:8px;--r-box:12px;--bw:2px;--btn-h:48px;
  --shadow:0 8px 24px rgba(0,0,0,.12);
  --rule:rgba(0,0,0,.15);
  --accent:var(--blue);
}
@media (max-width:760px){:root{--fs-hero:44px;--fs-h2:32px;--fs-h3:20px;--fs-lead:18px;--fs-body:16px;--sp-sec:72px;--pad-card:24px;--gap:16px;--gutter:24px;--btn-h:44px}}
main[data-page="walking-tour.html"]{--accent:var(--blue)}
main[data-page="baseball.html"]{--accent:var(--green)}
.wrap{max-width:var(--maxw)!important;padding-inline:var(--gutter)!important;margin-inline:auto}
body{font-size:var(--fs-body);line-height:1.6;font-weight:400}

/* A2 type scale */
h1,.thero h1,.shero h1,.lost h1{font-size:var(--fs-hero)!important;line-height:1.05!important}
h2,main h2{font-size:var(--fs-h2)!important;line-height:1.1!important}
.bbhead .bbhead__big{font-size:var(--fs-hero)!important;line-height:1.05}
.bbhead h2{font-size:var(--fs-h3)!important;gap:8px}
.coupon h2{font-size:var(--fs-h3)!important}
.bform__head,.ok__head{font-size:var(--fs-h2)!important;line-height:1.1!important}
h3,.card h3,.do h3,.why__item h3,.steps h3,.raimundo h3,.summary h3,.map__box h3,.foot h3,.incl2-title{font-size:var(--fs-h3)!important;line-height:1.1}
.thero__hook,.thero .thero__hook,.thero__hook--long,.about__lede,.sec-head p,.lead,.ok__line,.shop-intro{font-family:var(--f-body)!important;font-weight:500!important;font-size:var(--fs-lead)!important;line-height:1.5!important;text-transform:none!important;letter-spacing:0!important}
p,li,dd,.qa__a,.hook,.prose{font-size:var(--fs-body)}
.prose,.qa__a p{line-height:1.6}
small,.price small,.notice,.form__preview,.review-links,.consents,.hchip,.ctag,.foot__bar,.tl__line,.bform label,.bform .flabel,.summary dl,.faq-link,.bg-line{font-size:var(--fs-small)!important}
.summary__eyebrow,.fact__label,.ok__label,.fstep,.dpick__month,.tl__time,.summary__total dt,.kb-fact__label{font-family:var(--f-body)!important;font-weight:700!important;font-size:var(--fs-label)!important;text-transform:uppercase!important;letter-spacing:.08em!important}
.summary__total dd{font-family:var(--f-body)!important;font-weight:700!important;font-size:var(--fs-body)!important;text-transform:none!important}
.stepper input,.bform .stepper input{font:700 var(--fs-body) var(--f-body)!important}
.fact__value{font-size:var(--fs-body)!important;font-weight:600}
.qa__q{font-size:var(--fs-body)!important;font-weight:700}
.thero__price strong{font-size:var(--fs-h2)!important}
.card .price strong{font-size:var(--fs-h3)!important}
/* B: comfortable line length, no caps paragraphs, no orphan words */
.prose p,.sec-head > p,.about__body p,.shop-intro,.qa__a p,.thero__hook,.lead,.ok__line,.coupon p{max-width:680px}
h1,h2,h3{text-wrap:balance}

/* A3 spacing */
.sec{padding-block:var(--sp-sec)!important}
.sec[style*="padding-top:0"]{padding-top:0!important}
.sec.teaser{padding-block:32px!important}
.sec-head{margin-bottom:var(--sp-head)!important}
.card > *{margin-inline:var(--pad-card)!important}
.card h3{margin-top:var(--pad-card)!important}
.card__actions{margin-bottom:var(--pad-card)!important}
.do,.map__box,.bform,.ok{padding:var(--pad-card)!important}
.summary,.page--sub .summary,.book--yellow .summary{padding:40px var(--pad-card)!important}
.slider{gap:var(--gap)!important}
.do-grid,.why__grid,.steps,.sgal,.book__grid{gap:var(--gap)!important}
.mz,.mz__rows,.mz__row{gap:var(--gap)!important}

/* A4 shapes and lines */
.card,.do,.map__box,.bform,.ok,.summary,.dpick__pop,.map__frame,.facts,.stepper,.bform .stepper,.coupon{border-radius:var(--r-card)!important}
.bform input:not([type=checkbox]):not([type=radio]),.dpick__input{border-radius:var(--r-card)!important;background:var(--field)!important}
.photo,.mz__t,.sgal > div,.sgal img,.thero .photo,.lbx__img{border-radius:var(--r-photo)!important}
.card .photo{border-radius:0!important}
.hero,.fullbleed,.fullbleed img,.bbhead,.shero{border-radius:0!important}
.card,.do,.map__box,.map__frame,.facts{border-width:var(--bw)!important}
.summary dl > div{border-bottom-width:1px!important}
.bform .fgroup + .fgroup,.fstep:not(:first-of-type){border-top:1px solid var(--rule)!important}
.mz__t{background:var(--field)!important}
.bform,.page--sub .bform,.ok{box-shadow:var(--shadow)!important;border:0!important;background:var(--paper)}
.bform input::placeholder{color:rgba(0,0,0,.45)!important}
.ifield .ficon,.ficon--lead{color:var(--ink)!important}

/* A5 buttons: primary, accent, outline, text link */
.btn{height:var(--btn-h);min-height:var(--btn-h);padding:0 24px!important;display:inline-flex!important;align-items:center;justify-content:center;border-radius:999px!important;border:2px solid var(--yellow)!important;background:var(--yellow)!important;color:var(--ink)!important;font:400 var(--fs-body) var(--f-display)!important;letter-spacing:.02em;line-height:1;white-space:nowrap;width:auto;text-decoration:none}
.btn:hover,.btn:focus-visible{background:var(--yellow)!important;color:var(--ink)!important;border-color:var(--yellow)!important}
.btn--pink,.btn--pink:hover,.btn--sm.btn--pink,.head-tools .btn--pink:hover{background:var(--pink)!important;border-color:var(--pink)!important;color:var(--paper)!important}
.btn--outline,.btn--outline:hover{background:transparent!important;border-color:var(--paper)!important;color:var(--paper)!important}
.btn--sm{height:var(--btn-h)!important}
.btn--tag{height:auto!important;min-height:0!important;padding:4px 16px!important;background:transparent!important;border:2px solid var(--ink)!important;font:700 var(--fs-small) var(--f-body)!important;color:var(--ink)!important}
.btn--submit{font-size:var(--fs-body)!important}
.link,.more-btn,.map__link{font-family:var(--f-body)!important;font-weight:700;color:var(--ink)!important;text-decoration:underline!important;text-underline-offset:4px;text-decoration-thickness:2px;background:none;border:0;padding:0}
.maps .map__link{color:var(--ink)!important;justify-self:center}
.tabs button{height:var(--btn-h);padding:0 24px;display:inline-flex;align-items:center;border-radius:999px;font:400 var(--fs-body) var(--f-display);background:transparent!important;border:2px solid var(--paper)!important;color:var(--paper)!important}
.tabs button[aria-selected="true"]{background:var(--yellow)!important;border-color:var(--yellow)!important;color:var(--ink)!important}

/* A6 icons: Phosphor Duotone (outline = text color, fill = brand color) */
.phi{display:inline-block;width:20px;height:20px;flex:none;vertical-align:middle}
.phi .phf{fill:var(--icf,var(--yellow))}
.fact .phi,.fact svg{width:32px!important;height:32px!important;margin-bottom:8px}
.ifield .ficon{width:20px!important;height:20px!important;left:12px!important}
.bform .ifield input,.ifield input{padding-left:42px!important}
.ticks li{padding-left:0!important;display:flex;gap:8px;align-items:flex-start}
.ticks li::before,.ticks li::after{display:none!important;content:none!important}
.ticks .tick{width:20px;height:20px;margin-top:3px}
.qa__ind{-webkit-mask:none!important;mask:none!important;background:none!important;border:0!important;width:32px!important;height:32px!important;display:grid;place-items:center}
.qa__ind::before,.qa__ind::after{display:none!important;content:none!important}
.qa__ind .phi{width:32px;height:32px}
.qa__minus{display:none!important}
.qa[open] .qa__plus{display:none!important}
.qa[open] .qa__minus{display:inline-block!important}
.qa--0 .qa__ind .phi{--icf:var(--pink)!important}
.qa--1 .qa__ind .phi{--icf:var(--blue)!important}
.mobile-nav .mnav-arrow::after{display:none!important;content:none!important}
.mobile-nav .mnav-arrow{display:grid;place-items:center}
.mobile-nav .mnav-arrow .phi{width:24px;height:24px;transition:transform .2s}
.mobile-nav .mnav-arrow[aria-expanded="true"] .phi{transform:rotate(180deg)}
.lbx__close svg,.lbx__nav svg{width:28px!important;height:28px!important}
.lbx__close svg path:first-child,.lbx__nav svg path:first-child{fill:var(--icf,var(--yellow))}
.lbx__close{--icf:var(--pink)}
.lbx__nav{--icf:var(--blue)}
.dpick__nav .phi,.slider-ctrl .phi{width:20px;height:20px}
.foot .social a{background:none!important;width:auto!important;height:auto!important;border-radius:0!important;color:var(--paper)!important}
.foot .social .soc{width:32px!important;height:32px!important}

/* K: Know before you go color */
.kbyg2 .facts{border:2px solid var(--accent)!important}
.kbyg2 .fact__label{color:var(--pink)!important}
.kbyg2 .facts{display:grid;grid-template-columns:repeat(var(--n),minmax(0,1fr));gap:0!important;padding:0!important}
.kbyg2 .fact{position:relative;border:0!important;padding:24px!important}
.kbyg2 .fact + .fact::before{content:"";position:absolute;left:0;top:16px;bottom:16px;border-left:2px dashed var(--accent);transform-origin:top}
.kb-faq .qa{border-color:var(--accent)!important;border-width:0 0 1px!important;border-style:solid!important}
.kb-faq .faq__col{border-top:1px solid var(--accent)!important}
.kb-faq .qa summary{padding-left:12px!important}
.kb-faq .qa .qa__q{color:var(--ink)!important}
.qa--kb .qa__ind .phi{color:var(--pink)!important;--icf:var(--yellow)!important}
.qa--kb .qa__a{padding-left:12px}

/* D1 alternating titles (desktop) + D3 */
@media (min-width:761px){
  section[data-al="r"] .sec-head{margin-left:auto!important;margin-right:0!important;text-align:right;justify-items:end}
  section[data-al="r"] .sec-head > p{margin-left:auto}
  section[data-al="r"] .tours__top{flex-direction:row-reverse}
}
.duo #about-title{color:var(--pink)!important}
.duo #wroute-title{color:var(--green)!important}

/* C texture trial: home "More Too Much Coming Soon" only */
.teaser{position:relative;isolation:isolate}
.teaser::before{content:"";position:absolute;inset:0;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 1 0 0 0 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:180px 180px;opacity:.1;mix-blend-mode:multiply;pointer-events:none;z-index:-1}

/* L perforations: zig-zag (same as the receipt) where color meets white */
.zz-t{--zz:9px;-webkit-mask:conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) top/calc(2*var(--zz)) 100% repeat-x;mask:conic-gradient(from 135deg at top,#0000,#000 1deg 89deg,#0000 90deg) top/calc(2*var(--zz)) 100% repeat-x}
.zz-b{--zz:9px;-webkit-mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/calc(2*var(--zz)) 100% repeat-x;mask:conic-gradient(from -45deg at bottom,#0000,#000 1deg 89deg,#0000 90deg) bottom/calc(2*var(--zz)) 100% repeat-x}
.bbhead.zz-b{margin-bottom:-9px;position:relative;z-index:2}
.bbhead + .thero{position:relative;z-index:1;padding-top:9px}
.do{position:relative}
.do h3{position:relative;padding-top:var(--pad-card);margin-top:8px}
.do h3::before{content:"";position:absolute;top:0;left:calc(-1 * var(--pad-card));right:calc(-1 * var(--pad-card));border-top:2px dashed var(--ink);transform-origin:left}
.card .price::before{transform-origin:left}
.do img{height:120px!important;width:auto;align-self:center}

/* M footer: ticket stub */
.foot{background:var(--ink)!important;color:var(--paper);padding:48px 0 24px!important;margin-top:0}
.foot__in{max-width:1000px;margin-inline:auto;padding-inline:var(--gutter)}
.foot__ticket{display:flex;align-items:center;gap:48px;padding-bottom:32px}
.foot__stub{flex:none;display:grid;place-items:center}
.foot__stub .foot__logo{width:170px;height:auto;display:block}
.foot__perf{align-self:stretch;border-left:1px dashed var(--paper);transform-origin:top}
.foot__cols{display:flex;gap:48px;align-items:flex-start}
.foot__col h3{color:var(--yellow)!important;margin:0 0 16px!important;text-transform:uppercase}
.foot__pills{display:inline-grid;grid-template-columns:1fr 1fr;gap:8px}
.foot__pills .btn{height:44px;min-height:44px;font-size:var(--fs-small)!important;padding:0 16px!important}
.foot__mail{color:var(--paper);font-weight:600;text-underline-offset:3px}
.foot .social{display:flex;gap:16px;margin-top:8px!important}
.foot__bar{border-top:1px solid rgba(255,255,255,.4)!important;padding-top:16px!important;display:flex!important;justify-content:space-between!important;align-items:center;gap:8px 24px;flex-wrap:wrap}
.foot__bar-links{display:flex!important;gap:24px;align-items:center}
.foot__bar a{color:var(--paper)!important}
@media (max-width:760px){
  .foot{padding:40px 0 16px!important}
  .foot__ticket{flex-direction:column;gap:24px;padding-bottom:24px}
  .foot__perf{align-self:stretch;border-left:0;border-top:1px dashed var(--paper);width:100%;transform-origin:left}
  .foot__stub .foot__logo{width:150px}
  .foot__cols{flex-direction:column;align-items:center;gap:24px;text-align:center}
  .foot__col h3{margin-bottom:8px!important}
  .foot__col:last-child{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px 16px}
  .foot__col:last-child h3{flex-basis:100%}
  .foot__col:last-child .social{margin-top:0!important}
  .foot__bar{flex-direction:column;justify-content:center!important;text-align:center}
}

/* I2 shop hero: title halfway up, outline button */
.shero__txt{top:50%;bottom:auto!important;transform:translateY(-50%);padding-bottom:0!important;display:grid;justify-items:start;gap:24px;z-index:1}
.shero__shade{background:linear-gradient(to right,rgba(0,0,0,.55),rgba(0,0,0,.15) 50%,rgba(0,0,0,0) 70%)!important}
/* I8 mobile How It Works centered; I9 mobile card tags */
/* Update 29 Fix 2: the mobile Walking Tour tags are now the standard on every screen size (one centred row, never stacked) */
.card .price small{display:none}
.card__tags{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:8px}
.ctag{border:2px solid currentColor;border-radius:999px;padding:2px 12px;font-weight:700;line-height:1.5;white-space:nowrap}
.card__pp{flex-basis:100%;font-size:var(--fs-small);margin-top:-4px}
.card__tags{column-gap:var(--tg,8px)}
.card__tags .ctag{font-size:var(--tf,var(--fs-small))!important;padding:2px var(--tp,12px)}   /* site.js shrinks padding, then text, only when a row would not fit */
.card--c-blue .ctag{color:var(--blue)}
.card--c-pink .ctag{color:var(--pink)}
.card--c-green .ctag{color:var(--green)}
@media (max-width:760px){
  .steps li{text-align:center;justify-items:center;display:grid}
  .steps .step-n{margin-inline:auto}
  section[data-al] .sec-head{text-align:center}
}
/* E 404 */
.lost__wrap{display:flex;align-items:center;gap:48px;flex-wrap:wrap}
.lost__wrap .sticker{width:240px;height:auto}
.lost__txt{display:grid;gap:24px;max-width:640px}
@media (max-width:760px){.lost__wrap{flex-direction:column;text-align:center}.lost__wrap .sticker{width:180px}.lost__txt{justify-items:center}}

/* F1 calendar: pop-up under the field (hover on desktop, tap on mobile) */
.dpick--inline{display:block}
.dpick__d{background:var(--paper)!important;border:2px solid var(--pink)!important}
.dpick__d:hover:not(:disabled),.dpick__d[aria-pressed="true"]{background:var(--pink)!important;color:var(--paper)!important}
.dpick__d:disabled{border-color:transparent!important;color:rgba(0,0,0,.3)!important;background:none!important}
.dpick__dow{color:var(--ink)!important}
.dpick__nav:hover:not(:disabled){background:var(--field)!important;color:var(--ink)!important;border-color:var(--ink)!important}
.bform .stepper button:hover,.bform .stepper button:active,.bform .chip:hover > span,.bform .pill:hover > span{background:var(--field)!important}
.dpick__pop{box-shadow:var(--shadow)!important;border:2px solid var(--ink)!important}

/* F2-F4 success panel, stamp, errors */
.book__grid > .ok{text-align:center;display:grid;justify-items:center;gap:16px;align-content:start}
.ok[hidden]{display:none!important}
.ok__raimundo{width:120px;height:auto}
.ok:not([hidden]) .ok__raimundo{animation:okpop .6s cubic-bezier(.34,1.56,.64,1) both}
@keyframes okpop{0%{transform:scale(.3) rotate(-12deg);opacity:0}100%{transform:none;opacity:1}}
.ok__label{color:var(--pink)}
.ok__next{list-style:none;margin:0;padding:0;display:grid;gap:12px;text-align:left;max-width:440px}
.ok__next li{display:flex;gap:12px;align-items:flex-start}
.ok__n{flex:none;width:28px;height:28px;border-radius:50%;background:var(--pink);color:var(--paper);display:grid;place-items:center;font:400 14px var(--f-display)}
.ok__btns{display:flex;gap:24px;align-items:center;flex-wrap:wrap;justify-content:center;margin-top:8px}
.ok__bg{margin:8px 0 0}
.summary{position:relative}
.stamp{position:absolute;right:16px;top:44%;transform:rotate(-12deg);border:3px solid var(--pink);color:var(--pink);font:400 26px var(--f-display);text-transform:uppercase;letter-spacing:.04em;padding:4px 14px;border-radius:8px;opacity:0;pointer-events:none;background:var(--paper);white-space:nowrap}
.summary.stamped .stamp{animation:stampin .45s cubic-bezier(.2,1.4,.5,1) forwards}
@keyframes stampin{0%{opacity:0;transform:rotate(-12deg) scale(2.2)}100%{opacity:1;transform:rotate(-12deg) scale(1)}}
.form__err{color:var(--pink);font-weight:700;font-size:var(--fs-small);margin:0}
.form__err a{color:var(--pink)}
.ferr{display:block;color:var(--pink);font-weight:700;font-size:var(--fs-small);margin-top:4px}
.bform .is-bad input,.bform input.is-bad,.bform .is-bad .dpick__input{box-shadow:0 0 0 2px var(--pink)!important}
.review-links{margin:8px 0 0;text-align:center}

/* I4 carousel: horizontal gestures stay with the carousel, vertical scroll stays with the page */
.hcar{touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none}
.hcar.is-drag{cursor:grabbing}
.hcar img{-webkit-user-drag:none;user-drag:none}

/* J3 parallax: full-width photos move slower than the page */
.px-box{overflow:hidden}
.px{will-change:transform;transform:translate3d(0,var(--py,0px),0) scale(1.14)}
.fullbleed{position:relative;overflow:hidden}

/* J motion system: one style everywhere; classes set by site.js; nothing with reduce motion */
.mo-pre main,.mo-pre .foot{opacity:0;animation:mofb .01s 2.5s forwards}
@keyframes mofb{to{opacity:1}}
.mo .site-head,.mo .topbar{animation:headin .6s cubic-bezier(.22,1,.36,1) both}
@keyframes headin{from{opacity:0;transform:translateY(-16px)}to{opacity:1;transform:none}}
.mo .mv{transition:opacity .6s cubic-bezier(.22,1,.36,1) var(--d,0s),translate .6s cubic-bezier(.22,1,.36,1) var(--d,0s),scale .6s cubic-bezier(.22,1,.36,1) var(--d,0s),rotate .6s cubic-bezier(.22,1,.36,1) var(--d,0s),transform .2s ease 0s,box-shadow .2s ease 0s}
.mo .mv:not(.in){opacity:0}
.mo .mv[data-mv="up"]:not(.in){translate:0 48px}
.mo .mv[data-mv="hl"]:not(.in){translate:-40px 24px}
.mo .mv[data-mv="hr"]:not(.in){translate:40px 24px}
.mo .mv[data-mv="ph"]:not(.in){scale:.92}
.mo .mv[data-mv="pop"]{transition-timing-function:cubic-bezier(.34,1.56,.64,1)}
.mo .mv[data-mv="pop"]:not(.in){scale:.6}
.mo .mv[data-mv="st"]{transition-timing-function:cubic-bezier(.34,1.56,.64,1);transform-box:fill-box;transform-origin:center}
.mo .mv[data-mv="st"]:not(.in){scale:.6;rotate:-14deg}
.mo .mv[data-mv="ln"]:not(.in){scale:1 0}
@media (max-width:760px){.mo .mv[data-mv="ln"]:not(.in){scale:0 1}}
.mo .mv.out-up:not(.in),.mo .mv.out-down:not(.in){transition-duration:.4s;transition-delay:0s;scale:1;rotate:0deg}
.mo .mv.out-up:not(.in){translate:0 -20px}
.mo .mv.out-down:not(.in){translate:0 20px}
/* divider and perforation lines draw in left to right with their block */
.mo .card.mv .price::before,.mo .do.mv h3::before{scale:0 1;transition:scale .6s cubic-bezier(.22,1,.36,1) calc(var(--d,0s) + .3s)}
.mo .card.mv.in .price::before,.mo .do.mv.in h3::before{scale:1 1}
.mo .fact.mv::before{scale:1 0;transition:scale .6s cubic-bezier(.22,1,.36,1) calc(var(--d,0s) + .2s)}
.mo .fact.mv.in::before{scale:1 1}
.foot__cols{border:0!important;padding:0!important;grid-template-columns:none}
.fullbleed__box{width:85%;margin:0 auto;overflow:hidden;line-height:0}
.fullbleed__box .fullbleed__img{width:100%!important;margin:0!important}
@media (max-width:760px){
  .kbyg2 .facts{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .kbyg2 .fact{padding:16px!important}
  .kbyg2 .fact + .fact::before{display:none}
  .kbyg2 .fact:nth-child(2n)::before{display:block;content:"";position:absolute;left:0;top:16px;bottom:16px;border-left:2px dashed var(--accent)}
  .kbyg2 .fact:nth-child(n+3)::after{content:"";position:absolute;top:0;left:16px;right:16px;border-top:2px dashed var(--accent)}
}
@media (max-width:760px){.do h3{align-self:stretch}}
.bform[hidden]{display:none!important}
.stepper input,.bform .stepper input{background:transparent!important;border-radius:0!important;box-shadow:none!important}

/* ================= Update 21 ================= */
/* 3 header nav in caps (CSS only), slight tracking */
.nav a,.nav .dd__trigger,.dd__menu a,.mobile-nav > a,.mobile-nav .mnav-row > a,.mobile-nav .sub a{text-transform:uppercase;letter-spacing:.03em}
.dd__menu a,.mobile-nav .sub a{font-family:var(--f-display);font-weight:400}
/* 4 hero carousel: one title per slide, crossfades with its photo; buttons stay put */
.hcar__shade{display:none}
.hcar__s::after{content:"";position:absolute;inset:auto 0 0 0;height:70%;background:linear-gradient(to top,rgba(0,0,0,.6),rgba(0,0,0,.25) 55%,rgba(0,0,0,0));pointer-events:none}
.hcar__t{position:absolute;left:0;right:0;z-index:1;margin:0;padding:0 var(--gutter);text-align:center;color:#fff;font:400 var(--fs-hero)/1.05 var(--f-display);text-transform:uppercase;letter-spacing:.02em;bottom:calc(clamp(46px,7vw,84px) + var(--btn-h) + 24px);max-width:none}
/* 6 Open in Google Maps: primary button */
.map__pair > .map__btn{justify-self:center!important}
/* 7 footer: always static */
.mo-pre .foot{opacity:1!important;animation:none!important}
/* 8 booking: lighter form panel, solid fields */
.bform,.page--sub .bform{background:rgba(255,255,255,.25)!important}
.bform .stepper{background:var(--field)!important}
.bform .pill > span{background:var(--paper)}
/* 9 footer concept pills */
.foot__pills .btn--white,.btn--white:hover{background:var(--paper)!important;border-color:var(--paper)!important;color:var(--ink)!important}
.foot__pills .btn--pink{background:var(--pink)!important;border-color:var(--pink)!important;color:var(--paper)!important}
/* 10 Know before you go: pink lines and plain pink plus icons */
.kbyg2{--accent:var(--pink)}
.qa__ind--bare{width:28px!important;height:28px!important}
.qa__ind--bare .phi{width:22px!important;height:22px!important;color:var(--pink)!important;--icf:transparent!important}
.kb-faq .qa{border-color:var(--pink)!important}
.kb-faq .faq__col{border-top-color:var(--pink)!important}
/* 11 heroes: straight edges */
.bbhead{margin-bottom:0!important}
.bbhead + .thero{padding-top:0!important}
/* 12 baseball header lines bigger */
.bbhead .bbhead__sub{font-size:48px!important;line-height:1.05}
@media (max-width:760px){.bbhead .bbhead__sub{font-size:28px!important}}
/* 15 shop hero: back to the bottom-left, 15% up; accent button */
.shero__txt{top:auto!important;bottom:15%!important;transform:none!important}
.shero__shade{background:linear-gradient(to top right,rgba(0,0,0,.6),rgba(0,0,0,.2) 40%,rgba(0,0,0,0) 65%)!important}
/* 16 FAQ: pre-Update-19 icons (Phosphor Light, black; open in the row color) */
.qa__ind--faq .phi{--icf:transparent!important;color:var(--ink)}
.qa--0[open] .qa__ind--faq .phi{color:var(--pink)}
.qa--1[open] .qa__ind--faq .phi{color:var(--blue)}
/* 2 TEMPORARY design preview */
.pv-flag{display:inline-block;background:var(--pink);color:var(--paper);font-weight:700;font-size:var(--fs-label);letter-spacing:.08em;text-transform:uppercase;padding:4px 12px;border-radius:999px;margin:0 0 24px}
.preview-page h1{margin-bottom:16px}
.pv-grid{display:flex;flex-wrap:wrap;gap:16px;margin-top:32px}
.foot__preview{border:1px dashed currentColor;border-radius:999px;padding:0 10px;text-decoration:none!important}
.pv-back{position:fixed;left:16px;bottom:16px;z-index:9000;background:var(--ink);color:var(--paper)!important;font-weight:700;font-size:var(--fs-small);padding:8px 16px;border-radius:999px;text-decoration:none;box-shadow:var(--shadow)}

/* ================= Update 22 ================= */
/* 2 footer: never a zig-zag edge */
.foot{-webkit-mask:none!important;mask:none!important}
/* 3 drop-downs: FAQ plus / minus everywhere; open lists in a white box with a pink outline */
.qa--kb .qa__ind--faq .phi,.qa--kb[open] .qa__ind--faq .phi{color:var(--pink)!important;--icf:transparent!important}
.qa__ind--faq .phi{width:32px!important;height:32px!important}
.qa[open] .qa__a--list{background:var(--paper);border:2px solid var(--pink);border-radius:var(--r-card);padding:16px 24px!important;margin:0 12px 16px}
.qa[open] .qa__ind,.qa--kb[open] .qa__ind{background:none!important;border:0!important}
/* 4 form panel: white at 75% */
.bform,.page--sub .bform{background:rgba(255,255,255,.75)!important}
/* 5-7 hero carousel: arrows, a bit higher overall, slide 1 cropped from the top only */
html,body{overscroll-behavior-x:none}
.hcar .hero__ctas{bottom:calc(clamp(46px,7vw,84px) + 28px)!important}
.hcar__dots{bottom:calc(clamp(14px,2.2vw,24px) + 28px)!important}
.hcar__t{bottom:calc(clamp(46px,7vw,84px) + 28px + var(--btn-h) + 24px)!important}
.hcar__s:first-child .hcar__img{object-position:50% 62%}   /* Update 25 Fix 1: focus moved up (was 50% 100%) */
.hcar__nav{position:absolute;top:50%;transform:translateY(-50%);z-index:3;width:48px;height:48px;border:0;background:none;padding:0;display:grid;place-items:center;cursor:pointer;filter:drop-shadow(0 2px 6px rgba(0,0,0,.55))}
.hcar__prev{left:clamp(8px,2vw,24px)}
.hcar__next{right:clamp(8px,2vw,24px)}
.hcar__nav .phi{width:40px;height:40px}
.hcar{cursor:pointer}
/* 8 tour pages: half the space between sections */
main[data-page="walking-tour.html"] .sec,main[data-page="baseball.html"] .sec{padding-block:calc(var(--sp-sec) / 2)!important}
/* 9 gallery titles */
main[data-page="walking-tour.html"] #gal-title{color:var(--blue)!important}
main[data-page="baseball.html"] #gal-title{color:var(--pink)!important}
/* 10 Quick Facts box and its dashed lines black; drop-down dividers stay pink */
.kbyg2{--accent:var(--ink)}
.kbyg2 .facts{border-color:var(--ink)!important}
/* 11 The Route title black */
.duo #wroute-title{color:var(--ink)!important}
/* 14 baseball Get on the list on dark green, white headers */
.book--green,.page--sub .book--green{background:var(--green)!important;color:var(--paper)}
.book--green .sec-head h2,.book--green .sec-head p,.book--green #book-title{color:var(--paper)!important}
/* 15 shop hero: Visit us left-aligned under the title with a small indent (Update 24 Fix 4), pink at 75% (Update 23 Fix 4) */
.shero__txt{justify-items:start!important;width:max-content;max-width:calc(100% - 2 * var(--gutter))}
.shero .btn--pink,.shero .btn--pink:hover{background:rgba(222,16,129,.75)!important;border-color:rgba(222,16,129,.75)!important;color:var(--paper)!important}
/* 16 The Shop title pink */
#sg-title{color:var(--pink)!important}

/* ================= Update 23 ================= */
/* Home copy: sign-off next to Raimundo, Our Tours subheading + closing line, Why 2x2 */
.raimundo .raimundo__sign{margin:0;font-family:var(--f-display);font-weight:400;font-size:var(--fs-h3);line-height:1.25;color:var(--green)}
.sec-head .sec-sub{font-weight:700!important;margin-bottom:-.4em}
.tours__close{margin:var(--gap) 0 0;text-align:center;font-weight:600;font-size:var(--fs-small)}
.why__grid--2x2{grid-template-columns:repeat(2,minmax(0,1fr))!important;row-gap:calc(var(--gap) * 1.5)!important}
@media (max-width:760px){.why__grid--2x2{grid-template-columns:1fr!important}}
/* Baseball header tagline, route note, step titles in caps */
.thero__tag{margin:0;font-family:var(--f-display);font-size:var(--fs-h3);line-height:1.15;text-transform:uppercase;letter-spacing:.03em}
.sec-head .sec-note{font-size:var(--fs-small)!important;font-weight:600!important}
.tl strong{text-transform:uppercase;letter-spacing:.04em}


/* Fix 5: About Us page */
.astory__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,5vw,64px);align-items:center}
@media (max-width:820px){.astory__grid{grid-template-columns:minmax(0,1fr)}}
.astory__img .photo{aspect-ratio:4/3;width:100%}
.family{background:var(--yellow);color:var(--ink)}
.page--sub .family h2{color:var(--green)!important}
.fam-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--gap)}
@media (max-width:820px){.fam-grid{grid-template-columns:minmax(0,1fr)}}
.fam{background:var(--paper);border:var(--bw) solid var(--ink);border-top-width:10px;border-radius:var(--r-card);padding:var(--pad-card);display:grid;gap:12px;align-content:start}
.fam--tmt{border-top-color:var(--blue)} .fam--bg{border-top-color:var(--green)} .fam--ff{border-top-color:var(--pink)}
.fam h3{margin:0;color:var(--ink)!important}
.fam p{margin:0}
.fam .link{justify-self:start;font-weight:700;color:var(--ink)}
@media (max-width:760px){.astory .sec-head h2{font-size:clamp(22px,6.6vw,32px)!important}}
.aclose__in{display:grid;justify-items:center;text-align:center;gap:24px}
.aclose .lead{margin:0}
@media (max-width:760px){.fam{text-align:center}.fam .link{justify-self:center}}

/* ================= Update 24 ================= */
/* Fix 3: booking form back to its pre-Update-23 look; panel white, receipt light gray */
.bform,.page--sub .bform{background:#FFFFFF!important}
.summary,.page--sub .summary,.book--yellow .summary{background:#F6F7F7!important}   /* Update 25 Fix 3: neutral light gray */
/* Fix 4: Visit us indented from the title's left edge */
.shero__txt .btn--pink{margin-left:24px}
@media (max-width:760px){.shero__txt .btn--pink{margin-left:16px}}

/* Fix 1: no title past two lines. Widen the box first; step the size down one level only where widening can't do it */
@media (min-width:901px){
  .about__body > #about-title{width:calc(200% / 1.3 + clamp(24px,5vw,64px));max-width:none}
  .about .raimundo{align-self:end}
}
@media (min-width:761px) and (max-width:900px){.about__body > #about-title{font-size:var(--fs-h3)!important}}
@media (max-width:760px){.about__body > #about-title{font-size:var(--fs-h3)!important}}
.lost__txt{max-width:calc(100% - 288px)}
@media (max-width:760px){.lost__txt{max-width:none}.lost h1{font-size:var(--fs-h2)!important}}
@media (min-width:761px) and (max-width:1160px){.lost h1{font-size:var(--fs-h2)!important}}
@media (min-width:761px) and (max-width:900px){.lost__txt{max-width:none;flex:1 1 100%}}
@media (max-width:420px){.lost__txt{margin-inline:-16px;width:calc(100% + 32px)}}
@media (min-width:821px) and (max-width:1099px){main[data-page="walking-tour.html"] .thero h1{font-size:var(--fs-h2)!important}}

/* ================= Update 25 ================= */
/* Fix 2: brand-kit pattern elements, static, desktop only (Update 26: only the Find Us rainbow stays) */
.deco{display:none}
.deco-host{position:relative}
.deco{position:absolute;z-index:0;pointer-events:none;user-select:none;height:auto}
@media (min-width:1000px){.deco--map{display:block;right:var(--gutter);top:4px;width:72px}}

/* ================= Update 26 ================= */
/* Fix 1 (Update 27 Fix 5): small arrow from the form title toward the fields (desktop only; drawn by site.js) */
.bform{position:relative}
.barrow{position:absolute;left:0;top:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:2;color:var(--pink)}
@media (max-width:900px){.barrow{display:none!important}}
.barrow__line,.barrow__head{fill:none;stroke:currentColor;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round}
.barrow__line{stroke-dasharray:1 1}
.barrow__hit{fill:none;stroke:transparent;stroke-width:14;pointer-events:stroke;cursor:pointer}
.barrow--anim .barrow__line{stroke-dashoffset:1;transition:stroke-dashoffset .8s cubic-bezier(.22,1,.36,1)}
.barrow--anim .barrow__head{opacity:0;transition:opacity .2s ease 0s}
.barrow--anim.in .barrow__line{stroke-dashoffset:0}
.barrow--anim.in .barrow__head{opacity:1;transition-delay:.7s}
.barrow--anim.in .barrow__g{animation:barrowNudge 4s cubic-bezier(.22,1,.36,1) 1.4s infinite}
@keyframes barrowNudge{0%,86%,100%{translate:0 0}91%{translate:var(--nx,0) var(--ny,4px)}95%{translate:0 0}}
.barrow.poke{animation:barrowPoke .45s cubic-bezier(.22,1,.36,1)}
@keyframes barrowPoke{0%,100%{translate:0 0}45%{translate:var(--nx,0) var(--ny,5px)}}
@media (prefers-reduced-motion:reduce){.barrow,.barrow__g{animation:none!important}}
/* Fix 2: single brand icons on a few title rows, desktop only */
.ticon{display:none}
@media (min-width:1001px){
  .ticon-host{position:relative}
  .ticon{display:block;position:absolute;right:var(--gutter);z-index:0;pointer-events:none;user-select:none;width:auto}
  .ticon--why,.ticon--bbabout,.ticon--walkkb{height:34px;top:calc((var(--fs-h2) * 1.1 - 34px) / 2)}
  .ticon--faq{height:38px;top:calc((var(--fs-hero) * 1.05 - 38px) / 2)}
}
/* Fix 2 step 3: About header on the brand pattern (page 13); only the big white title sits on it */
.thero--pattern{background:#000 url("../img/pattern-p13.svg") center/cover no-repeat!important}
.thero--pattern h1{color:var(--paper)!important}
.thero--pattern .hbox{background:var(--paper);border-radius:var(--r-card);padding:20px 24px;margin-top:16px;max-width:560px}
.thero--pattern .hbox p{color:var(--ink)!important;margin:0}
/* Fix 8: Filthy Friday card (third, green accent), three across on desktop, stacked on mobile */
.card--c-green{border:2px solid var(--green)}
.card--c-green h3,.card--c-green h3 a{color:var(--green)!important}
.card--c-green .photo{border-bottom-color:var(--green)}
.ext-ico{width:16px;height:16px;margin-left:6px;vertical-align:-2px}
.slider--3{grid-auto-columns:minmax(0,1fr);overflow:visible;scroll-snap-type:none}
.slider-ctrl--3{display:none!important}
@media (max-width:900px){.slider--3{grid-auto-flow:row;grid-template-rows:none;grid-template-columns:minmax(0,1fr);grid-auto-columns:auto;row-gap:24px}}

/* ================= Update 27 ================= */
/* Fix 1: Terms & Conditions page */
.terms__body{max-width:760px}
.terms__title{font-size:var(--fs-h3)!important;line-height:1.2!important;margin:0 0 16px;color:var(--ink)!important}
.terms__sec{margin-top:20px}
.terms__body p{margin:0 0 10px}
.terms__body ul{margin:0 0 10px;padding-left:1.4em;display:grid;gap:6px}
.terms__body ul li{list-style:disc}
/* Fix 2: Filthy Friday card dashed line in its green */
.card--c-green .price::before{border-color:var(--green);opacity:1}
/* Fix 7: brand icons in the side margins, 1600 px and up only */
.micon{display:none}
@media (min-width:1600px){
  .micon-host{position:relative}
  .micon-host > img.micon{display:block;position:absolute;z-index:0;height:40px!important;width:auto!important;max-width:none!important;margin:0!important;transform:translate(-50%,-50%)!important;animation:none!important;pointer-events:none;user-select:none}
  .micon-host > .micon--l{left:calc((100% - var(--maxw)) / 4)}
  .micon-host > .micon--r{left:calc(100% - (100% - var(--maxw)) / 4)}
}
/* Fix 8: Instagram, six square posts in one row (3 x 2 on mobile) */
.igsec[hidden]{display:none!important}
.ig-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:var(--gap)}
@media (max-width:760px){.ig-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}}
.ig-tile{position:relative;display:block;aspect-ratio:1/1;overflow:hidden;border-radius:var(--r-photo)}
.ig-tile img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s cubic-bezier(.22,1,.36,1)}
.ig-tile:hover img,.ig-tile:focus-visible img{transform:scale(1.06)}
.ig-tile--ph{display:grid;place-items:center}
.ig-tile--ph .ig-ph{width:36px;height:36px;transition:transform .5s cubic-bezier(.22,1,.36,1)}
.ig-tile--ph:hover .ig-ph{transform:scale(1.15)}
.ig-play-wrap{position:absolute;right:8px;top:8px;display:grid;place-items:center;filter:drop-shadow(0 1px 3px rgba(0,0,0,.5))}
.ig-play-wrap .ig-play{width:22px;height:22px}
.ig-cta{display:flex;justify-content:center;margin-top:var(--sp-head)}
.ig-cta .btn .phi{width:18px;height:18px;margin-left:8px}

/* Update 31 Fix 2: mobile hero titles always on two lines ("Too Much" / name), one size for all four, clear of the arrows (desktop unchanged) */
@media (min-width:761px){.hcar__br{display:none}}
@media (max-width:760px){.hcar__t{font-size:min(var(--fs-hero), calc((100vw - 128px) / 5.2))!important}}
/* Update 31 Fix 3: mobile card prices about 22% bigger, same row height so nothing below moves */
@media (max-width:760px){.card .price strong{font-size:calc(var(--fs-h3) * 1.225)!important;line-height:calc(var(--fs-h3) * 1.15)}}
/* Update 33 Fix 1: banner in the body font, link in black */
.topbar{font-family:var(--f-body)}
.topbar a{color:var(--ink)}
/* Update 33 Fix 6: About closing line sits closer to Meet the family and to what follows */
.sec.aclose{padding-block:calc(var(--sp-sec) / 2)!important}
/* Update 33 Fix 9: FAQ, the Bocas Getaways line follows the last question at a normal distance */
main[data-page="faq.html"] > .sec:last-of-type{padding-bottom:calc(var(--sp-sec) / 4)!important}
/* Update 33 Fix 7: extra brand icons. Title-row ones are desktop only (.ticon rules); the Get on the list Sunset shows on every screen */
@media (min-width:1001px){.ticon--t2{height:34px;top:calc((var(--fs-h2) * 1.1 - 34px) / 2)}}
.glist-host{position:relative}
.glist-sun{position:absolute;z-index:2;pointer-events:none;user-select:none;height:auto;width:76px;top:56px;right:calc(max(var(--gutter), (100% - var(--maxw)) / 2) + 40px)}   /* Update 34 Fix 2: in from the edge, down from the top */
@media (max-width:760px){.glist-sun{display:none}main[data-page="baseball.html"] #book-title::after{content:"";display:inline-block;height:.9em;width:1.5em;margin-left:.3em;vertical-align:-.05em;background:url("../img/deco/sunset.svg") no-repeat center/contain}}   /* Update 36 Fix 10: on mobile the rainbow sits inline after the title */
/* Update 33 Fix 11: Instagram as a blog-style row. 3:4 previews, square corners, no gaps; date and caption snippet under each */
.ig-top{position:relative}
.ig-top .sec-head{display:grid;justify-items:start;gap:6px}
.ig-handle{font-weight:700}
.igarrow{position:absolute;left:0;top:0;width:100%;height:100%}
.ig-row{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:0}
.ig-post{display:block;min-width:0;color:var(--ink);text-decoration:none}
.ig-post__img{position:relative;display:block;aspect-ratio:3/4;overflow:hidden;border-radius:0;background:var(--field)}
.ig-post__img img{display:block;width:100%;height:100%;object-fit:cover}
.ig-post__meta{display:block;padding:8px 10px 0 0;text-align:left;font-family:var(--f-body);font-size:var(--fs-small);line-height:1.4}
.ig-post__date{display:block;font-weight:700}
.ig-post__cap{display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
@media (max-width:760px){
  .ig-row{display:flex;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;margin-right:calc(-1 * var(--gutter))}
  .ig-row::-webkit-scrollbar{display:none}
  .ig-post{flex:0 0 calc((100vw - var(--gutter)) / 2.5);scroll-snap-align:start}
  .igsec .sec-head{text-align:left}
}
/* Update 33 Fix 12: Home gallery, half the corner radius and half the gaps (the layout script grows the photos to fill) */
main[data-page="index.html"] .mz,main[data-page="index.html"] .mz__rows,main[data-page="index.html"] .mz__row{gap:calc(var(--gap) / 2)!important}
main[data-page="index.html"] .mz__t{border-radius:calc(var(--r-photo) / 2)!important}
body:has(main[data-page="index.html"]) .lbx__img{border-radius:calc(var(--r-photo) / 2)!important}
/* Update 37 Fix 3: Baseball and Walking Tour galleries get the Home gallery gaps and corner radius */
main:is([data-page="baseball.html"],[data-page="walking-tour.html"]) .mz,main:is([data-page="baseball.html"],[data-page="walking-tour.html"]) .mz__rows,main:is([data-page="baseball.html"],[data-page="walking-tour.html"]) .mz__row{gap:calc(var(--gap) / 2)!important}
main:is([data-page="baseball.html"],[data-page="walking-tour.html"]) .mz__t{border-radius:calc(var(--r-photo) / 2)!important}
body:has(main:is([data-page="baseball.html"],[data-page="walking-tour.html"])) .lbx__img{border-radius:calc(var(--r-photo) / 2)!important}
/* Update 33 Fix 8: Baseball, Adults and Children side by side; stacked only on very narrow phones */
@media (max-width:600px){.bform .grid2.grid2--ac{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:359px){.bform .grid2.grid2--ac{grid-template-columns:1fr}}
.ig-post__img.bg-blue{background:var(--blue)}.ig-post__img.bg-pink{background:var(--pink)}.ig-post__img.bg-green{background:var(--green)}.ig-post__img.bg-yellow{background:var(--yellow)}   /* sample posts in ?preview=ig */
/* Update 34 Fix 1: banner one weight step up (400 to 500) */
.topbar,.topbar a{font-weight:700!important}   /* Update 35 Fix 2: bold (Quicksand 700 is loaded) */
/* Update 34 Fix 3: Shop and About hero titles shifted right by the same amount */
.shero__txt{left:clamp(12px,2vw,28px)!important;max-width:calc(100% - 2 * var(--gutter) - clamp(12px,2vw,28px))!important}
.shero[aria-labelledby="shop-h1"] .shero__txt{left:clamp(18px,5vw,84px)!important;max-width:calc(100% - var(--gutter) - clamp(18px,5vw,84px))!important}   /* Update 35 Fix 3: Shop title further right */
.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
/* Update 35 Fix 5: About side photo in portrait, top aligned with the first paragraph, about the same height as the text */
@media (min-width:821px){
  .astory__grid{grid-template-rows:auto auto;align-items:start;row-gap:0}
  .astory__grid > div:not(.astory__img){display:contents}
  .astory__grid .sec-head{grid-column:1;grid-row:1}
  .astory__grid .prose{grid-column:1;grid-row:2}
  .astory__img{grid-column:2;grid-row:2}
}
.astory__img .photo{aspect-ratio:1458/1863!important}   /* Update 36 Fix 7: tighter crop */
@media (min-width:1100px){
  .astory__img{align-self:stretch;display:flex}
  .astory__img .photo{aspect-ratio:auto!important;flex:1;min-height:100%}
  .astory__img .photo img{height:100%;object-fit:cover}
}
/* Update 36 Fix 8: banner. Desktop unchanged (one copy); mobile keeps one line and scrolls slowly */
.topbar__track{display:block}
.topbar__msg--dup{display:none}
@media (max-width:760px){
  .topbar{overflow:hidden;white-space:nowrap;padding-inline:0;font-size:.8rem;padding-block:.4em;line-height:1.3}   /* Update 37 Fix 8: smaller text, slimmer bar */
  .topbar__track{display:inline-flex;width:max-content;animation:tbScroll 18.5s linear infinite}   /* text is 16% shorter, so the same speed on screen */
  .topbar__msg{padding-right:3em}
  .topbar__msg--dup{display:inline}
  .topbar:hover .topbar__track,.topbar:active .topbar__track{animation-play-state:paused}
}
@keyframes tbScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (max-width:760px) and (prefers-reduced-motion:reduce){.topbar{white-space:normal;padding-inline:16px}.topbar__track{animation:none;display:block;width:auto}.topbar__msg{padding-right:0}.topbar__msg--dup{display:none}}
/* Update 36 Fix 11: Shop hero title on mobile back to the page margin, a little higher */
@media (max-width:760px){.shero[aria-labelledby="shop-h1"] .shero__txt{left:0!important;max-width:calc(100% - 2 * var(--gutter))!important;bottom:22%!important}}
/* Update 36 Fix 2: Work with us pop-up */
.wwu{position:fixed;inset:0;z-index:300;display:grid;place-items:center;padding:24px}
.wwu[hidden]{display:none}
.wwu__back{position:absolute;inset:0;background:rgba(0,0,0,.55);opacity:0;transition:opacity .3s ease}
.wwu__card{position:relative;width:min(440px,100%);background:var(--paper);color:var(--ink);text-align:center;padding:48px 32px 40px;--zz:9px;opacity:0;transform:scale(.9);transition:opacity .3s ease,transform .35s cubic-bezier(.22,1,.36,1)}
.wwu.is-open .wwu__back{opacity:1}
.wwu.is-open .wwu__card{opacity:1;transform:scale(1)}
.wwu__rai{display:block;width:96px;height:auto;margin:0 auto 12px;opacity:0;transform:translateY(10px) scale(.7)}
.wwu.is-open .wwu__rai{animation:wwuPop .55s cubic-bezier(.34,1.56,.64,1) .2s forwards}
@keyframes wwuPop{0%{opacity:0;transform:translateY(10px) scale(.7)}60%{opacity:1;transform:translateY(-4px) scale(1.06) rotate(-6deg)}80%{transform:translateY(0) scale(.98) rotate(4deg)}100%{opacity:1;transform:none}}
.wwu__card h2{margin:0 0 10px;color:var(--pink)}
.wwu__card p{margin:0 0 22px}
.wwu__mail{display:flex;gap:10px;justify-content:center;align-items:center;flex-wrap:wrap}
.wwu__email{font-family:var(--f-body)!important;font-weight:700;text-transform:none;letter-spacing:0;min-height:48px}
.wwu__cp{gap:6px;min-height:48px;padding-inline:1.1em!important;font-size:.9rem!important}
.wwu__cp-ic{width:18px;height:18px}
.wwu__x{position:absolute;top:14px;right:14px;width:44px;height:44px;border:0;background:none;padding:0;display:grid;place-items:center;cursor:pointer;border-radius:50%}
.wwu__x .phi{width:22px;height:22px}
.wwu__x:hover{background:var(--field)}
html.wwu-lock,html.wwu-lock body{overflow:hidden}
@media (max-width:760px){.wwu{place-items:end center;padding:0}.wwu__card{width:100%;padding:44px 24px calc(32px + env(safe-area-inset-bottom));transform:translateY(40px)}.wwu.is-open .wwu__card{transform:none}}
@media (prefers-reduced-motion:reduce){.wwu__back,.wwu__card{transition:none}.wwu__card{transform:none}.wwu__rai{opacity:1;transform:none}.wwu.is-open .wwu__rai{animation:none}}
/* 1 HEADER LOCK (Update 22): logo centered, links grouped around it, EN/ES + Book Now pinned to the far right
   with at least 48 px before them. Keep this block LAST in the file so later rules can't pull the tools back in. */
@media (min-width:1201px){
  html body .site-head .head,html body .site-head .head.wrap{max-width:none!important;padding-inline:var(--gutter)!important}
  html body .site-head .head{grid-template-columns:minmax(0,1fr) auto minmax(0,1fr)!important;column-gap:clamp(24px,2.6vw,44px)!important}
  html body .site-head .nav{gap:clamp(24px,2.6vw,44px)!important;letter-spacing:.05em!important}
  html body .site-head .nav a,html body .site-head .nav .dd__trigger{letter-spacing:.05em!important}
  html body .site-head .nav--l{padding-left:0!important;justify-content:flex-end!important}
  html body .site-head .right{display:flex!important;justify-content:space-between!important;gap:48px!important;min-width:0}
  html body .site-head .right .nav--r{flex:0 1 auto!important;justify-content:flex-start!important}
  html body .site-head .head-tools{width:auto!important;margin-left:auto!important;flex:none!important}
}
/* Update 37 Fixes 9 + 11: Baseball and Walking Tour top section on phones, left-aligned to the photo's edges, one compact group */
@media (max-width:760px){
  main:is([data-page="baseball.html"],[data-page="walking-tour.html"]) .thero .wrap > div:first-child{text-align:left}
  main:is([data-page="baseball.html"],[data-page="walking-tour.html"]) .thero .hchips{justify-content:flex-start}
  main:is([data-page="baseball.html"],[data-page="walking-tour.html"]) .thero__tag{font-size:17px;margin-top:.3rem}
  main:is([data-page="baseball.html"],[data-page="walking-tour.html"]) .thero__hook{max-width:none;margin-top:.5rem}
  main:is([data-page="baseball.html"],[data-page="walking-tour.html"]) .thero__price{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:flex-start;column-gap:.45em;row-gap:0;margin:1rem 0 1.1rem}
  main:is([data-page="baseball.html"],[data-page="walking-tour.html"]) .thero__price > span{font-size:var(--fs-small)}
  main:is([data-page="baseball.html"],[data-page="walking-tour.html"]) .thero__price .hchips{flex-basis:100%;margin-top:.6rem}
  main:is([data-page="baseball.html"],[data-page="walking-tour.html"]) .thero .wrap > div:first-child > .btn{display:flex;width:100%;box-sizing:border-box;justify-content:center}
}
/* Update 37 Fix 12: About title much bigger, a little closer to the hero photo */
.astory .sec-head h2{font-size:clamp(56px,6.4vw,96px)!important;line-height:1!important}
main .astory.sec{padding-top:calc(var(--sp-sec) * .66)!important}
@media (max-width:760px){.astory .sec-head h2{font-size:clamp(36px,11.5vw,48px)!important}}
/* Update 39 Fixes 5 + 6: Spanish titles sized to stay on one line (English unchanged) */
@media (min-width:821px){html[lang="es"] .astory .sec-head h2{font-size:min(60px,calc((100vw - 140px) / 17.4))!important}}
@media (max-width:760px){html[lang="es"] .astory .sec-head h2{font-size:min(48px,calc((100vw - 48px) / 8.8))!important}}
html[lang="es"] #faq-title{font-size:min(56px,calc((100vw - 48px) / 11.5))!important}
/* Update 39 Fix 7: the receipt no longer sits 110px lower than the form; its top lines up with the form card, closer under the title (every booking form) */
.book__grid > .summary{top:0!important}
/* Update 40 Fix 1: receipt sits a little below the top of the booking form (two-column layout) */
@media (min-width:901px){.book__grid > .summary{margin-top:32px}}
/* Update 42 Fix 1: final Terms & Conditions page */
.terms__top{display:flex;justify-content:space-between;align-items:flex-start;gap:16px 24px;margin-bottom:var(--sp-head)}
.terms__top h1{margin:0;color:var(--ink)}
.terms__dl{flex:none;font-weight:700;color:var(--ink);margin-top:.6em;white-space:nowrap}
.terms__body .terms__sub{margin:0 0 28px}
.terms__body h2.terms__part{margin:44px 0 16px}
.terms__body h3.terms__prod{margin:32px 0 12px;color:var(--ink)}
.terms__body p{margin:0 0 14px}
.terms__body .terms__ol{margin:0 0 18px;padding-left:1.6em;display:grid;gap:8px}
.terms__body .terms__ol li{list-style:decimal}
@media (max-width:760px){.terms__top{flex-direction:column}.terms__dl{margin-top:0}}
/* Update 42 Fix 2: Risk Acknowledgment pop-up (Work with us look, longer text) */
.wwu--text .wwu__card{width:min(640px,100%);max-height:calc(100vh - 48px);overflow:auto;text-align:left;padding:44px 36px 36px}
.wwu__legal{margin:0!important;line-height:1.6}
@media (max-width:760px){.wwu--text .wwu__card{max-height:88vh;padding:44px 24px calc(28px + env(safe-area-inset-bottom))}}
/* Update 42 Fix 2: the consent error sits under the checkbox text, not beside it */
.check{flex-wrap:wrap}
.check > span{flex:1 1 0;min-width:0}
.check > .ferr{flex-basis:100%;margin:2px 0 0 calc(18px + .6rem)}
/* Update 42 Fix 6: the longer Children label can wrap; keep both steppers on one line */
.bform .grid2.grid2--ac{align-items:end}
/* Update 42 Fix 1: long Spanish part titles fit on phones */
@media (max-width:760px){.terms__body h2.terms__part{font-size:clamp(22px,6.6vw,32px)!important;overflow-wrap:anywhere}}
/* Launch: Privacy Policy page uses the Terms page layout; numbered section titles in the product-heading style */
.terms__body h2.terms__prod{font-size:var(--fs-h3)!important;line-height:1.2!important;margin:32px 0 12px;color:var(--ink)}
.terms__body .terms__ul{margin:0 0 18px;padding-left:1.4em;display:grid;gap:8px}
.terms__body .terms__ul li{list-style:disc}
/* Update 43 Fix 2: the Instagram arrow shows on every screen size (the booking form arrows stay desktop only) */
@media (max-width:900px){#ig .igarrow{display:block!important}}
/* Update 44 Fix 2: the arrow sits beside the title, so the title-to-posts gap goes back to the Home standard (--sp-head).
   Only if the arrow has to drop under the title (no room to its right) does the gap grow to fit it. */
.ig-top.ig-top--below .sec-head{margin-bottom:58px!important}
/* Update 46 Fix 3: a brand icon file in a Why item takes the same 56px box as the drawn icons */
.why__item img.why__ico{display:block;width:56px;height:56px;object-fit:contain}
@media (max-width:760px){.why__item img.why__ico{margin-inline:auto}}