:root{
  --coral:#d96e58;
  --coral-deep:#b84f3c;
  --sage:#7f8871;
  --sage-deep:#596150;
  --mustard:#e6bd2a;
  --cream:#f4ead9;
  --paper:#fff9ef;
  --ink:#171312;
  --white:#fffdf8;
  --pink:#e5a3ae;
  --turquoise:#82c3bd;
  --shadow:0 30px 80px rgba(32,18,14,.18);
  --radius:28px;
  --display:"Iowan Old Style","Palatino Linotype",Palatino,"Book Antiqua",Georgia,serif;
  --sans:"Avenir Next",Avenir,"Segoe UI",Helvetica,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;background:var(--ink)}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:16px;line-height:1.55;overflow-x:hidden}
body.is-locked{overflow:hidden}
a{color:inherit;text-decoration:none}
button{font:inherit}
img{display:block;max-width:100%}
::selection{background:var(--mustard);color:var(--ink)}
.skip-link{position:fixed;left:1rem;top:-100px;z-index:9999;padding:.8rem 1rem;background:var(--ink);color:var(--white);border-radius:12px}
.skip-link:focus{top:1rem}

.intro{position:fixed;inset:0;z-index:9997;background:var(--ink);color:var(--white);display:grid;place-items:center;align-content:center;gap:1rem;transition:opacity .7s ease,visibility .7s ease}
.intro.is-gone{opacity:0;visibility:hidden}
.intro__mark{position:relative;width:110px;height:110px;border:1px solid rgba(255,255,255,.28);border-radius:50%;display:grid;place-items:center;font:italic 64px/.8 var(--display);transform:rotate(-8deg)}
.intro__mark span{transform:translateY(-4px)}
.intro__mark i{position:absolute;width:11px;height:11px;background:var(--mustard);border-radius:50%}
.intro__mark i:nth-of-type(1){top:16px;right:20px}.intro__mark i:nth-of-type(2){top:3px;right:40px}.intro__mark i:nth-of-type(3){top:19px;right:52px}
.intro p{margin:0;font-size:.76rem;letter-spacing:.28em;text-transform:uppercase;opacity:.7}

.scroll-line{position:fixed;top:0;left:0;right:0;height:2px;z-index:9996;pointer-events:none}
.scroll-line span{display:block;height:100%;width:0;background:var(--mustard);box-shadow:0 0 16px var(--mustard)}
/* A small paw replaces the generic circular mouse follower on fine pointers. */
.cursor{position:fixed;left:0;top:0;width:36px;height:36px;z-index:9995;pointer-events:none;display:none;filter:drop-shadow(0 3px 7px rgba(23,19,18,.2));transform-origin:center;transition:filter .2s ease}
.cursor__toe,.cursor__pad{position:absolute;display:block;background:var(--mustard);border:1.4px solid rgba(23,19,18,.82);transition:transform .2s cubic-bezier(.2,.8,.2,1),background .2s ease}
.cursor__toe{width:8px;height:10px;border-radius:58% 58% 48% 48%}
.cursor__toe--1{left:3px;top:11px;transform:rotate(-31deg)}
.cursor__toe--2{left:10px;top:3px;transform:rotate(-12deg)}
.cursor__toe--3{right:10px;top:3px;transform:rotate(12deg)}
.cursor__toe--4{right:3px;top:11px;transform:rotate(31deg)}
.cursor__pad{left:9px;top:16px;width:18px;height:16px;border-radius:52% 52% 60% 60% / 42% 42% 70% 70%;transform:rotate(0deg)}
.cursor.is-hover{filter:drop-shadow(0 5px 12px rgba(23,19,18,.28))}
.cursor.is-hover .cursor__toe,.cursor.is-hover .cursor__pad{background:var(--coral);transform:scale(1.22) rotate(0deg)}
.cursor.is-click .cursor__toe,.cursor.is-click .cursor__pad{transform:scale(.82);background:var(--turquoise)}
@media (pointer:fine){.cursor{display:block}body{cursor:none}a,button,[tabindex]{cursor:none}}

.site-header{position:fixed;top:0;left:0;right:0;z-index:80;display:flex;align-items:center;justify-content:space-between;padding:18px clamp(20px,4vw,68px);transition:background .3s ease,backdrop-filter .3s ease,border-color .3s ease;color:var(--white);border-bottom:1px solid transparent}
.site-header.is-scrolled{background:rgba(255,249,239,.78);backdrop-filter:blur(18px) saturate(130%);-webkit-backdrop-filter:blur(18px) saturate(130%);border-color:rgba(23,19,18,.08);color:var(--ink)}
.brand{display:flex;align-items:center;gap:10px;font-weight:800;letter-spacing:-.03em}
.brand__mark{width:42px;height:42px;border:1px solid currentColor;border-radius:50%;display:grid;place-items:center;font:italic 27px/.9 var(--display);position:relative}
.brand__mark>span{position:absolute;width:5px;height:5px;border-radius:50%;background:var(--mustard);right:7px;top:6px;font-size:0}
.brand__text{font-size:.95rem;line-height:1.05}.brand__text small{display:block;font-weight:500;font-size:.62rem;letter-spacing:.08em;margin-top:4px;text-transform:uppercase;opacity:.72}
.nav{display:flex;align-items:center;gap:clamp(18px,2.2vw,34px);font-size:.78rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.nav a{position:relative;padding:8px 0}.nav a::after{content:"";position:absolute;left:0;right:100%;bottom:0;height:1px;background:currentColor;transition:right .25s ease}.nav a:hover::after,.nav a:focus-visible::after{right:0}
.amigo-toggle{border:1px solid currentColor;background:transparent;color:inherit;border-radius:999px;padding:8px 12px 8px 10px;display:flex;gap:8px;align-items:center;font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.amigo-toggle span{width:22px;height:22px;border:1px solid currentColor;border-radius:50%;display:grid;place-items:center;font-size:.8rem;transition:transform .3s ease,background .3s ease}.amigo-toggle[aria-pressed="true"] span{background:var(--mustard);transform:rotate(180deg)}
.menu-toggle{display:none;width:46px;height:42px;border:1px solid currentColor;background:transparent;border-radius:999px;position:relative;color:inherit}.menu-toggle span{position:absolute;width:16px;height:1px;background:currentColor;left:14px;transition:transform .2s ease,top .2s ease}.menu-toggle span:first-child{top:16px}.menu-toggle span:last-child{top:23px}.menu-toggle[aria-expanded="true"] span:first-child{top:20px;transform:rotate(45deg)}.menu-toggle[aria-expanded="true"] span:last-child{top:20px;transform:rotate(-45deg)}
.is-locked .site-header{color:var(--ink);background:rgba(255,249,239,.92);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
.mobile-nav{position:fixed;inset:0;z-index:70;background:var(--paper);padding:120px 28px 40px;display:grid;align-content:center;gap:12px}.mobile-nav[hidden]{display:none}.mobile-nav a{font:italic clamp(2.4rem,12vw,5rem)/1 var(--display);border-bottom:1px solid rgba(23,19,18,.12);padding:10px 0}

.hero{min-height:100svh;position:relative;display:flex;align-items:flex-end;overflow:hidden;background:var(--ink);color:var(--white)}
.hero__media{position:absolute;inset:-3%;will-change:transform}.hero__media img{width:100%;height:100%;object-fit:cover;filter:saturate(.93) contrast(1.02)}
.hero__wash{position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,12,9,.82) 0%,rgba(20,12,9,.58) 37%,rgba(20,12,9,.16) 68%,rgba(20,12,9,.36) 100%),linear-gradient(0deg,rgba(20,12,9,.72) 0%,transparent 52%)}
.hero__grid{position:absolute;inset:0;opacity:.18;background-image:linear-gradient(rgba(255,255,255,.09) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.09) 1px,transparent 1px);background-size:72px 72px;mask-image:linear-gradient(to top,#000,transparent 70%)}
.hero__content{position:relative;z-index:2;width:min(920px,calc(100% - 40px));margin:0 0 clamp(56px,8vh,92px) clamp(20px,7vw,112px)}
.eyebrow,.kicker{font-size:.72rem;font-weight:800;letter-spacing:.16em;text-transform:uppercase}
.eyebrow{margin:0 0 22px;color:#fff0d5}
.hero__title{margin:0;font:500 clamp(4.7rem,10vw,10rem)/.72 var(--display);letter-spacing:-.07em;display:flex;flex-direction:column;max-width:780px}
.hero__title span{display:block}.hero__title span:nth-child(2){margin-left:12%}.hero__title-accent{color:var(--mustard);font-style:italic;margin-left:29%}
.hero__lead{max-width:610px;margin:30px 0 0;font-size:clamp(1rem,1.35vw,1.25rem);color:rgba(255,255,255,.86)}
.hero__actions{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:12px 20px;border-radius:999px;font-size:.78rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase;transition:transform .2s ease,background .2s ease,color .2s ease,border-color .2s ease}
.btn:hover,.btn:focus-visible{transform:translateY(-2px)}.btn--solid{background:var(--mustard);color:var(--ink);border:1px solid var(--mustard)}.btn--ghost{border:1px solid rgba(255,255,255,.6);color:var(--white);background:rgba(255,255,255,.04);backdrop-filter:blur(8px)}.btn--ghost:hover{background:var(--white);color:var(--ink)}.btn--dark{background:var(--ink);color:var(--white);border:1px solid var(--ink);width:max-content;gap:10px}
.hero__badge{position:absolute;right:clamp(22px,5vw,72px);bottom:clamp(55px,8vh,86px);z-index:3;width:132px;height:132px;border-radius:50%;background:rgba(255,249,239,.88);color:var(--ink);display:grid;place-items:center;align-content:center;text-align:center;transform:rotate(7deg);backdrop-filter:blur(10px);box-shadow:0 18px 60px rgba(0,0,0,.25)}.hero__badge span{font-size:.66rem;font-weight:900;letter-spacing:.14em}.hero__badge b{font:italic 3.3rem/.9 var(--display);color:var(--coral)}.hero__badge small{font-size:.58rem;text-transform:uppercase;letter-spacing:.12em}
.hero__scroll{position:absolute;right:24px;top:50%;z-index:4;display:flex;align-items:center;gap:10px;transform:rotate(90deg) translateY(-50%);transform-origin:right top;font-size:.62rem;letter-spacing:.18em;text-transform:uppercase}.hero__scroll i{display:block;width:48px;height:1px;background:rgba(255,255,255,.45);position:relative;overflow:hidden}.hero__scroll i::after{content:"";position:absolute;inset:0;background:var(--white);transform:translateX(-100%);animation:scrollHint 1.8s ease-in-out infinite}@keyframes scrollHint{60%,100%{transform:translateX(100%)}}

.statement{display:grid;grid-template-columns:1.15fr .85fr;min-height:800px;background:var(--coral);color:var(--white)}
.statement__photo{min-height:760px;overflow:hidden}.statement__photo img{width:100%;height:100%;object-fit:cover}
.statement__copy{padding:clamp(64px,9vw,150px) clamp(32px,6vw,100px);display:flex;flex-direction:column;justify-content:center}
.kicker{margin:0 0 28px;opacity:.74}.statement h2,.fine h2,.amigo h2,.experience h2,.find h2,.orbit-copy h2{margin:0;font:500 clamp(3.8rem,6.3vw,7rem)/.86 var(--display);letter-spacing:-.055em}.statement h2 em,.fine h2 em,.amigo h2 em,.experience h2 em,.find h2 em{color:var(--mustard);font-weight:500}.statement__copy>p:not(.kicker){font-size:clamp(1.05rem,1.35vw,1.25rem);max-width:580px;margin:34px 0 0}.microcopy{margin-top:42px;padding-top:20px;border-top:1px solid rgba(255,255,255,.28);max-width:520px;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase}

.orbit-section{background:var(--paper);padding:clamp(80px,10vw,150px) 0;overflow:hidden}.orbit-copy{padding:0 clamp(20px,6vw,90px) 52px}.orbit-copy h2{max-width:800px}.gallery{display:flex;gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;padding:0 clamp(20px,6vw,90px) 24px;scrollbar-width:none;cursor:grab}.gallery::-webkit-scrollbar{display:none}.gallery.is-dragging{cursor:grabbing;scroll-snap-type:none}.gallery__item{flex:0 0 min(440px,78vw);margin:0;scroll-snap-align:start;position:relative}.gallery__item--wide{flex-basis:min(690px,86vw)}.gallery__item img{width:100%;height:clamp(420px,48vw,650px);object-fit:cover;border-radius:var(--radius);box-shadow:var(--shadow)}.gallery__item figcaption{font-size:.76rem;text-transform:uppercase;letter-spacing:.12em;margin-top:14px;font-weight:800}

.fine{background:var(--sage);color:var(--white);padding:clamp(86px,11vw,160px) clamp(20px,6vw,90px)}.fine__head{display:grid;grid-template-columns:1.2fr .8fr;column-gap:10vw;align-items:end}.fine__head>p:last-child{max-width:520px;margin:0 0 10px;font-size:1.05rem}.fine h2 em{color:var(--mustard)}
.mood-grid{display:grid;grid-template-columns:repeat(3,1fr);margin-top:74px;border-top:1px solid rgba(255,255,255,.25);border-bottom:1px solid rgba(255,255,255,.25)}.mood-card{position:relative;min-height:390px;padding:34px 30px;display:flex;flex-direction:column;justify-content:flex-end;overflow:hidden;isolation:isolate;outline:none}.mood-card+.mood-card{border-left:1px solid rgba(255,255,255,.25)}.mood-card::before{content:"";position:absolute;inset:100% 0 0;background:var(--mustard);z-index:-1;transition:inset .45s cubic-bezier(.2,.75,.2,1)}.mood-card:hover::before,.mood-card:focus-visible::before{inset:0}.mood-card:hover,.mood-card:focus-visible{color:var(--ink)}.mood-card__index{position:absolute;left:30px;top:28px;font-size:.65rem;letter-spacing:.15em;font-weight:900}.mood-card h3{font:italic 4rem/1 var(--display);margin:0 0 16px;letter-spacing:-.04em}.mood-card p{margin:0;max-width:290px;font-size:.95rem}.mood-card__line{display:block;width:44px;height:1px;background:currentColor;margin-top:24px;transition:width .35s ease}.mood-card:hover .mood-card__line{width:100%}

.neon-break{min-height:600px;position:relative;display:grid;place-items:center;align-content:center;text-align:center;overflow:hidden;color:var(--white);padding:80px 20px}.neon-break__bg{position:absolute;inset:0;background:linear-gradient(rgba(151,58,42,.78),rgba(151,58,42,.83)),url('../images/amigos-neon.webp') center/cover no-repeat;filter:saturate(1.08)}.neon-break blockquote{position:relative;margin:0;font:italic clamp(3.5rem,7.5vw,8rem)/.95 var(--display);letter-spacing:-.055em;text-shadow:0 0 14px rgba(255,244,213,.48),0 0 46px rgba(255,223,186,.34)}.neon-break p{position:relative;margin:25px 0 0;font-size:.76rem;text-transform:uppercase;letter-spacing:.14em}

.amigo{display:grid;grid-template-columns:.95fr 1.05fr;min-height:760px;background:var(--cream)}.amigo__visual{display:flex;align-items:center;justify-content:center;position:relative;padding:70px;background:linear-gradient(135deg,var(--mustard) 0 50%,#f1cf54 50%)}.dog-placeholder{width:min(430px,72vw);aspect-ratio:1;border-radius:48% 48% 44% 44%;background:var(--paper);border:1px solid rgba(23,19,18,.1);box-shadow:var(--shadow);position:relative;display:grid;place-items:center}.dog-placeholder__ears::before,.dog-placeholder__ears::after{content:"";position:absolute;top:-8%;width:38%;height:38%;background:var(--paper);border:1px solid rgba(23,19,18,.08);z-index:-1}.dog-placeholder__ears::before{left:2%;border-radius:80% 20% 40% 60%;transform:rotate(-24deg)}.dog-placeholder__ears::after{right:2%;border-radius:20% 80% 60% 40%;transform:rotate(24deg)}.dog-placeholder__face{font:italic clamp(9rem,18vw,15rem)/1 var(--display);transform:translateY(-3%);color:var(--coral);letter-spacing:-.1em}.dog-placeholder__nose{position:absolute;bottom:20%;left:50%;width:22px;height:14px;background:var(--ink);border-radius:50% 50% 60% 60%;transform:translateX(-50%)}.photo-note{position:absolute;left:30px;bottom:24px;max-width:290px;font-size:.68rem;text-transform:uppercase;letter-spacing:.1em;font-weight:800}.amigo__copy{padding:clamp(70px,9vw,150px);display:flex;flex-direction:column;justify-content:center}.amigo__copy>p:not(.kicker):not(.amigo__names){font-size:1.05rem;max-width:580px;margin:32px 0 0}.amigo__names{font:italic 1.8rem var(--display);margin:34px 0;color:var(--coral)}.paw-button{border:0;border-bottom:1px solid var(--ink);background:transparent;padding:0 0 8px;width:max-content;font-size:.75rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase;display:flex;align-items:center;gap:14px;color:var(--ink)}
.paw-layer{position:fixed;inset:0;z-index:90;pointer-events:none;overflow:hidden}.paw{position:absolute;width:17px;height:20px;opacity:0;transform:rotate(var(--r));animation:pawUp 1.6s ease forwards}.paw::before{content:"";position:absolute;left:4px;bottom:0;width:10px;height:11px;background:var(--coral);border-radius:55% 55% 48% 48%}.paw::after{content:"•••";position:absolute;top:-7px;left:0;color:var(--coral);font-size:12px;letter-spacing:-1px}@keyframes pawUp{0%{opacity:0;transform:translateY(18px) rotate(var(--r)) scale(.7)}18%{opacity:.7}100%{opacity:0;transform:translateY(-48px) rotate(var(--r)) scale(1.1)}}

.experience{padding:clamp(90px,12vw,170px) clamp(20px,6vw,90px);background:var(--ink);color:var(--white)}.experience__intro{display:grid;grid-template-columns:1.15fr .85fr;column-gap:10vw;align-items:end}.experience__intro>p:last-child{max-width:540px;margin:0 0 10px;color:rgba(255,255,255,.76)}.future-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:72px}.future-card{position:relative;min-height:480px;padding:34px;border:1px solid rgba(255,255,255,.16);border-radius:30px;overflow:hidden;background:rgba(255,255,255,.025);display:flex;flex-direction:column;justify-content:flex-end;transition:transform .3s ease,border-color .3s ease,background .3s ease}.future-card:hover{transform:translateY(-7px);border-color:rgba(255,255,255,.36);background:rgba(255,255,255,.05)}.future-card__eyebrow{font-size:.65rem;font-weight:900;letter-spacing:.16em;text-transform:uppercase;color:var(--mustard);margin:0 0 10px}.future-card h3{font:italic 2.45rem/1.02 var(--display);margin:0 0 16px}.future-card>p:not(.future-card__eyebrow){margin:0;color:rgba(255,255,255,.68);font-size:.92rem}.future-card__status{margin-top:28px;font:600 .58rem var(--sans);letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.4)}.future-card__icon{position:absolute;left:34px;top:34px;width:120px;height:120px;border:1px solid rgba(255,255,255,.18);border-radius:50%;display:grid;place-items:center}.future-card__icon span{font:italic 2rem var(--display)}.future-card__icon i{position:absolute;inset:14px;border:1px dashed var(--mustard);border-radius:50%;animation:spin 8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}.scan-cube{position:absolute;width:110px;height:110px;left:52px;top:52px;transform:rotate(30deg) skew(-3deg);border:1px solid var(--turquoise);box-shadow:18px -18px 0 -17px var(--turquoise),36px -36px 0 -35px var(--turquoise)}.scan-cube i{position:absolute;background:var(--turquoise);opacity:.7}.scan-cube i:nth-child(1){width:1px;height:155px;left:50%;top:-22px;transform:rotate(45deg)}.scan-cube i:nth-child(2){height:1px;width:155px;left:-22px;top:50%;transform:rotate(45deg)}.scan-cube i:nth-child(3){inset:18px;background:transparent;border:1px dashed rgba(130,195,189,.75)}.video-frame{position:absolute;left:34px;right:34px;top:34px;height:170px;border-radius:18px;background:linear-gradient(135deg,var(--coral),var(--mustard));display:grid;place-items:center;overflow:hidden}.video-frame::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent 0 48%,rgba(255,255,255,.16) 48% 52%,transparent 52%);transform:translateX(-100%);animation:sweep 3.4s ease-in-out infinite}@keyframes sweep{60%,100%{transform:translateX(100%)}}.video-frame span{width:56px;height:56px;border-radius:50%;border:1px solid rgba(23,19,18,.65);display:grid;place-items:center;color:var(--ink);padding-left:3px;background:rgba(255,249,239,.7);backdrop-filter:blur(8px)}

.find{display:grid;grid-template-columns:1fr 1fr;min-height:760px;background:var(--paper)}.find__visual{position:relative;overflow:hidden;min-height:700px}.find__visual img{width:100%;height:100%;object-fit:cover;filter:saturate(.88)}.find__pin{position:absolute;left:50%;top:50%;width:84px;height:84px;background:var(--mustard);border-radius:50% 50% 50% 0;transform:translate(-50%,-50%) rotate(-45deg);box-shadow:0 18px 55px rgba(0,0,0,.25);display:grid;place-items:center}.find__pin span{font:italic 2.4rem var(--display);transform:rotate(45deg);color:var(--ink)}.find__copy{padding:clamp(70px,9vw,150px);display:flex;flex-direction:column;justify-content:center}.find address{font-style:normal;font-size:1.05rem;margin:34px 0 30px;line-height:1.8}.find address strong{font-size:1.18rem}.find__note{max-width:470px;margin:24px 0 0;color:rgba(23,19,18,.6);font-size:.78rem}

.footer{background:var(--coral);color:var(--white);padding:38px clamp(20px,6vw,90px);display:grid;grid-template-columns:1fr auto auto auto;align-items:center;gap:28px;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase}.footer__brand{display:flex;align-items:center;gap:12px}.footer__brand p{margin:0;line-height:1.35}.footer__brand strong{font-size:.9rem}.footer__meta{display:grid;gap:8px}.footer__meta>p{margin:0}

.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.75,.2,1)}.reveal.is-in{opacity:1;transform:none}

body.amigo-mode{--paper:#fff7e8}.amigo-mode .site-header.is-scrolled{background:rgba(255,247,232,.82)}.amigo-mode .hero__wash{background:linear-gradient(90deg,rgba(57,27,18,.83) 0%,rgba(57,27,18,.55) 42%,rgba(57,27,18,.15) 72%),linear-gradient(0deg,rgba(57,27,18,.7),transparent 55%)}.amigo-mode .hero__badge{animation:wobble 1.3s ease infinite alternate}@keyframes wobble{to{transform:rotate(-6deg) translateY(-4px)}}

@media (max-width:980px){
  .nav,.amigo-toggle{display:none}.menu-toggle{display:block}
  .hero__content{margin-left:28px;width:calc(100% - 56px)}.hero__badge{right:28px;width:110px;height:110px}.hero__badge b{font-size:2.7rem}.hero__scroll{display:none}
  .statement,.amigo,.find{grid-template-columns:1fr}.statement__photo{min-height:64vw;max-height:720px}.statement__copy{min-height:620px}
  .fine__head,.experience__intro{grid-template-columns:1fr}.fine__head>p:last-child,.experience__intro>p:last-child{margin:34px 0 0}.mood-grid,.future-grid{grid-template-columns:1fr}.mood-card+.mood-card{border-left:0;border-top:1px solid rgba(255,255,255,.25)}.mood-card{min-height:280px}.future-card{min-height:420px}.amigo__visual{min-height:640px}.find__visual{min-height:620px}.footer{grid-template-columns:1fr;justify-items:start}
}
@media (max-width:620px){
  .footer-credit__text{white-space:normal}
  .footer-credit:hover .footer-credit__text,.footer-credit:focus-visible .footer-credit__text{max-width:190px}
  .site-header{padding:12px 16px}.brand__text small{display:none}.brand__mark{width:38px;height:38px}.brand__text{font-size:.88rem}
  .hero{min-height:94svh}.hero__content{margin:0 18px 44px;width:calc(100% - 36px)}.hero__title{font-size:clamp(4.1rem,23vw,6.5rem)}.hero__title span:nth-child(2){margin-left:6%}.hero__title-accent{margin-left:13%}.hero__lead{font-size:.95rem;max-width:90%}.hero__badge{width:92px;height:92px;right:16px;bottom:38px;opacity:.92}.hero__badge b{font-size:2.2rem}.hero__badge span,.hero__badge small{font-size:.5rem}
  .statement h2,.fine h2,.amigo h2,.experience h2,.find h2,.orbit-copy h2{font-size:clamp(3.25rem,15vw,4.7rem)}.statement__copy,.amigo__copy,.find__copy{padding:72px 22px}.orbit-copy{padding:0 22px 36px}.gallery{padding-left:22px;padding-right:22px;gap:14px}.gallery__item img{height:430px;border-radius:20px}.fine,.experience{padding:82px 22px}.mood-grid{margin-top:48px}.mood-card{padding:28px 22px}.mood-card__index{left:22px}.mood-card h3{font-size:3.3rem}.neon-break{min-height:480px}.amigo__visual{min-height:520px;padding:44px 22px}.photo-note{left:20px;bottom:18px;max-width:250px}.future-card{padding:26px;min-height:430px}.future-card__icon{left:26px;top:26px}.video-frame{left:26px;right:26px;top:26px}.find__visual{min-height:520px}.footer{padding:34px 22px}
}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.intro,.reveal,.hero__media,.future-card,.btn,.mood-card::before,.scroll-line span{transition:none!important;animation:none!important}.future-card__icon i,.video-frame::after,.amigo-mode .hero__badge{animation:none!important}.cursor{display:none!important}}

/* =========================================================
   V2 – accessibility, sound, Amigo Mode, legal & responsive
   ========================================================= */

:root{
  --focus:#171312;
  --focus-on-dark:#fff9ef;
}

:where(a,button,[tabindex]):focus-visible{
  outline:3px solid var(--focus);
  outline-offset:4px;
  border-radius:6px;
}
.hero :where(a,button):focus-visible,
.fine :where(a,button):focus-visible,
.experience :where(a,button):focus-visible,
.neon-break :where(a,button):focus-visible,
.site-header:not(.is-scrolled) :where(a,button):focus-visible{
  outline-color:var(--focus-on-dark);
}
button{color:inherit}

/* Keep the native pointer. The circle is decorative only. */
@media (pointer:fine){body,a,button,[tabindex]{cursor:auto}.gallery{cursor:grab}.gallery.is-dragging{cursor:grabbing}}

.header-tools{display:flex;align-items:center;gap:8px}
.sound-toggle{min-height:42px;border:1px solid currentColor;background:transparent;color:inherit;border-radius:999px;padding:8px 12px;display:flex;align-items:center;gap:8px;font-size:.68rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.sound-bars{width:21px;height:18px;display:flex;align-items:center;justify-content:center;gap:2px}
.sound-bars i{width:2px;height:6px;background:currentColor;border-radius:2px;transition:height .2s ease}
.sound-toggle.is-on .sound-bars i:nth-child(1){animation:soundBar .65s ease-in-out infinite alternate}
.sound-toggle.is-on .sound-bars i:nth-child(2){animation:soundBar .5s .1s ease-in-out infinite alternate}
.sound-toggle.is-on .sound-bars i:nth-child(3){animation:soundBar .72s .2s ease-in-out infinite alternate}
@keyframes soundBar{to{height:17px}}

.mobile-nav{padding:26px clamp(22px,6vw,54px) 44px;align-content:start;overflow-y:auto}
.mobile-nav__top{display:flex;justify-content:space-between;align-items:center;margin-bottom:clamp(60px,10vh,110px);font-size:.76rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}
.mobile-nav__close{min-height:44px;border:1px solid var(--ink);background:transparent;border-radius:999px;padding:8px 14px;font-size:.7rem;text-transform:uppercase;letter-spacing:.08em}
.mobile-nav__tools{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.mobile-nav__tools button{min-height:46px;border:1px solid var(--ink);border-radius:999px;background:transparent;padding:9px 15px;font-size:.72rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}
.mobile-nav__tools button.is-on{background:var(--mustard)}

/* Contrast corrections for WCAG AA on body-sized text. */
.statement{background:var(--coral-deep);color:var(--white)}
.fine{background:var(--sage-deep);color:var(--white)}
.footer{background:var(--coral);color:var(--ink)}
.footer .brand__mark{border-color:var(--ink)}

.gallery-toolbar{display:flex;align-items:center;justify-content:flex-end;gap:14px;padding:0 clamp(20px,6vw,90px) 22px;font-size:.65rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase}
.gallery-arrow{width:44px;height:44px;border:1px solid rgba(23,19,18,.35);border-radius:50%;background:transparent;display:grid;place-items:center;font-size:1rem}
.gallery:focus-visible{outline:3px solid var(--coral-deep);outline-offset:-3px}

.fine__head>div{min-width:0}
.mood-card__mini{position:absolute;top:64px;left:30px;font-size:.59rem!important;font-weight:800;text-transform:uppercase;letter-spacing:.12em;opacity:.75}
.fine__note{margin:28px 0 0;max-width:680px;font-size:.74rem;text-transform:uppercase;letter-spacing:.1em;color:rgba(255,255,255,.74)}

.neon-secret{position:relative;border:0;background:transparent;color:var(--white);padding:18px;max-width:min(1200px,96vw)}
.neon-secret span{display:block;font:italic clamp(3.5rem,7.5vw,8rem)/.95 var(--display);letter-spacing:-.055em;text-shadow:0 0 14px rgba(255,244,213,.48),0 0 46px rgba(255,223,186,.34)}
.neon-secret.is-flicker span{animation:neonFlicker .65s ease}
@keyframes neonFlicker{0%,18%,38%,100%{opacity:1}10%,28%{opacity:.35}}

.people{display:grid;grid-template-columns:1.05fr .95fr;min-height:760px;background:var(--cream)}
.people__copy{padding:clamp(70px,9vw,150px);display:flex;flex-direction:column;justify-content:center}
.people__copy>p:not(.kicker){font-size:1.05rem;max-width:620px;margin:28px 0 0}
.people__copy .paw-button{margin-top:36px}
.people h2{margin:0;font:500 clamp(4.2rem,8vw,8.5rem)/.82 var(--display);letter-spacing:-.055em}
.people h2 em{color:var(--coral-deep)}

.sniff-spot{position:absolute;width:31px;height:31px;border:1px dashed rgba(23,19,18,.5);border-radius:50%;background:rgba(255,249,239,.88);display:grid;place-items:center;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .25s ease,transform .25s ease,background .25s ease;z-index:5}
.sniff-spot span{width:7px;height:7px;background:var(--coral-deep);border-radius:50%;font-size:0}
.amigo-mode .sniff-spot{opacity:.68;visibility:visible;pointer-events:auto;animation:sniffPulse 2.2s ease-in-out infinite}
.sniff-spot:hover,.sniff-spot:focus-visible{opacity:1;transform:scale(1.25)}
.sniff-spot.is-found{background:var(--mustard);opacity:1;animation:none}
.sniff-spot--one{right:7%;top:14%}
.experience{position:relative}
.sniff-spot--two{right:5%;bottom:7%;border-color:rgba(255,255,255,.55);background:rgba(23,19,18,.72)}
.sniff-spot--two span{background:var(--mustard)}
.find__visual .sniff-spot--three{left:9%;bottom:12%;top:auto}
@keyframes sniffPulse{50%{box-shadow:0 0 0 8px rgba(230,189,42,.12)}}

body.amigo-mode .dog-placeholder{animation:dogBreathe 2.2s ease-in-out infinite alternate}
body.amigo-mode .dog-placeholder__nose{animation:noseSniff .7s ease-in-out infinite alternate}
@keyframes dogBreathe{to{transform:translateY(-5px) rotate(.7deg)}}
@keyframes noseSniff{to{transform:translateX(-50%) scale(1.14)}}

.sound-story{display:grid;grid-template-columns:.9fr 1.1fr;min-height:650px;background:var(--mustard);color:var(--ink)}
.sound-story__disc{min-height:650px;display:grid;place-items:center;align-content:center;position:relative;overflow:hidden;background:var(--ink);color:var(--white);border-radius:0}
.sound-story__disc::before{content:"";width:min(430px,70vw);aspect-ratio:1;border-radius:50%;background:repeating-radial-gradient(circle at center,#211d1b 0 3px,#151211 3px 6px);box-shadow:0 35px 90px rgba(0,0,0,.34);animation:recordSpin 14s linear infinite}
.sound-story__disc::after{content:"";position:absolute;width:86px;height:86px;border-radius:50%;background:var(--coral);border:8px solid var(--cream)}
.sound-story__disc span,.sound-story__disc b,.sound-story__disc i{position:absolute;z-index:2}
.sound-story__disc span{font-size:.72rem;font-weight:900;letter-spacing:.14em;transform:translateY(-24px)}
.sound-story__disc b{font:italic 2.8rem var(--display);transform:translateY(15px)}
.sound-story__disc i{width:10px;height:10px;background:var(--ink);border-radius:50%}
@keyframes recordSpin{to{transform:rotate(360deg)}}
.sound-story__copy{padding:clamp(70px,9vw,150px);display:flex;flex-direction:column;justify-content:center}
.sound-story h2{margin:0;font:500 clamp(4rem,7.5vw,8rem)/.84 var(--display);letter-spacing:-.055em}
.sound-story h2 em{color:var(--coral-deep)}
.sound-story__copy>p:not(.kicker){max-width:620px;font-size:1.05rem;margin:28px 0 0}
.sound-cta{margin-top:34px;width:max-content;min-height:48px;border:1px solid var(--ink);border-radius:999px;background:transparent;padding:11px 18px;font-size:.72rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase}
.sound-story__hint{font-size:.68rem!important;letter-spacing:.04em;opacity:.68}

.contact-grid{display:grid;gap:10px;margin:0 0 28px;max-width:560px}
.contact-grid a{border-top:1px solid rgba(23,19,18,.18);padding:14px 0;display:flex;justify-content:space-between;align-items:center;gap:16px}
.contact-grid span{font-size:.64rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase;opacity:.62}
.contact-grid strong{font-size:.88rem;text-align:right;overflow-wrap:anywhere}
.find__actions{display:flex;gap:10px;flex-wrap:wrap}

.last-word{min-height:660px;padding:clamp(90px,12vw,170px) clamp(20px,7vw,120px);background:var(--paper);display:flex;flex-direction:column;justify-content:center;align-items:flex-start}
.last-word>p{font-size:.72rem;font-weight:900;text-transform:uppercase;letter-spacing:.12em;margin:0 0 24px}
.last-word h2{font:500 clamp(4.4rem,9vw,10rem)/.78 var(--display);letter-spacing:-.06em;margin:0;max-width:1200px}
.last-word h2 em{color:var(--coral-deep)}
.last-word>a{margin-top:42px;border-bottom:1px solid var(--ink);padding-bottom:7px;font-size:.7rem;font-weight:900;text-transform:uppercase;letter-spacing:.12em}

.footer{grid-template-columns:1fr auto auto auto}
.footer__links{display:flex;gap:18px}
.footer__links a{text-decoration:underline;text-underline-offset:4px}
.footer-whisper{border:0;background:transparent;color:inherit;padding:12px;min-width:44px;min-height:44px;font-size:.62rem;text-transform:uppercase;letter-spacing:.16em;opacity:.6}
.footer-credit{display:inline-flex;align-items:center;gap:7px;width:max-content;max-width:100%;min-height:28px;color:inherit;opacity:.56;text-transform:none;letter-spacing:.04em;font-size:.62rem;transition:opacity .25s ease}
.footer-credit:hover,.footer-credit:focus-visible{opacity:1}
.footer-credit__mark{display:grid;place-items:center;width:25px;height:25px;border:1px solid rgba(255,255,255,.58);border-radius:50%;font:italic 700 .65rem var(--display);text-transform:lowercase;transition:transform .28s cubic-bezier(.2,.8,.2,1),background .25s ease,color .25s ease}
.footer-credit__text{display:block;max-width:0;white-space:nowrap;overflow:hidden;opacity:0;transform:translateX(-5px);transition:max-width .45s cubic-bezier(.2,.8,.2,1),opacity .25s ease,transform .3s ease}
.footer-credit:hover .footer-credit__mark,.footer-credit:focus-visible .footer-credit__mark{transform:rotate(-9deg) scale(1.08);background:var(--mustard);color:var(--ink);border-color:var(--mustard)}
.footer-credit:hover .footer-credit__text,.footer-credit:focus-visible .footer-credit__text{max-width:245px;opacity:1;transform:none}

.reward-dialog{width:min(620px,calc(100% - 28px));border:0;border-radius:32px;padding:clamp(34px,6vw,66px);background:var(--paper);color:var(--ink);box-shadow:0 40px 120px rgba(0,0,0,.35)}
.reward-dialog::backdrop{background:rgba(23,19,18,.78);backdrop-filter:blur(8px)}
.reward-dialog__close{position:absolute;right:18px;top:18px;width:44px;height:44px;border:1px solid rgba(23,19,18,.2);border-radius:50%;background:transparent;font-size:1.4rem}
.reward-dialog__paw{width:82px;height:82px;border-radius:50%;background:var(--mustard);display:grid;place-items:center;font:italic 3rem var(--display);margin-bottom:26px}
.reward-dialog h2{font:500 clamp(3.1rem,8vw,5.6rem)/.86 var(--display);letter-spacing:-.055em;margin:0 0 24px}
.reward-dialog h2 em{color:var(--coral-deep)}
.reward-dialog p{max-width:500px}
.reward-code{display:inline-block;margin:20px 0;padding:13px 17px;background:var(--ink);color:var(--white);border-radius:999px;font-weight:900;letter-spacing:.14em;font-size:.82rem}
.reward-dialog small{display:block;opacity:.62;max-width:500px}

.sound-toast{position:fixed;left:50%;bottom:24px;z-index:9998;transform:translate(-50%,25px);opacity:0;pointer-events:none;background:var(--ink);color:var(--white);border-radius:999px;padding:11px 17px;font-size:.7rem;font-weight:800;letter-spacing:.04em;box-shadow:0 15px 50px rgba(0,0,0,.25);transition:opacity .25s ease,transform .25s ease;max-width:calc(100% - 24px);text-align:center}
.sound-toast.is-visible{opacity:1;transform:translate(-50%,0)}

/* ---------- Legal pages ---------- */
.legal-page{background:var(--paper)}
.legal-header{min-height:92px;padding:18px clamp(20px,6vw,90px);display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(23,19,18,.12);gap:20px}
.legal-header>a:last-child{font-size:.7rem;font-weight:900;letter-spacing:.1em;text-transform:uppercase;text-decoration:underline;text-underline-offset:5px}
.legal-shell{width:min(920px,calc(100% - 40px));margin:0 auto;padding:clamp(70px,10vw,140px) 0}
.legal-shell>h1{font:500 clamp(4.2rem,9vw,8rem)/.86 var(--display);letter-spacing:-.055em;margin:0 0 50px}
.legal-shell section{padding:34px 0;border-top:1px solid rgba(23,19,18,.14)}
.legal-shell section h2{font:italic 2rem/1.1 var(--display);margin:0 0 18px}
.legal-shell section p{max-width:760px}
.legal-alert{background:var(--mustard);padding:20px;border-radius:18px;margin:0 0 46px;max-width:850px}
.legal-dl{display:grid;grid-template-columns:minmax(180px,.45fr) 1fr;gap:12px 24px;margin:0}
.legal-dl dt{font-weight:900}.legal-dl dd{margin:0}
.legal-footer{padding:30px clamp(20px,6vw,90px);background:var(--ink);color:var(--white);display:flex;gap:24px;font-size:.7rem;text-transform:uppercase;letter-spacing:.1em}

/* ---------- 404 ---------- */
.error-page{min-height:100svh;display:grid;place-items:center;background:var(--mustard);padding:22px}
.error-page main{max-width:900px}
.error-mark{width:82px;height:82px;border:1px solid var(--ink);border-radius:50%;display:grid;place-items:center;font:italic 3rem var(--display);margin-bottom:28px}
.error-page h1{font:500 clamp(4rem,10vw,8.5rem)/.82 var(--display);letter-spacing:-.06em;margin:0 0 28px}
.error-page h1 em{color:var(--coral-deep)}
.error-page p:not(.kicker){max-width:580px;margin:0 0 32px}

/* Browser fallback: don't rely on backdrop-filter for legibility. */
@supports not ((backdrop-filter:blur(2px)) or (-webkit-backdrop-filter:blur(2px))){
  .site-header.is-scrolled{background:rgba(255,249,239,.96)}
  .hero__badge{background:rgba(255,249,239,.96)}
  .reward-dialog::backdrop{background:rgba(23,19,18,.88)}
}

@media (max-width:1160px){
  .nav{gap:16px}.nav a{font-size:.7rem}.header-tools{gap:6px}.sound-toggle,.amigo-toggle{padding-left:9px;padding-right:9px}.sound-toggle b,.amigo-toggle b{display:none}
}

@media (max-width:980px){
  .header-tools .amigo-toggle{display:none}
  .people,.sound-story{grid-template-columns:1fr}
  .people__copy{order:2}.amigo__visual{order:1;min-height:640px}
  .sound-story__disc{min-height:560px}.sound-story__copy{min-height:600px}
  .footer{grid-template-columns:1fr;justify-items:start}
  .footer__links{flex-wrap:wrap}
}

@media (max-width:620px){
  .header-tools{margin-left:auto}.sound-toggle{width:44px;justify-content:center;padding:8px}.sound-toggle b{display:none}
  .gallery-toolbar{justify-content:space-between}.gallery-toolbar span{font-size:.56rem}
  .people__copy,.sound-story__copy{padding:72px 22px}
  .people h2,.sound-story h2,.last-word h2{font-size:clamp(3.6rem,16vw,5.2rem)}
  .sound-story__disc{min-height:460px}
  .contact-grid a{align-items:flex-start;flex-direction:column;gap:5px}.contact-grid strong{text-align:left}
  .last-word{min-height:560px;padding:82px 22px}
  .footer__links{gap:14px}
  .legal-header{align-items:flex-start;flex-direction:column}.legal-header>a:last-child{padding:6px 0}
  .legal-shell{width:min(100% - 32px,920px)}
  .legal-dl{grid-template-columns:1fr}.legal-dl dd{margin:0 0 10px}
  .reward-dialog{border-radius:24px}
}

@media (prefers-reduced-motion:reduce){
  .sound-bars i,.sound-story__disc::before,.dog-placeholder,.dog-placeholder__nose,.sniff-spot,.neon-secret.is-flicker span{animation:none!important}
  .sound-toast{transition:none}
}

/* High-contrast preference support where available. */
@media (prefers-contrast:more){
  :root{--coral-deep:#8f392a;--sage-deep:#3e493a}
  .btn,.sound-toggle,.amigo-toggle,.gallery-arrow,.mobile-nav__tools button{border-width:2px}
}

/* =========================================================
   V3 – menu, origin story, mood interaction & Amigo HUD
   ========================================================= */
.btn--light{background:var(--paper);color:var(--ink);border:1px solid var(--paper);gap:10px}
.btn--light:hover,.btn--light:focus-visible{background:var(--mustard);border-color:var(--mustard)}

.menu-bar{margin-top:34px;padding:26px 0 0;border-top:1px solid rgba(255,255,255,.25);display:grid;grid-template-columns:minmax(0,1fr) auto;gap:34px;align-items:end}
.menu-bar>div{max-width:720px}.menu-bar__label{display:block;font-size:.62rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase;opacity:.68;margin-bottom:6px}.menu-bar strong{font:italic 1.9rem/1.1 var(--display)}.menu-bar p{margin:10px 0 0;color:rgba(255,255,255,.78);font-size:.9rem;max-width:650px}

.mood-machine{margin-top:68px;border:1px solid rgba(255,255,255,.25);border-radius:30px;padding:clamp(26px,4vw,46px);display:grid;grid-template-columns:.8fr 1.2fr;gap:18px 50px;align-items:center;background:rgba(255,255,255,.035);position:relative;overflow:hidden}
.mood-machine::before{content:"";position:absolute;width:280px;aspect-ratio:1;border-radius:50%;right:-120px;top:-150px;background:var(--mustard);opacity:.14;transition:transform .5s ease,opacity .5s ease}
.mood-machine h3{font:italic clamp(2.2rem,4vw,4rem)/1 var(--display);margin:0}.mood-machine .kicker{margin-bottom:10px}
.mood-machine__buttons{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}.mood-machine__buttons button{min-height:46px;padding:10px 16px;border:1px solid rgba(255,255,255,.5);border-radius:999px;background:transparent;color:var(--white);font-size:.72rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.mood-machine__buttons button:hover,.mood-machine__buttons button:focus-visible,.mood-machine__buttons button.is-active{background:var(--mustard);color:var(--ink);border-color:var(--mustard)}
.mood-machine__answer{grid-column:1/-1;margin:8px 0 0;padding-top:22px;border-top:1px solid rgba(255,255,255,.18);font-size:1rem;max-width:820px;color:rgba(255,255,255,.84)}
body[data-vibe="coffee"] .mood-machine::before{transform:translate(-35px,40px) scale(1.2);opacity:.22}body[data-vibe="aperitivo"] .mood-machine::before{transform:translate(-120px,100px) scale(1.45);background:var(--coral);opacity:.27}body[data-vibe="browse"] .mood-machine::before{transform:translate(-210px,25px) scale(.85);background:var(--turquoise);opacity:.24}

.origin{display:grid;grid-template-columns:1fr 1fr;min-height:820px;background:var(--cream);color:var(--ink)}
.origin__image{position:relative;overflow:hidden;min-height:760px}.origin__image img{width:100%;height:100%;object-fit:cover;filter:saturate(.94) contrast(1.02)}
.origin__stamp{position:absolute;right:7%;bottom:7%;width:168px;aspect-ratio:1;border-radius:50%;background:var(--mustard);display:grid;place-items:center;align-content:center;text-align:center;transform:rotate(-8deg);box-shadow:0 18px 60px rgba(0,0,0,.18);padding:16px}.origin__stamp span{font-size:.58rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.origin__stamp b{font:italic 2.6rem/.86 var(--display)}
.origin__copy{padding:clamp(72px,9vw,150px);display:flex;flex-direction:column;justify-content:center}.origin h2{margin:0;font:500 clamp(3.9rem,7vw,7.5rem)/.84 var(--display);letter-spacing:-.055em}.origin h2 em{color:var(--coral-deep);font-weight:500}.origin__copy>p:not(.kicker){max-width:620px;margin:28px 0 0;font-size:1.04rem}.origin__facts{display:grid;grid-template-columns:repeat(3,1fr);margin-top:42px;border-top:1px solid rgba(23,19,18,.2);border-bottom:1px solid rgba(23,19,18,.2)}.origin__facts span{padding:20px 14px 20px 0;display:flex;flex-direction:column;gap:3px}.origin__facts span+span{padding-left:18px;border-left:1px solid rgba(23,19,18,.2)}.origin__facts b{font-size:.75rem;letter-spacing:.08em;text-transform:uppercase}.origin__facts small{font-size:.72rem;opacity:.62}

.word-ribbon{overflow:hidden;background:var(--mustard);color:var(--ink);border-top:1px solid var(--ink);border-bottom:1px solid var(--ink);white-space:nowrap}.word-ribbon div{width:max-content;padding:15px 0;font-size:.68rem;font-weight:950;letter-spacing:.18em;animation:ribbonMove 28s linear infinite}.word-ribbon div::after{content:"KAFFEE · APERITIVO · BIO · DEMETER · MUSIK · GESPRÄCHE · KLEINE FEINE SACHEN · KAFFEE · APERITIVO · BIO · DEMETER · MUSIK · GESPRÄCHE · KLEINE FEINE SACHEN · ";margin-left:1.2rem}@keyframes ribbonMove{to{transform:translateX(-50%)}}

.amigo-hud{position:fixed;right:18px;bottom:18px;z-index:78;background:rgba(23,19,18,.92);color:var(--white);border:1px solid rgba(255,255,255,.18);border-radius:18px;padding:10px 13px;box-shadow:0 15px 50px rgba(0,0,0,.24);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);font-size:.64rem;text-transform:uppercase;letter-spacing:.1em}.amigo-hud[hidden]{display:none}.amigo-hud span{display:block;color:var(--mustard);font-weight:900}.amigo-hud b{font-weight:700}.amigo-hud i{font-style:normal}

/* Standalone menu page */
.menu-page{background:var(--paper)}
.menu-shell{width:min(1180px,calc(100% - 40px));margin:0 auto;padding:clamp(60px,9vw,130px) 0}.menu-hero{display:grid;grid-template-columns:1.2fr .8fr;gap:50px;align-items:end;margin-bottom:70px}.menu-hero h1{font:500 clamp(4.6rem,10vw,9rem)/.78 var(--display);letter-spacing:-.06em;margin:0}.menu-hero h1 em{color:var(--coral-deep)}.menu-hero__copy{max-width:530px;margin:0 0 12px;font-size:1.04rem}.menu-notice{padding:18px 20px;border-radius:18px;background:var(--mustard);font-size:.88rem;margin-bottom:34px}
.menu-sections{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.menu-section{border:1px solid rgba(23,19,18,.16);border-radius:28px;padding:clamp(28px,4vw,46px);min-height:300px;display:flex;flex-direction:column;background:rgba(255,255,255,.36)}.menu-section__index{font-size:.62rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase;opacity:.55}.menu-section h2{font:italic clamp(2.5rem,4.5vw,4.4rem)/.95 var(--display);margin:50px 0 16px}.menu-section p{margin:0;max-width:490px}.menu-section__status{margin-top:auto;padding-top:30px;font-size:.66rem;font-weight:900;text-transform:uppercase;letter-spacing:.1em;color:var(--coral-deep)}
.menu-philosophy{margin-top:70px;padding:clamp(40px,7vw,80px);border-radius:34px;background:var(--ink);color:var(--white);display:grid;grid-template-columns:.8fr 1.2fr;gap:50px}.menu-philosophy h2{font:italic clamp(3rem,6vw,6rem)/.9 var(--display);margin:0;color:var(--mustard)}.menu-philosophy p{margin:0;align-self:center;max-width:620px;font-size:1.04rem}

@media (max-width:980px){
  .origin{grid-template-columns:1fr}.origin__image{min-height:650px}.menu-bar{grid-template-columns:1fr}.menu-bar .btn{width:max-content}.mood-machine{grid-template-columns:1fr}.mood-machine__buttons{justify-content:flex-start}.menu-hero,.menu-philosophy{grid-template-columns:1fr}.menu-sections{grid-template-columns:1fr}
}
@media (max-width:620px){
  .origin__image{min-height:520px}.origin__copy{padding:72px 22px}.origin h2{font-size:clamp(3.4rem,16vw,5rem)}.origin__stamp{width:126px}.origin__stamp b{font-size:2rem}.origin__facts{grid-template-columns:1fr}.origin__facts span+span{border-left:0;border-top:1px solid rgba(23,19,18,.2);padding-left:0}.mood-machine{margin-top:50px;padding:24px 20px;border-radius:24px}.mood-machine__buttons{display:grid;grid-template-columns:1fr}.mood-machine__buttons button{width:100%}.amigo-hud{right:10px;bottom:10px}.menu-shell{width:min(100% - 30px,1180px);padding-top:50px}.menu-hero{margin-bottom:44px}.menu-hero h1{font-size:clamp(4rem,21vw,6.2rem)}.menu-section{min-height:270px}.menu-philosophy{padding:36px 24px}
}
@media (prefers-reduced-motion:reduce){.word-ribbon div{animation:none}.mood-machine::before{transition:none}}
.legal-footer{flex-wrap:wrap}

/* =========================================================
   V4 – live section tracker, interactive 23-stamp, link polish
   and a real Amigo logo transformation
   ========================================================= */

/* The decorative mood orb must never sit in the hit area. */
.mood-machine::before{pointer-events:none;z-index:0}
.mood-machine>*,.mood-machine__buttons,.mood-machine__buttons button{position:relative;z-index:1}

/* ---------- Amigo logo morph ---------- */
.logo-earable{position:relative;isolation:isolate}

/* ---------- “Wo bin ich gerade?” live tracker ---------- */
.where-track{
  position:fixed;
  left:14px;
  top:50%;
  z-index:79;
  width:54px;
  transform:translateY(-50%);
  display:grid;
  justify-items:center;
  gap:10px;
  padding:13px 8px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:999px;
  color:var(--white);
  background:rgba(23,19,18,.28);
  box-shadow:0 16px 50px rgba(0,0,0,.15);
  backdrop-filter:blur(14px) saturate(130%);
  -webkit-backdrop-filter:blur(14px) saturate(130%);
  transition:color .3s ease,background .3s ease,border-color .3s ease;
}
.site-header.is-scrolled~* .where-track{color:inherit}
.where-track.is-on-light{color:var(--ink);background:rgba(255,249,239,.78);border-color:rgba(23,19,18,.12)}
.where-track__eyebrow{font-size:.48rem;font-weight:950;letter-spacing:.13em;text-transform:uppercase;writing-mode:vertical-rl;transform:rotate(180deg);opacity:.68}
.where-track__current{width:38px;display:grid;justify-items:center;gap:1px;text-align:center;padding:5px 0;border-radius:999px}
.where-track__current b{font:italic 1.35rem/.9 var(--display);color:var(--mustard)}
.where-track.is-on-light .where-track__current b{color:var(--coral-deep)}
.where-track__current span{max-width:34px;font-size:.47rem;font-weight:900;line-height:1.08;letter-spacing:.06em;text-transform:uppercase;overflow-wrap:anywhere}
.where-track__meter{width:2px;height:92px;background:rgba(255,255,255,.25);border-radius:3px;overflow:hidden;position:relative}
.where-track.is-on-light .where-track__meter{background:rgba(23,19,18,.16)}
.where-track__meter i{position:absolute;left:0;right:0;top:0;height:var(--where-progress,0%);background:var(--mustard);box-shadow:0 0 10px rgba(230,189,42,.65);transition:height .12s linear,width .12s linear}
.where-track__dots{display:grid;gap:6px}
.where-track__dots a{width:7px;height:7px;border:1px solid currentColor;border-radius:50%;opacity:.5;transition:transform .2s ease,background .2s ease,opacity .2s ease}
.where-track__dots a.is-active,.where-track__dots a:hover,.where-track__dots a:focus-visible{background:var(--mustard);border-color:var(--mustard);opacity:1;transform:scale(1.45)}
.where-track.is-on-light .where-track__dots a.is-active{background:var(--coral-deep);border-color:var(--coral-deep)}
.nav a[aria-current="location"]{color:var(--mustard)}
.site-header.is-scrolled .nav a[aria-current="location"]{color:var(--coral-deep)}
.nav a[aria-current="location"]::after{right:0}

/* ---------- The white 23 circle is now a useful address stamp ---------- */
.hero__stamp{
  position:absolute;
  right:clamp(22px,5vw,72px);
  bottom:clamp(55px,8vh,86px);
  z-index:5;
  display:grid;
  justify-items:end;
}
.hero__badge{
  position:relative;
  right:auto;
  bottom:auto;
  border:0;
  padding:0;
  width:132px;
  height:132px;
  color:var(--ink);
  cursor:pointer;
  transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,background .25s ease;
}
.hero__badge:hover,.hero__badge:focus-visible{transform:rotate(1deg) translateY(-5px) scale(1.04);box-shadow:0 24px 80px rgba(0,0,0,.34)}
.hero__badge[aria-expanded="true"]{transform:rotate(-3deg) scale(1.04);background:var(--mustard)}
.hero__badge em{position:absolute;bottom:12px;font:800 .45rem var(--sans);letter-spacing:.12em;text-transform:uppercase;opacity:.56}
.hero__stamp-panel{
  position:absolute;
  right:calc(100% + 16px);
  bottom:4px;
  width:min(320px,calc(100vw - 190px));
  padding:20px;
  border:1px solid rgba(255,255,255,.2);
  border-radius:24px;
  color:var(--white);
  background:rgba(23,19,18,.84);
  box-shadow:0 28px 80px rgba(0,0,0,.34);
  backdrop-filter:blur(18px) saturate(130%);
  -webkit-backdrop-filter:blur(18px) saturate(130%);
}
.hero__stamp-panel[hidden]{display:none}
.hero__stamp-panel strong{display:block;font:italic 1.7rem/1.05 var(--display);margin:4px 0}
.hero__stamp-panel>small{display:block;opacity:.72;margin-bottom:15px}
.hero__stamp-panel>div{display:flex;gap:14px;flex-wrap:wrap}
.hero__stamp-kicker{font-size:.55rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase;color:var(--mustard)}

/* ---------- Links should all feel designed, not forgotten ---------- */
.mini-link,.footer-link,.return-link{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:8px;
  width:max-content;
  max-width:100%;
  font-size:.68rem;
  font-weight:900;
  letter-spacing:.1em;
  text-transform:uppercase;
}
.mini-link::before,.footer-link::before,.return-link::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-5px;
  height:1px;
  background:currentColor;
  transform-origin:right;
  transform:scaleX(.24);
  opacity:.45;
  transition:transform .28s ease,opacity .28s ease;
}
.mini-link:hover::before,.mini-link:focus-visible::before,.footer-link:hover::before,.footer-link:focus-visible::before,.return-link:hover::before,.return-link:focus-visible::before{transform-origin:left;transform:scaleX(1);opacity:1}
.mini-link i,.footer-link i,.return-link i{font-style:normal;transition:transform .24s ease}
.mini-link:hover i,.mini-link:focus-visible i,.footer-link:hover i,.footer-link:focus-visible i{transform:translate(2px,-2px)}
.return-link{margin-top:46px;padding:13px 18px;border:1px solid rgba(23,19,18,.24);border-radius:999px;background:rgba(255,255,255,.36)}
.return-link::before{display:none}
.return-link:hover,.return-link:focus-visible{background:var(--mustard);border-color:var(--mustard)}
.return-link:hover i,.return-link:focus-visible i{transform:translateY(-4px)}
.last-word>a{margin-top:46px;border-bottom:0;padding-bottom:13px;font-size:.68rem}
.footer__links a{text-decoration:none;text-underline-offset:0}
.footer-link::before{bottom:-4px}
.contact-grid a{position:relative;transition:padding-left .25s ease,background .25s ease}
.contact-grid a:hover,.contact-grid a:focus-visible{padding-left:12px;background:linear-gradient(90deg,rgba(230,189,42,.2),transparent 72%)}
.contact-grid strong i{font-style:normal;display:inline-block;transition:transform .24s ease}
.contact-grid a:hover strong i,.contact-grid a:focus-visible strong i{transform:translate(3px,-3px)}
.legal-header>a:last-child,.legal-footer a{position:relative;font-weight:850;letter-spacing:.06em;text-transform:uppercase;font-size:.68rem}
.legal-header>a:last-child::after,.legal-footer a::after{content:" ↗";display:inline-block;transition:transform .22s ease}
.legal-header>a:last-child:hover::after,.legal-header>a:last-child:focus-visible::after,.legal-footer a:hover::after,.legal-footer a:focus-visible::after{transform:translate(2px,-2px)}
.legal-footer a{border-bottom:1px solid rgba(255,255,255,.28);padding-bottom:4px}

@media (max-width:1160px){
  .where-track{left:50%;top:auto;bottom:12px;width:min(560px,calc(100% - 24px));transform:translateX(-50%);grid-template-columns:auto auto 1fr auto;border-radius:22px;padding:8px 12px;gap:12px;background:rgba(23,19,18,.88)}
  .where-track__eyebrow{writing-mode:horizontal-tb;transform:none;font-size:.48rem;white-space:nowrap}
  .where-track__current{width:auto;grid-template-columns:auto auto;align-items:center;gap:7px;justify-items:start;padding:0}
  .where-track__current b{font-size:1.1rem}.where-track__current span{max-width:none;white-space:nowrap;font-size:.5rem}
  .where-track__meter{width:100%;height:2px}.where-track__meter i{height:100%!important;width:var(--where-progress,0%);bottom:0;right:auto;transition:width .12s linear}
  .where-track__dots{display:flex;gap:6px}.where-track__dots a{width:6px;height:6px}
  .where-track.is-on-light{background:rgba(255,249,239,.94)}
  .home-page{padding-bottom:58px}
  .hero__stamp{right:28px}.hero__badge{width:110px;height:110px}.hero__badge b{font-size:2.7rem}.hero__badge em{bottom:8px;font-size:.4rem}
}

@media (max-width:620px){
  .where-track{bottom:7px;width:calc(100% - 14px);grid-template-columns:auto 1fr auto;padding:8px 10px;gap:9px;border-radius:18px}
  .where-track__eyebrow{display:none}.where-track__meter{grid-column:2}.where-track__current{grid-column:1}.where-track__dots{grid-column:3}.where-track__dots a:nth-child(even){display:none}
  .home-page{padding-bottom:54px}
  .hero__stamp{right:16px;top:92px;bottom:auto}.hero__badge{width:86px;height:86px}.hero__badge b{font-size:2.2rem}.hero__badge span,.hero__badge small{font-size:.5rem}.hero__badge em{display:none}
  .hero__stamp-panel{right:0;top:calc(100% + 12px);bottom:auto;width:min(310px,calc(100vw - 32px))}
  .return-link{margin-top:34px}
}

@media (prefers-reduced-motion:reduce){
  .logo-earable::before,.logo-earable::after,.hero__badge,.where-track__meter i,.where-track__dots a,.mini-link::before,.footer-link::before,.return-link,.contact-grid a{transition:none!important}
}
@media (max-width:1160px){
  .amigo-hud{bottom:74px}
  .sound-toast{bottom:78px}
}
@media (max-width:620px){
  .amigo-hud{bottom:66px;right:10px}
  .sound-toast{bottom:66px}
}

/* V4.1 footer signature: keep the reveal readable on narrow screens. */
@media (max-width:620px){
  .footer-credit__text{white-space:normal}
  .footer-credit:hover .footer-credit__text,.footer-credit:focus-visible .footer-credit__text{max-width:190px}
}


/* =========================================================
   V4.1 refinement – quieter navigation, real paw cursor,
   stable hero, clickable gallery, Labrador mark, clean credit
   ========================================================= */

/* The old top progress stripe is intentionally retired. */
.scroll-line{display:none!important}

/* Hero starts at the same scale used by the parallax interaction.
   Pointer movement changes only the CSS variables, so first hover cannot jump. */
.hero__media{
  --hero-x:0px;
  --hero-y:0px;
  transform:translate3d(var(--hero-x),var(--hero-y),0) scale(1.035);
  transform-origin:center;
  transition:transform .18s cubic-bezier(.2,.7,.2,1);
  backface-visibility:hidden;
}

/* ---------- unmistakable paw cursor ---------- */
.cursor{
  --cursor-x:-80px;
  --cursor-y:-80px;
  --paw-scale:1;
  width:31px;
  height:34px;
  display:none!important;
  transform:translate3d(var(--cursor-x),var(--cursor-y),0) rotate(-14deg) scale(var(--paw-scale));
  transform-origin:50% 58%;
  filter:drop-shadow(0 3px 5px rgba(23,19,18,.34));
  transition:filter .18s ease;
}
body.has-paw-cursor .cursor{display:block!important}
body.has-paw-cursor *{cursor:none!important}
.cursor__toe,.cursor__pad{
  background:var(--mustard)!important;
  border:1.6px solid var(--ink)!important;
  box-shadow:inset 0 0 0 1px rgba(255,249,239,.18);
  transition:background .18s ease!important;
}
.cursor__toe{width:7px!important;height:9px!important;border-radius:55% 55% 48% 48%!important}
.cursor__toe--1{left:1px!important;top:12px!important;transform:rotate(-34deg)!important}
.cursor__toe--2{left:7px!important;top:3px!important;transform:rotate(-13deg)!important}
.cursor__toe--3{right:7px!important;top:3px!important;transform:rotate(13deg)!important}
.cursor__toe--4{right:1px!important;top:12px!important;transform:rotate(34deg)!important}
.cursor__pad{
  left:7px!important;
  top:16px!important;
  width:17px!important;
  height:15px!important;
  border-radius:52% 52% 66% 66% / 40% 40% 72% 72%!important;
  transform:none!important;
}
.cursor.is-hover{--paw-scale:1.18;filter:drop-shadow(0 5px 8px rgba(23,19,18,.38))}
.cursor.is-hover .cursor__toe,.cursor.is-hover .cursor__pad{background:var(--coral)!important}
.cursor.is-click{--paw-scale:.82}
.cursor.is-click .cursor__toe,.cursor.is-click .cursor__pad{background:var(--turquoise)!important}

/* ---------- Amigo-Pfad: no bulky capsule, just a fine route ---------- */
.where-track{
  position:fixed;
  left:18px;
  top:50%;
  z-index:79;
  width:78px;
  transform:translateY(-50%);
  display:grid;
  grid-template-columns:48px 22px;
  align-items:center;
  gap:8px;
  padding:0;
  color:var(--white);
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
  opacity:.64;
  transition:opacity .25s ease,color .3s ease;
}
.where-track:hover,.where-track:focus-within{opacity:1}
.where-track.is-on-light{color:var(--ink);background:transparent!important;border-color:transparent!important}
.where-track__current{
  width:48px;
  padding:0 0 8px;
  display:block;
  text-align:right;
  border-radius:0;
  border-bottom:1px solid currentColor;
}
.where-track__current small{
  display:block;
  margin-bottom:5px;
  font-size:.42rem;
  font-weight:900;
  line-height:1;
  letter-spacing:.12em;
  text-transform:uppercase;
  opacity:.48;
}
.where-track__readout{display:flex;flex-direction:column;align-items:flex-end;gap:2px}
.where-track__readout b{font:italic 1.18rem/.9 var(--display);color:var(--mustard)}
.where-track.is-on-light .where-track__readout b{color:var(--coral-deep)}
.where-track__readout>span{max-width:48px;font-size:.48rem;font-weight:900;line-height:1.08;letter-spacing:.07em;text-transform:uppercase;overflow-wrap:anywhere}
.where-track__route{position:relative;width:22px;height:188px}
.where-track__meter{
  --where-progress:0%;
  position:absolute;
  left:50%;
  top:7px;
  bottom:7px;
  width:1px;
  height:auto;
  overflow:visible;
  border-radius:0;
  background:currentColor;
  opacity:.45;
  transform:translateX(-50%);
}
.where-track__meter i{
  position:absolute;
  left:0;
  top:0;
  width:1px;
  height:var(--where-progress);
  background:var(--mustard);
  box-shadow:none;
  transition:height .12s linear,width .12s linear;
}
.where-track.is-on-light .where-track__meter i{background:var(--coral-deep)}
.where-track__meter::after{
  content:"";
  position:absolute;
  left:50%;
  top:clamp(7px,var(--where-progress),calc(100% - 7px));
  width:17px;
  height:17px;
  transform:translate(-50%,-50%) rotate(-12deg);
  background:
    radial-gradient(ellipse at 50% 70%,var(--mustard) 0 26%,transparent 28%),
    radial-gradient(circle at 18% 37%,var(--mustard) 0 11%,transparent 13%),
    radial-gradient(circle at 38% 19%,var(--mustard) 0 11%,transparent 13%),
    radial-gradient(circle at 62% 19%,var(--mustard) 0 11%,transparent 13%),
    radial-gradient(circle at 82% 37%,var(--mustard) 0 11%,transparent 13%);
  filter:drop-shadow(0 2px 3px rgba(0,0,0,.22));
  opacity:1;
  z-index:4;
}
.where-track.is-on-light .where-track__meter::after{
  background:
    radial-gradient(ellipse at 50% 70%,var(--coral-deep) 0 26%,transparent 28%),
    radial-gradient(circle at 18% 37%,var(--coral-deep) 0 11%,transparent 13%),
    radial-gradient(circle at 38% 19%,var(--coral-deep) 0 11%,transparent 13%),
    radial-gradient(circle at 62% 19%,var(--coral-deep) 0 11%,transparent 13%),
    radial-gradient(circle at 82% 37%,var(--coral-deep) 0 11%,transparent 13%);
}
.where-track__dots{
  position:absolute;
  inset:0;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  align-items:center;
  gap:0;
}
.where-track__dots a{
  width:22px;
  height:22px;
  display:grid;
  place-items:center;
  border:0;
  border-radius:0;
  opacity:.5;
  background:transparent!important;
  transform:none!important;
}
.where-track__dots a::before{
  content:"";
  width:6px;
  height:1px;
  border-radius:99px;
  background:currentColor;
  transition:width .2s ease,opacity .2s ease,background .2s ease;
}
.where-track__dots a.is-active::before,.where-track__dots a:hover::before,.where-track__dots a:focus-visible::before{width:16px;background:var(--mustard)}
.where-track.is-on-light .where-track__dots a.is-active::before,.where-track.is-on-light .where-track__dots a:hover::before,.where-track.is-on-light .where-track__dots a:focus-visible::before{background:var(--coral-deep)}

/* ---------- Gallery: drag, swipe AND click all do something ---------- */
.gallery{touch-action:pan-y;overscroll-behavior-inline:contain;scroll-snap-type:x proximity}
.gallery__item{position:relative;scroll-snap-align:center;user-select:none;-webkit-user-select:none;outline:none}
.gallery__item img{pointer-events:none;-webkit-user-drag:none;user-select:none}
.gallery__item::after{
  content:"ansehen ↗";
  position:absolute;
  right:18px;
  top:18px;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(23,19,18,.72);
  color:var(--white);
  font-size:.52rem;
  font-weight:900;
  letter-spacing:.1em;
  text-transform:uppercase;
  opacity:0;
  transform:translateY(5px);
  transition:opacity .2s ease,transform .2s ease;
  pointer-events:none;
}
.gallery__item:hover::after,.gallery__item:focus-visible::after{opacity:1;transform:none}
.gallery__item:focus-visible{outline:3px solid var(--coral-deep);outline-offset:5px;border-radius:22px}
.gallery.is-dragging .gallery__item::after{opacity:0}
.gallery-lightbox{
  width:min(1120px,calc(100vw - 40px));
  max-width:none;
  max-height:calc(100svh - 40px);
  padding:0;
  border:0;
  border-radius:26px;
  overflow:hidden;
  background:var(--ink);
  color:var(--white);
  box-shadow:0 40px 120px rgba(0,0,0,.48);
}
.gallery-lightbox::backdrop{background:rgba(12,9,8,.76);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.gallery-lightbox figure{margin:0;display:grid;grid-template-rows:minmax(0,1fr) auto;max-height:calc(100svh - 40px)}
.gallery-lightbox img{width:100%;height:min(76svh,760px);object-fit:contain;background:#0d0b0a}
.gallery-lightbox figcaption{padding:14px 76px 18px;text-align:center;font:italic 1.05rem var(--display);color:rgba(255,255,255,.78)}
.gallery-lightbox__close,.gallery-lightbox__nav{
  position:absolute;
  z-index:3;
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border:1px solid rgba(255,255,255,.34);
  border-radius:50%;
  background:rgba(23,19,18,.7);
  color:var(--white);
  backdrop-filter:blur(10px);
}
.gallery-lightbox__close{right:16px;top:16px;font-size:1.35rem}
.gallery-lightbox__nav{top:50%;transform:translateY(-50%);font-size:1.15rem}
.gallery-lightbox__nav--prev{left:16px}.gallery-lightbox__nav--next{right:16px}

/* ---------- Amigo mark base ---------- */
.logo-earable{position:relative}
.hero__badge{overflow:visible}
.hero__badge span,.hero__badge b,.hero__badge small,.hero__badge em{position:relative;z-index:2}

/* The old yellow A pin on the OPEN image had no clear purpose. */
.find__pin{display:none!important}

/* ---------- Closing statement ---------- */
.last-word__line{display:block;white-space:nowrap}
.last-word h2 em{display:block}

/* ---------- Christian Pohler credit: its own quiet line BELOW the footer ---------- */
.footer__meta{gap:0}
.footer-credit{display:none!important}
.maker-strip{
  min-height:48px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:9px 20px 12px;
  background:#100e0d;
  color:var(--cream);
  border-top:1px solid rgba(255,255,255,.06);
}
.maker-signature{
  min-height:30px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  color:inherit;
  font:italic .7rem/1.1 var(--display);
  letter-spacing:.035em;
  opacity:.58;
  transition:opacity .25s ease;
}
.maker-signature:hover,.maker-signature:focus-visible,.maker-signature.is-revealed{opacity:1}
.maker-signature__riddle{position:relative;width:27px;height:22px;display:block;transition:transform .32s ease}
.maker-signature__riddle i{position:absolute;width:5px;height:6px;border-radius:55%;background:var(--mustard);transform:rotate(-15deg)}
.maker-signature__riddle i:nth-child(1){left:1px;top:8px}.maker-signature__riddle i:nth-child(2){left:7px;top:1px}.maker-signature__riddle i:nth-child(3){left:14px;top:1px}.maker-signature__riddle i:nth-child(4){left:19px;top:8px}
.maker-signature__riddle::after{content:"";position:absolute;left:7px;top:10px;width:13px;height:10px;border-radius:55% 55% 70% 70%;background:var(--mustard);transform:rotate(-15deg)}
.maker-signature__text{
  display:block;
  max-width:0;
  overflow:hidden;
  white-space:nowrap;
  opacity:0;
  filter:blur(4px);
  transform:translateX(-6px);
  transition:max-width .48s cubic-bezier(.2,.8,.2,1),opacity .28s ease,filter .28s ease,transform .36s ease;
}
.maker-signature:hover .maker-signature__text,.maker-signature:focus-visible .maker-signature__text,.maker-signature.is-revealed .maker-signature__text{max-width:250px;opacity:.86;filter:none;transform:none}
.maker-signature:hover .maker-signature__riddle,.maker-signature:focus-visible .maker-signature__riddle,.maker-signature.is-revealed .maker-signature__riddle{transform:rotate(15deg) translateY(-1px)}

@media (max-width:1160px){
  .where-track{
    left:14px;
    right:14px;
    top:auto;
    bottom:10px;
    width:auto;
    transform:none;
    grid-template-columns:auto 1fr;
    gap:12px;
    align-items:center;
    opacity:.86;
  }
  .where-track__current{
    width:auto;
    min-width:82px;
    padding:6px 8px 7px;
    text-align:left;
    border:0;
    border-radius:2px 9px 2px 9px;
    background:rgba(23,19,18,.72);
    color:var(--white);
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
  }
  .where-track.is-on-light .where-track__current{background:rgba(255,249,239,.82);color:var(--ink)}
  .where-track__current small{display:none}
  .where-track__readout{flex-direction:row;align-items:center;gap:7px}
  .where-track__readout b{font-size:1rem}.where-track__readout>span{max-width:none;white-space:nowrap;font-size:.48rem}
  .where-track__route{width:100%;height:26px}
  .where-track__meter{left:7px;right:7px;top:50%;bottom:auto;width:auto;height:1px;transform:translateY(-50%)}
  .where-track__meter i{left:0;top:0;height:1px!important;width:var(--where-progress);transition:width .12s linear}
  .where-track__meter::after{left:clamp(7px,var(--where-progress),calc(100% - 7px));top:50%;transform:translate(-50%,-50%) rotate(-12deg)}
  .where-track__dots{flex-direction:row;inset:2px 0;justify-content:space-between}
  .where-track__dots a{width:24px;height:22px}
  .where-track__dots a::before{width:5px}.where-track__dots a.is-active::before,.where-track__dots a:hover::before,.where-track__dots a:focus-visible::before{width:13px}
  .home-page{padding-bottom:50px}
}

@media (max-width:620px){
  .where-track{left:8px;right:8px;bottom:7px;gap:7px}
  .where-track__current{min-width:68px;padding:5px 7px 6px}
  .where-track__readout b{font-size:.9rem}.where-track__readout>span{font-size:.43rem}
  .where-track__dots a{width:20px}
  .gallery-lightbox{width:calc(100vw - 18px);max-height:calc(100svh - 18px);border-radius:18px}
  .gallery-lightbox img{height:72svh}.gallery-lightbox figcaption{padding:12px 58px 15px;font-size:.9rem}
  .gallery-lightbox__close,.gallery-lightbox__nav{width:40px;height:40px}.gallery-lightbox__close{right:10px;top:10px}.gallery-lightbox__nav--prev{left:9px}.gallery-lightbox__nav--next{right:9px}
  .last-word h2{font-size:clamp(2.35rem,9.5vw,3.4rem);letter-spacing:-.065em}
  .last-word__line{white-space:nowrap}
  .maker-strip{min-height:44px;padding-top:8px;padding-bottom:10px}
  .maker-signature{font-size:.64rem}
}

@media (prefers-reduced-motion:reduce){
  .hero__media,.cursor,.where-track__meter i,.where-track__meter::after,.amigo-head-svg,.maker-signature__text,.maker-signature__riddle{transition:none!important}
}
.where-track.is-at-footer{opacity:0!important;pointer-events:none;visibility:hidden}


/* =========================================================
   V4.1 refinement 2 – Labrador outline, subtler discoveries,
   softer maker reveal and consent UI
   ========================================================= */

/* Cursor: middle toes sit closer to the main pad. */
.cursor__toe--2{left:8px!important;top:6px!important}
.cursor__toe--3{right:8px!important;top:6px!important}

/* Easter eggs: no circles, no pulse. Just tiny, integrated paw marks. */
.sniff-spot{
  width:18px!important;
  height:19px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  opacity:0!important;
  visibility:hidden;
  pointer-events:none;
  transform:rotate(-17deg);
  transition:opacity .28s ease,transform .28s ease!important;
}
.sniff-spot span{display:none!important}
.sniff-spot::before{
  content:"";
  position:absolute;
  inset:0;
  background:
    radial-gradient(ellipse at 50% 72%,currentColor 0 25%,transparent 27%),
    radial-gradient(ellipse at 16% 35%,currentColor 0 10%,transparent 12%),
    radial-gradient(ellipse at 38% 17%,currentColor 0 10%,transparent 12%),
    radial-gradient(ellipse at 62% 17%,currentColor 0 10%,transparent 12%),
    radial-gradient(ellipse at 84% 35%,currentColor 0 10%,transparent 12%);
}
.amigo-mode .sniff-spot{
  opacity:.15!important;
  visibility:visible;
  pointer-events:auto;
  animation:none!important;
}
.amigo-mode .sniff-spot:hover,.amigo-mode .sniff-spot:focus-visible{opacity:.62!important;transform:rotate(-17deg) scale(1.08)}
.sniff-spot.is-found{opacity:0!important;pointer-events:none!important;visibility:hidden!important}
.sniff-spot--one{right:5.5%!important;top:10%!important;color:var(--coral-deep)}
.sniff-spot--two{right:2.2%!important;bottom:5.2%!important;color:var(--mustard)}
.find__visual .sniff-spot--three{left:5.5%!important;bottom:8%!important;top:auto!important;color:var(--mustard)}
.amigo-hud{opacity:.9}

/* Maker signature: same footer colour and a deliberately slow reveal. */
.maker-strip{
  background:var(--coral)!important;
  color:var(--ink)!important;
  border-top:1px solid rgba(23,19,18,.12)!important;
}
.maker-signature{opacity:.48;transition:opacity .65s ease}
.maker-signature__riddle i,.maker-signature__riddle::after{background:var(--ink)!important}
.maker-signature__riddle{transition:transform .8s cubic-bezier(.2,.8,.2,1)!important}
.maker-signature__text{
  transition:max-width 1.05s cubic-bezier(.2,.8,.2,1),opacity .72s ease .12s,filter .72s ease .12s,transform .82s ease!important;
}
.maker-signature:hover .maker-signature__text,.maker-signature:focus-visible .maker-signature__text,.maker-signature.is-revealed .maker-signature__text{max-width:250px}

/* Cookie / consent controls */
.cookie-settings-link{
  appearance:none;
  border:0;
  background:transparent;
  color:inherit;
  font:inherit;
  letter-spacing:inherit;
  text-transform:inherit;
  padding:0;
}
.legal-footer button[data-cookie-settings]{
  appearance:none;border:0;background:transparent;color:inherit;font:inherit;font-weight:850;letter-spacing:.06em;text-transform:uppercase;font-size:.68rem;padding:0;border-bottom:1px solid rgba(255,255,255,.28);padding-bottom:4px;
}
.consent-banner{
  position:fixed;
  left:clamp(12px,3vw,34px);
  right:clamp(12px,3vw,34px);
  bottom:clamp(12px,3vw,30px);
  z-index:200;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:28px;
  align-items:end;
  padding:clamp(22px,3vw,34px);
  border:1px solid rgba(23,19,18,.15);
  border-radius:24px 8px 24px 8px;
  background:rgba(255,249,239,.96);
  color:var(--ink);
  box-shadow:0 28px 90px rgba(23,19,18,.24);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}
.consent-banner[hidden]{display:none!important}
.consent-banner__copy{max-width:760px}
.consent-banner__eyebrow{display:block;margin-bottom:7px;font-size:.58rem;font-weight:900;letter-spacing:.13em;text-transform:uppercase;color:var(--coral-deep)}
.consent-banner h2,.consent-dialog h2{margin:0;font:italic clamp(2rem,4vw,3.8rem)/.9 var(--display);letter-spacing:-.045em}
.consent-banner p,.consent-dialog>p{margin:12px 0 0;max-width:760px;font-size:.86rem;line-height:1.55;color:rgba(23,19,18,.72)}
.consent-banner__actions,.consent-dialog__actions{display:flex;flex-wrap:wrap;gap:9px;justify-content:flex-end}
.consent-choice{
  min-height:44px;
  border:1px solid rgba(23,19,18,.36);
  border-radius:999px;
  background:transparent;
  color:var(--ink);
  padding:10px 15px;
  font-size:.64rem;
  font-weight:900;
  letter-spacing:.09em;
  text-transform:uppercase;
}
.consent-choice--accent{background:var(--mustard);border-color:var(--mustard)}
.consent-choice:hover,.consent-choice:focus-visible{transform:translateY(-1px);box-shadow:0 8px 24px rgba(23,19,18,.12)}
.consent-dialog{
  width:min(680px,calc(100vw - 28px));
  max-width:none;
  border:0;
  border-radius:28px 9px 28px 9px;
  padding:clamp(28px,5vw,52px);
  background:var(--paper);
  color:var(--ink);
  box-shadow:0 40px 120px rgba(0,0,0,.34);
}
.consent-dialog::backdrop{background:rgba(23,19,18,.7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.consent-dialog__close{position:absolute;right:16px;top:16px;width:44px;height:44px;border:1px solid rgba(23,19,18,.2);border-radius:50%;background:transparent;font-size:1.25rem}
.consent-options{display:grid;gap:10px;margin:28px 0}
.consent-option{display:grid;grid-template-columns:1fr auto;gap:20px;align-items:center;padding:16px 0;border-top:1px solid rgba(23,19,18,.12)}
.consent-option:last-child{border-bottom:1px solid rgba(23,19,18,.12)}
.consent-option strong{display:block;font-size:.84rem}
.consent-option small{display:block;margin-top:4px;color:rgba(23,19,18,.62);line-height:1.4}
.consent-option input{width:22px;height:22px;accent-color:var(--coral-deep)}
.consent-dialog__privacy{display:inline-block;margin-top:18px;font-size:.68rem;font-weight:800;text-underline-offset:4px}
@media(max-width:760px){
  .consent-banner{grid-template-columns:1fr;gap:18px;border-radius:20px 7px 20px 7px}
  .consent-banner__actions,.consent-dialog__actions{justify-content:flex-start}
  .consent-choice{flex:1 1 auto}
}
@media(prefers-reduced-motion:reduce){
  .amigo-outline-svg,.sniff-spot,.maker-signature,.maker-signature__text,.maker-signature__riddle,.consent-choice{transition:none!important}
}
/* Consent choice parity: accept and reject are intentionally equally prominent. */
.consent-choice[data-consent-essential],
.consent-choice[data-consent-dialog-essential],
.consent-choice--accent{background:var(--mustard);border-color:var(--mustard)}

/* =========================================================
   V4.3 – Amigo outline silhouette + corrected paw geometry
   ========================================================= */

/* The old pseudo-ear construction is retired globally. */
.logo-earable::before,.logo-earable::after{content:none!important;display:none!important}

/* Paw cursor: the two middle toes deliberately nest into the large pad. */
.cursor__toe--2{left:8px!important;top:9px!important}
.cursor__toe--3{right:8px!important;top:9px!important}

/* One coherent line-mark for every Amigo Mode logo. */
.logo-earable .amigo-outline-svg{
  position:absolute;
  left:50%;
  top:50%;
  width:156%;
  height:156%;
  overflow:visible;
  opacity:0;
  pointer-events:none;
  transform:translate(-50%,-50%) scale(.74);
  transform-origin:center;
  transition:opacity .25s ease,transform .52s cubic-bezier(.18,.82,.2,1),color .3s ease;
  color:currentColor;
  z-index:5;
}
.logo-earable .amigo-outline-svg path{
  fill:none!important;
  stroke:currentColor!important;
  stroke-width:2.75!important;
  stroke-linecap:round!important;
  stroke-linejoin:round!important;
  vector-effect:non-scaling-stroke;
}
.logo-earable .amigo-outline-svg__detail{stroke-width:2.25!important}

body.amigo-mode .logo-earable:not(.hero__badge){
  color:var(--ink)!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  overflow:visible!important;
}
body.amigo-mode .logo-earable:not(.hero__badge)>span,
body.amigo-mode .logo-earable:not(.hero__badge)>i{opacity:0!important}
body.amigo-mode .logo-earable:not(.hero__badge) .amigo-outline-svg{
  opacity:1!important;
  transform:translate(-50%,-50%) scale(1)!important;
}
body.amigo-mode .intro__mark{color:var(--mustard)!important}
body.amigo-mode .reward-dialog__paw,
body.amigo-mode .error-mark{color:var(--ink)!important}

/* The address badge is no longer a circle with attached ears. In Amigo Mode
   the same hanging-ear head contour becomes the visual frame. */
body.amigo-mode .hero__badge{
  color:var(--ink)!important;
  background:rgba(255,249,239,.86)!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:0 18px 54px rgba(0,0,0,.16)!important;
  overflow:visible!important;
}
body.amigo-mode .hero__badge .amigo-outline-svg{
  width:150%!important;
  height:150%!important;
  opacity:1!important;
  transform:translate(-50%,-50%) scale(1)!important;
  color:currentColor!important;
}
/* Keep the location text legible; face details would compete with the 23. */
body.amigo-mode .hero__badge .amigo-outline-svg__detail{display:none!important}
body.amigo-mode .hero__badge[aria-expanded="true"]{
  background:rgba(244,198,55,.92)!important;
  color:var(--ink)!important;
}
body.amigo-mode .hero__badge span,
body.amigo-mode .hero__badge b,
body.amigo-mode .hero__badge small,
body.amigo-mode .hero__badge em{color:currentColor!important}

/* =========================================================
   V4.4 – continuous ribbon, reliable gallery, adaptive tracker,
   accessibility controls, compact consent UI and paw refinement
   ========================================================= */

/* Paw cursor: halfway between the previous and over-tight middle-toe positions. */
.cursor__toe--2{left:8px!important;top:7.5px!important}
.cursor__toe--3{right:8px!important;top:7.5px!important}

/* ---------- Continuous origin ribbon: two equal, very long groups ---------- */
.word-ribbon{overflow:hidden;white-space:nowrap}
.word-ribbon>.word-ribbon__track{
  display:flex;
  width:max-content;
  padding:0;
  animation:amigosRibbonLoop 42s linear infinite;
  will-change:transform;
}
.word-ribbon>.word-ribbon__track::after{content:none!important;display:none!important}
.word-ribbon__group{
  display:block;
  flex:none;
  padding:15px 0;
  font-size:.68rem;
  font-weight:950;
  letter-spacing:.18em;
  white-space:nowrap;
}
@keyframes amigosRibbonLoop{to{transform:translate3d(-50%,0,0)}}

/* ---------- Gallery: 1–4 visible cards, always horizontally scrollable ---------- */
.gallery{
  gap:18px!important;
  padding-right:clamp(20px,6vw,90px)!important;
  scroll-padding-inline:clamp(20px,6vw,90px);
  -webkit-overflow-scrolling:touch;
  touch-action:pan-y;
  overscroll-behavior-inline:contain;
  scroll-snap-type:x proximity!important;
}
.gallery.is-dragging{scroll-snap-type:none!important;user-select:none}
.gallery__item{
  flex:0 0 clamp(270px,24vw,360px)!important;
  scroll-snap-align:start!important;
  margin:0!important;
}
.gallery__item--wide{flex-basis:clamp(270px,24vw,360px)!important}
.gallery__item::after{content:none!important;display:none!important}
.gallery__media{
  position:relative;
  display:block;
  width:100%;
  padding:0;
  border:0;
  border-radius:var(--radius);
  overflow:hidden;
  background:var(--cream);
  box-shadow:var(--shadow);
  color:inherit;
  text-align:left;
}
.gallery__media img{
  width:100%!important;
  height:clamp(390px,39vw,560px)!important;
  object-fit:cover!important;
  border-radius:0!important;
  box-shadow:none!important;
  pointer-events:none!important;
  transition:transform .55s cubic-bezier(.2,.8,.2,1),filter .35s ease;
}
.gallery__view{
  position:absolute;
  right:14px;
  top:14px;
  padding:7px 10px;
  border-radius:999px;
  background:rgba(23,19,18,.74);
  color:var(--white);
  font-size:.52rem;
  font-weight:900;
  letter-spacing:.1em;
  text-transform:uppercase;
  opacity:0;
  transform:translateY(5px);
  transition:opacity .22s ease,transform .22s ease;
  pointer-events:none;
}
.gallery__media:hover img,.gallery__media:focus-visible img{transform:scale(1.018);filter:saturate(1.03)}
.gallery__media:hover .gallery__view,.gallery__media:focus-visible .gallery__view{opacity:1;transform:none}
.gallery__media:focus-visible{outline:3px solid var(--coral-deep);outline-offset:4px}
.gallery.is-dragging .gallery__view{opacity:0!important}
.gallery.is-dragging .gallery__media img{transform:none!important}
.gallery-toolbar span b{font-weight:950;color:var(--coral-deep)}

@media(min-width:1500px){
  .gallery__item{flex-basis:clamp(290px,22vw,350px)!important}
}
@media(max-width:900px){
  .gallery__item{flex-basis:min(72vw,360px)!important}
}
@media(max-width:620px){
  .gallery{gap:14px!important}
  .gallery__item{flex-basis:min(82vw,330px)!important}
  .gallery__media img{height:440px!important}
}

/* Cross-browser custom lightbox rather than depending on <dialog>. */
.gallery-lightbox{
  position:fixed!important;
  inset:0!important;
  z-index:300!important;
  width:auto!important;
  max-width:none!important;
  max-height:none!important;
  padding:20px!important;
  border:0!important;
  border-radius:0!important;
  display:grid!important;
  place-items:center;
  background:rgba(12,9,8,.80)!important;
  color:var(--white);
  overflow:auto!important;
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
}
.gallery-lightbox[hidden]{display:none!important}
.gallery-lightbox__panel{
  position:relative;
  width:min(1120px,calc(100vw - 40px));
  max-height:calc(100svh - 40px);
  overflow:hidden;
  border-radius:26px;
  background:var(--ink);
  box-shadow:0 40px 120px rgba(0,0,0,.52);
}
.gallery-lightbox::backdrop{display:none!important}
.gallery-lightbox figure{margin:0;display:grid;grid-template-rows:minmax(0,1fr) auto;max-height:calc(100svh - 40px)}
.gallery-lightbox img{width:100%;height:min(76svh,760px);object-fit:contain;background:#0d0b0a}
.gallery-lightbox figcaption{padding:14px 76px 18px;text-align:center;font:italic 1.05rem var(--display);color:rgba(255,255,255,.78)}

/* ---------- Adaptive Amigo path ---------- */
.where-track{
  --track-fg:var(--white);
  --track-accent:var(--mustard);
  --track-shadow:rgba(0,0,0,.38);
  color:var(--track-fg)!important;
  filter:drop-shadow(0 1px 2px var(--track-shadow));
  transition:opacity .25s ease,color .35s ease,filter .35s ease!important;
}
.where-track[data-tone="light"]{
  --track-fg:var(--ink);
  --track-accent:var(--coral-deep);
  --track-shadow:rgba(255,249,239,.72);
}
.where-track[data-tone="dark"]{
  --track-fg:var(--white);
  --track-accent:var(--mustard);
  --track-shadow:rgba(0,0,0,.52);
}
.where-track__readout b,
.where-track__meter i,
.where-track__dots a.is-active::before,
.where-track__dots a:hover::before,
.where-track__dots a:focus-visible::before{color:var(--track-accent)!important;background:var(--track-accent)!important}
.where-track__meter::after{
  background:
    radial-gradient(ellipse at 50% 70%,var(--track-accent) 0 26%,transparent 28%),
    radial-gradient(circle at 18% 37%,var(--track-accent) 0 11%,transparent 13%),
    radial-gradient(circle at 38% 19%,var(--track-accent) 0 11%,transparent 13%),
    radial-gradient(circle at 62% 19%,var(--track-accent) 0 11%,transparent 13%),
    radial-gradient(circle at 82% 37%,var(--track-accent) 0 11%,transparent 13%)!important;
}

/* ---------- Accessibility display controls ---------- */
body{font-size:1rem}
html.a11y-font-large{font-size:112.5%}
html.a11y-font-xl{font-size:125%}
html.a11y-high-contrast{
  --ink:#000;
  --paper:#fffdf7;
  --cream:#fff6e7;
  --coral-deep:#8a2d1f;
  --sage-deep:#344033;
}
html.a11y-high-contrast :where(a,button,input,[tabindex]):focus-visible{outline:3px solid #000!important;outline-offset:4px!important}
html.a11y-high-contrast .site-header.is-scrolled,
html.a11y-high-contrast .consent-banner,
html.a11y-high-contrast .a11y-panel{background:#fffdf7!important;color:#000!important;border-color:#000!important}
html.a11y-reduce-motion{scroll-behavior:auto!important}
html.a11y-reduce-motion *,html.a11y-reduce-motion *::before,html.a11y-reduce-motion *::after{
  animation-duration:.001ms!important;
  animation-iteration-count:1!important;
  transition-duration:.001ms!important;
  scroll-behavior:auto!important;
}

.a11y-tools{position:fixed;left:14px;bottom:16px;z-index:190;font-family:var(--sans)}
.a11y-launcher{
  width:44px;height:44px;border:1px solid rgba(23,19,18,.24);border-radius:50%;
  background:rgba(255,249,239,.92);color:var(--ink);display:grid;place-items:center;
  box-shadow:0 10px 28px rgba(23,19,18,.16);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  font-weight:900;font-size:.76rem;letter-spacing:-.04em;
}
.a11y-launcher[aria-expanded="true"]{background:var(--mustard);border-color:var(--mustard)}
.a11y-panel{
  position:absolute;left:0;bottom:54px;width:min(286px,calc(100vw - 28px));padding:16px;
  border:1px solid rgba(23,19,18,.15);border-radius:20px 8px 20px 8px;
  background:rgba(255,249,239,.97);color:var(--ink);box-shadow:0 24px 70px rgba(23,19,18,.24);
  backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)
}
.a11y-panel[hidden]{display:none!important}
.a11y-panel__head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid rgba(23,19,18,.12)}
.a11y-panel__head span{font:italic 1.25rem var(--display)}
.a11y-panel__head small{font-size:.56rem;text-transform:uppercase;letter-spacing:.1em;opacity:.58}
.a11y-option{width:100%;min-height:44px;padding:10px 0;border:0;border-bottom:1px solid rgba(23,19,18,.1);background:transparent;color:inherit;display:flex;justify-content:space-between;gap:16px;text-align:left}
.a11y-option span{font-size:.7rem;font-weight:850;text-transform:uppercase;letter-spacing:.08em}
.a11y-option b{font-size:.68rem;color:var(--coral-deep)}
.a11y-option[aria-pressed="true"] b{color:var(--ink);background:var(--mustard);border-radius:999px;padding:2px 7px}
.a11y-reset{margin-top:12px;border:0;background:transparent;color:inherit;padding:3px 0;font-size:.58rem;font-weight:850;letter-spacing:.09em;text-transform:uppercase;opacity:.58;border-bottom:1px solid currentColor}
@media(max-width:760px){.a11y-tools{bottom:66px;left:10px}.a11y-panel{bottom:52px}}

/* ---------- Compact, quieter consent card ---------- */
.consent-banner{
  left:auto!important;
  right:clamp(10px,2vw,22px)!important;
  bottom:clamp(10px,2vw,22px)!important;
  width:min(540px,calc(100vw - 20px))!important;
  grid-template-columns:1fr!important;
  gap:15px!important;
  align-items:stretch!important;
  padding:20px!important;
  border-radius:22px 8px 22px 8px!important;
  box-shadow:0 22px 70px rgba(23,19,18,.22)!important;
}
.consent-banner__copy{max-width:none!important}
.consent-banner h2{font-size:clamp(1.7rem,3.4vw,2.5rem)!important;line-height:.94!important}
.consent-banner p{margin-top:9px!important;font-size:.78rem!important;line-height:1.48!important}
.consent-banner__actions{justify-content:flex-start!important;gap:7px!important}
.consent-banner .consent-choice{min-height:40px;padding:8px 11px;font-size:.58rem}
@media(max-width:560px){
  .consent-banner{right:10px!important;bottom:10px!important;width:calc(100vw - 20px)!important;padding:17px!important}
  .consent-banner__actions{display:grid!important;grid-template-columns:1fr 1fr!important}
  .consent-banner .consent-choice:last-child{grid-column:1/-1}
}

@media(prefers-reduced-motion:reduce){
  .word-ribbon>.word-ribbon__track{animation:none!important}
}
/* Final gallery sizing guard: intrinsic images must not enlarge flex cards. */
.gallery__item{
  flex:0 0 clamp(280px,24vw,960px)!important;
  width:clamp(280px,24vw,960px)!important;
  min-width:0!important;
  max-width:none!important;
}
.gallery__media{min-width:0!important;max-width:100%!important}
@media(max-width:900px){
  .gallery__item{flex-basis:min(72vw,360px)!important;width:min(72vw,360px)!important}
}
@media(max-width:620px){
  .gallery__item{flex-basis:min(82vw,330px)!important;width:min(82vw,330px)!important}
}

/* =========================================================
   V4.5 – discoverable three-trace Easter-egg hunt
   ========================================================= */

/* The counter is part of Amigo Mode again and stays visible while the mode is on. */
.amigo-hud{
  right:16px!important;
  bottom:18px!important;
  min-width:116px;
  padding:9px 12px!important;
  border-radius:14px!important;
  background:rgba(23,19,18,.82)!important;
  border:1px solid rgba(244,198,55,.30)!important;
  box-shadow:0 10px 34px rgba(0,0,0,.16)!important;
  backdrop-filter:blur(14px) saturate(1.08)!important;
  -webkit-backdrop-filter:blur(14px) saturate(1.08)!important;
  opacity:.94!important;
  transition:transform .3s ease,background .3s ease,border-color .3s ease!important;
}
.amigo-hud span{font-size:.54rem;letter-spacing:.14em;color:var(--mustard)!important}
.amigo-hud b{display:block;margin-top:2px;font-size:.72rem;letter-spacing:.08em}
.amigo-hud.is-updated{transform:translateY(-3px) scale(1.035);background:rgba(23,19,18,.94)!important;border-color:rgba(244,198,55,.72)!important}
body:not(.amigo-mode) .amigo-hud{display:none!important}

/* The actual button is 44x44px, but only a small paw is drawn inside it.
   This keeps the clues hidden enough while making the first click/tap reliable. */
.sniff-spot{
  width:44px!important;
  height:44px!important;
  margin:-11px!important;
  padding:0!important;
  border:0!important;
  border-radius:50%!important;
  background:transparent!important;
  box-shadow:none!important;
  opacity:0!important;
  visibility:hidden!important;
  pointer-events:none!important;
  transform:rotate(-14deg)!important;
  z-index:24!important;
  cursor:pointer!important;
  touch-action:manipulation!important;
  -webkit-tap-highlight-color:transparent;
  transition:opacity .25s ease,transform .25s ease!important;
}
.sniff-spot::before{
  content:""!important;
  position:absolute!important;
  width:23px!important;
  height:24px!important;
  left:50%!important;
  top:50%!important;
  inset:auto!important;
  transform:translate(-50%,-50%)!important;
  background:
    radial-gradient(ellipse at 50% 72%,currentColor 0 26%,transparent 28%),
    radial-gradient(ellipse at 16% 35%,currentColor 0 11%,transparent 13%),
    radial-gradient(ellipse at 38% 18%,currentColor 0 11%,transparent 13%),
    radial-gradient(ellipse at 62% 18%,currentColor 0 11%,transparent 13%),
    radial-gradient(ellipse at 84% 35%,currentColor 0 11%,transparent 13%)!important;
  filter:drop-shadow(0 1px 0 rgba(255,255,255,.16));
}
.amigo-mode .sniff-spot{
  opacity:.46!important;
  visibility:visible!important;
  pointer-events:auto!important;
  animation:sniffWhisper 6.8s ease-in-out infinite!important;
}
.amigo-mode .sniff-spot--two{animation-delay:1.9s!important}
.amigo-mode .sniff-spot--three{animation-delay:3.8s!important}
.amigo-mode .sniff-spot:hover,
.amigo-mode .sniff-spot:focus-visible{
  opacity:.88!important;
  transform:rotate(-14deg) scale(1.08)!important;
}
.amigo-mode .sniff-spot:focus-visible{outline:2px solid var(--mustard)!important;outline-offset:-7px!important}
.amigo-mode .sniff-spot.is-found{
  opacity:.72!important;
  visibility:visible!important;
  pointer-events:none!important;
  color:var(--mustard)!important;
  animation:none!important;
  transform:rotate(-14deg) scale(.92)!important;
}
.amigo-mode .sniff-spot.is-found::after{
  content:"✓";
  position:absolute;
  right:1px;
  bottom:1px;
  width:16px;
  height:16px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:var(--ink);
  color:var(--mustard);
  font:900 10px/1 var(--sans);
  box-shadow:0 2px 8px rgba(0,0,0,.2);
}
@keyframes sniffWhisper{
  0%,72%,100%{opacity:.46;transform:rotate(-14deg) scale(1)}
  79%{opacity:.68;transform:rotate(-11deg) scale(1.06)}
  85%{opacity:.50;transform:rotate(-14deg) scale(1)}
}

/* Slightly repositioned so each of the three clues feels integrated rather than UI-like. */
.sniff-spot--one{right:5.2%!important;top:11%!important}
.sniff-spot--two{right:3.3%!important;bottom:7.4%!important}
.find__visual .sniff-spot--three{left:7%!important;bottom:10%!important;top:auto!important}

@media(max-width:760px){
  .amigo-hud{right:10px!important;bottom:72px!important;min-width:108px}
  .amigo-mode .sniff-spot{opacity:.54!important}
}

@media (prefers-reduced-motion:reduce){
  .amigo-mode .sniff-spot{animation:none!important}
  .amigo-hud{transition:none!important}
}
html.a11y-reduce-motion .amigo-mode .sniff-spot{animation:none!important}


/* =========================================================
   V4.5 hotfix – real video/iframe layers must never be covered
   ========================================================= */
.video-frame{
  isolation:isolate;
}
.video-frame::after{
  pointer-events:none!important;
  z-index:1!important;
}
.video-frame>.video-frame__placeholder,
.video-frame>span{
  position:relative;
  z-index:2;
  pointer-events:none;
}
.video-frame video,
.video-frame iframe,
.video-frame embed,
.video-frame object{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  border:0!important;
  border-radius:inherit!important;
  object-fit:cover!important;
  z-index:10!important;
  pointer-events:auto!important;
  background:#000;
}
/* Once real media exists, the decorative sweep/play placeholder disappears. */
.video-frame:has(video)::after,
.video-frame:has(iframe)::after,
.video-frame:has(embed)::after,
.video-frame:has(object)::after,
.video-frame:has(video)>.video-frame__placeholder,
.video-frame:has(iframe)>.video-frame__placeholder,
.video-frame:has(embed)>.video-frame__placeholder,
.video-frame:has(object)>.video-frame__placeholder{
  display:none!important;
}
/* Fallback class for a manually embedded player in case :has() is unavailable. */
.video-frame.has-media::after,
.video-frame.has-media>.video-frame__placeholder{display:none!important}
.video-frame.has-media video,
.video-frame.has-media iframe,
.video-frame.has-media embed,
.video-frame.has-media object{z-index:10!important}


/* =========================================================
   V4.6 – gallery click guarantee + stable paw geometry
   ========================================================= */

/* Cursor: middle toes sit between the original wide gap and V4.5's too-tight position. */
.cursor__toe--2{left:8px!important;top:6.2px!important}
.cursor__toe--3{right:8px!important;top:6.2px!important}

/* Paw trail is one single masked shape. Toes and pad can no longer drift apart. */
.paw{
  width:22px!important;
  height:24px!important;
  background:var(--coral)!important;
  -webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox='0 0 36 38'%3E%3Cellipse cx='18' cy='27' rx='10' ry='9'%2F%3E%3Cellipse cx='5.8' cy='14.6' rx='4.0' ry='5.2' transform='rotate(-28 5.8 14.6)'%2F%3E%3Cellipse cx='13.1' cy='8.3' rx='4.1' ry='5.5' transform='rotate(-10 13.1 8.3)'%2F%3E%3Cellipse cx='22.9' cy='8.3' rx='4.1' ry='5.5' transform='rotate(10 22.9 8.3)'%2F%3E%3Cellipse cx='30.2' cy='14.6' rx='4.0' ry='5.2' transform='rotate(28 30.2 14.6)'%2F%3E%3C%2Fsvg%3E")!important;
  mask-image:url("data:image/svg+xml,%3Csvg xmlns='http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' viewBox='0 0 36 38'%3E%3Cellipse cx='18' cy='27' rx='10' ry='9'%2F%3E%3Cellipse cx='5.8' cy='14.6' rx='4.0' ry='5.2' transform='rotate(-28 5.8 14.6)'%2F%3E%3Cellipse cx='13.1' cy='8.3' rx='4.1' ry='5.5' transform='rotate(-10 13.1 8.3)'%2F%3E%3Cellipse cx='22.9' cy='8.3' rx='4.1' ry='5.5' transform='rotate(10 22.9 8.3)'%2F%3E%3Cellipse cx='30.2' cy='14.6' rx='4.0' ry='5.2' transform='rotate(28 30.2 14.6)'%2F%3E%3C%2Fsvg%3E")!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center!important;
  mask-position:center!important;
  -webkit-mask-size:contain!important;
  mask-size:contain!important;
}
.paw::before,.paw::after{content:none!important;display:none!important}

/* During a real drag the media itself does not become a click target visually. */
.gallery.is-dragging .gallery__media{pointer-events:none}


/* =========================================================
   V4.7 – supplied Amigo dog-head + supplied paw artwork
   ========================================================= */

/* Retire every temporary/generated dog-head graphic from earlier versions. */
.amigo-outline-svg{display:none!important}

/* The user's supplied Amigo head SVG becomes the single source of truth. */
.logo-earable .amigo-user-logo{
  position:absolute;
  left:50%;
  top:50%;
  width:142%;
  height:142%;
  object-fit:contain;
  opacity:0;
  pointer-events:none;
  user-select:none;
  transform:translate(-50%,-50%) scale(.72) rotate(-2deg);
  transform-origin:center;
  transition:opacity .28s ease,transform .58s cubic-bezier(.18,.82,.2,1);
  z-index:8;
}
body.amigo-mode .logo-earable .amigo-user-logo{
  opacity:1;
  transform:translate(-50%,-50%) scale(1) rotate(0deg);
}

/* Normal A-mark disappears only while Amigo Mode is active. */
body.amigo-mode .logo-earable:not(.hero__badge)>span,
body.amigo-mode .logo-earable:not(.hero__badge)>i{
  opacity:0!important;
}
body.amigo-mode .logo-earable:not(.hero__badge){
  background:transparent!important;
  border-color:transparent!important;
  box-shadow:none!important;
  overflow:visible!important;
}

/* The address stamp also morphs cleanly instead of receiving pasted-on ears. */
body.amigo-mode .hero__badge{
  background:transparent!important;
  border-color:transparent!important;
  border-radius:0!important;
  box-shadow:none!important;
  overflow:visible!important;
}
body.amigo-mode .hero__badge .amigo-user-logo{
  width:118%;
  height:118%;
}
body.amigo-mode .hero__badge>span,
body.amigo-mode .hero__badge>b,
body.amigo-mode .hero__badge>small,
body.amigo-mode .hero__badge>em{
  opacity:0!important;
  transition:opacity .2s ease!important;
}
body.amigo-mode .hero__badge:hover .amigo-user-logo,
body.amigo-mode .hero__badge:focus-visible .amigo-user-logo{
  transform:translate(-50%,-50%) scale(1.055) rotate(-1deg);
}

/* Exact supplied paw: one SVG mask, so toes can never detach from the pad. */
.cursor{
  width:34px!important;
  height:34px!important;
  background:var(--mustard)!important;
  -webkit-mask-image:url("../icons/dogpaw.svg")!important;
  mask-image:url("../icons/dogpaw.svg")!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center!important;
  mask-position:center!important;
  -webkit-mask-size:contain!important;
  mask-size:contain!important;
  transform:translate3d(var(--cursor-x),var(--cursor-y),0) rotate(-12deg) scale(var(--paw-scale))!important;
  filter:drop-shadow(0 3px 5px rgba(23,19,18,.30))!important;
}
.cursor__toe,.cursor__pad{display:none!important}
.cursor.is-hover{background:var(--coral)!important;--paw-scale:1.16}
.cursor.is-click{background:var(--turquoise)!important;--paw-scale:.84}

/* Trail and burst use the exact same supplied paw artwork. */
.paw{
  width:22px!important;
  height:22px!important;
  background:var(--coral)!important;
  -webkit-mask-image:url("../icons/dogpaw.svg")!important;
  mask-image:url("../icons/dogpaw.svg")!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center!important;
  mask-position:center!important;
  -webkit-mask-size:contain!important;
  mask-size:contain!important;
}
.paw::before,.paw::after{content:none!important;display:none!important}

/* Easter-egg paw marks use the same family silhouette for consistency. */
.sniff-spot::before{
  background:currentColor!important;
  -webkit-mask-image:url("../icons/dogpaw.svg")!important;
  mask-image:url("../icons/dogpaw.svg")!important;
  -webkit-mask-size:contain!important;
  mask-size:contain!important;
  -webkit-mask-repeat:no-repeat!important;
  mask-repeat:no-repeat!important;
  -webkit-mask-position:center!important;
  mask-position:center!important;
}

@media (prefers-reduced-motion:reduce){
  .amigo-user-logo{transition:none!important}
}
html.a11y-reduce-motion .amigo-user-logo{transition:none!important}

/* =========================================================
   V4.8 – directional paw, cleaned Amigo artwork, analog path,
   modal cursor fix and three-track sound system
   ========================================================= */

/* ---------- Supplied Amigo artwork, cleaned from Illustrator outline artefact ---------- */
.logo-earable .amigo-user-logo{
  width:122%!important;
  height:122%!important;
  object-fit:contain!important;
  object-position:center!important;
  filter:none!important;
}
body.amigo-mode .brand__mark .amigo-user-logo{width:116%!important;height:116%!important}
body.amigo-mode .intro__mark .amigo-user-logo{width:108%!important;height:108%!important}
body.amigo-mode .hero__badge .amigo-user-logo{
  width:104%!important;
  height:104%!important;
  filter:drop-shadow(0 15px 30px rgba(0,0,0,.22))!important;
}
body.amigo-mode .hero__badge{
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
body.amigo-mode .hero__badge>span,
body.amigo-mode .hero__badge>b,
body.amigo-mode .hero__badge>small,
body.amigo-mode .hero__badge>em{opacity:0!important;visibility:hidden!important}
.reward-dialog__paw{
  width:86px!important;height:86px!important;margin:0 0 24px!important;
  background:transparent!important;border-radius:0!important;
  display:grid!important;place-items:center!important;
}
.reward-dialog__paw img{width:84px;height:84px;object-fit:contain;display:block}

/* ---------- Direction-aware supplied paw cursor ---------- */
.cursor{
  --paw-angle:0deg;
  --paw-scale:1;
  --paw-color:var(--coral-deep);
  width:30px!important;
  height:30px!important;
  background:var(--paw-color)!important;
  transform:translate3d(var(--cursor-x),var(--cursor-y),0) rotate(var(--paw-angle)) scale(var(--paw-scale))!important;
  transform-origin:50% 50%!important;
  transition:background .18s ease,filter .18s ease!important;
  filter:drop-shadow(0 2px 4px rgba(23,19,18,.28))!important;
}
.cursor[data-tone="dark"]{--paw-color:var(--mustard)}
.cursor[data-tone="light"]{--paw-color:var(--coral-deep)}
.cursor[data-zone="sound"]{--paw-color:var(--ink)}
.cursor[data-zone="maker"]{--paw-color:var(--mustard)}
.cursor.is-hover{--paw-scale:1.10!important;filter:drop-shadow(0 3px 7px rgba(23,19,18,.34))!important}
.cursor.is-click{--paw-scale:.84!important;--paw-color:var(--turquoise)!important}

/* ---------- Reward layer stays below the custom paw and above the page ---------- */
.reward-scrim{
  position:fixed;inset:0;z-index:6800;
  background:rgba(23,19,18,.76);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
}
.reward-scrim[hidden]{display:none!important}
.reward-dialog{
  position:fixed!important;
  z-index:6900!important;
  left:50%!important;top:50%!important;
  transform:translate(-50%,-50%)!important;
  margin:0!important;
  max-height:calc(100svh - 28px)!important;
  overflow:auto!important;
}
.reward-dialog:not([open]){display:none!important}
.reward-dialog::backdrop{display:none!important}
.reward-dialog__close{z-index:2}
body.reward-open .cursor{z-index:99999!important}

/* ---------- New progress language: a tiny analog route, not a UI capsule ---------- */
.where-track{
  --track-fg:var(--white);
  --track-accent:var(--mustard);
  position:fixed!important;
  left:auto!important;
  right:13px!important;
  top:50%!important;
  bottom:auto!important;
  width:34px!important;
  min-height:210px!important;
  padding:0!important;
  gap:0!important;
  border:0!important;
  border-radius:0!important;
  background:transparent!important;
  box-shadow:none!important;
  backdrop-filter:none!important;-webkit-backdrop-filter:none!important;
  transform:translateY(-50%)!important;
  opacity:.72!important;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.28))!important;
  transition:opacity .25s ease,color .3s ease!important;
}
.where-track:hover,.where-track:focus-within{opacity:1!important}
.where-track[data-tone="light"]{--track-fg:var(--ink);--track-accent:var(--coral-deep)}
.where-track[data-tone="dark"]{--track-fg:var(--white);--track-accent:var(--mustard)}
.where-track__current{
  position:absolute!important;
  right:27px!important;top:50%!important;
  width:auto!important;min-width:31px!important;
  transform:translateY(-50%)!important;
  display:flex!important;align-items:center!important;justify-content:flex-end!important;
  padding:4px 6px!important;
  border:1px solid color-mix(in srgb,var(--track-fg) 22%,transparent)!important;
  border-radius:8px!important;
  background:color-mix(in srgb,var(--paper) 82%,transparent)!important;
  color:var(--ink)!important;
  box-shadow:0 5px 18px rgba(0,0,0,.08)!important;
  backdrop-filter:blur(8px)!important;-webkit-backdrop-filter:blur(8px)!important;
  overflow:hidden!important;
}
.where-track[data-tone="dark"] .where-track__current{background:rgba(23,19,18,.56)!important;color:var(--white)!important}
.where-track__current small{display:none!important}
.where-track__readout{display:flex!important;flex-direction:row!important;align-items:center!important;gap:0!important}
.where-track__readout b{
  min-width:20px!important;
  font:italic .95rem/1 var(--display)!important;
  color:var(--track-accent)!important;
  background:none!important;
}
.where-track__readout>span{
  max-width:0!important;opacity:0!important;overflow:hidden!important;white-space:nowrap!important;
  font-size:.48rem!important;font-weight:900!important;letter-spacing:.08em!important;text-transform:uppercase!important;
  transition:max-width .38s cubic-bezier(.2,.8,.2,1),opacity .25s ease,margin .38s ease!important;
}
.where-track:hover .where-track__readout>span,.where-track:focus-within .where-track__readout>span{max-width:80px!important;opacity:.9!important;margin-left:5px!important}
.where-track__route{position:absolute!important;right:0!important;top:0!important;width:20px!important;height:210px!important}
.where-track__meter{
  --where-progress:0%;
  position:absolute!important;left:9px!important;top:8px!important;bottom:8px!important;
  width:1px!important;height:auto!important;
  overflow:visible!important;
  background:repeating-linear-gradient(to bottom,var(--track-fg) 0 2px,transparent 2px 6px)!important;
  opacity:.7!important;
}
.where-track__meter i{
  position:absolute!important;left:0!important;top:0!important;width:1px!important;
  height:var(--where-progress)!important;
  background:var(--track-accent)!important;
  box-shadow:0 0 7px color-mix(in srgb,var(--track-accent) 55%,transparent)!important;
}
.where-track__meter::after{
  content:""!important;
  position:absolute!important;
  left:50%!important;
  top:clamp(6px,var(--where-progress),calc(100% - 6px))!important;
  width:13px!important;height:13px!important;
  transform:translate(-50%,-50%) rotate(-8deg)!important;
  background:var(--track-accent)!important;
  -webkit-mask:url("../icons/dogpaw.svg") center/contain no-repeat!important;
  mask:url("../icons/dogpaw.svg") center/contain no-repeat!important;
  border:0!important;border-radius:0!important;box-shadow:none!important;
}
.where-track__dots{
  position:absolute!important;inset:0!important;
  display:flex!important;flex-direction:column!important;justify-content:space-between!important;align-items:flex-end!important;
  gap:0!important;
}
.where-track__dots a{width:20px!important;height:22px!important;border:0!important;border-radius:0!important;opacity:.58!important;position:relative!important}
.where-track__dots a::before{
  content:""!important;position:absolute!important;right:0!important;top:50%!important;
  width:4px!important;height:1px!important;background:var(--track-fg)!important;
  transform:translateY(-50%)!important;border-radius:0!important;transition:width .22s ease,background .22s ease!important;
}
.where-track__dots a.is-active::before,.where-track__dots a:hover::before,.where-track__dots a:focus-visible::before{width:13px!important;background:var(--track-accent)!important}

@media(max-width:760px){
  .where-track{
    left:12px!important;right:12px!important;top:auto!important;bottom:8px!important;
    width:auto!important;min-height:32px!important;height:32px!important;
    transform:none!important;opacity:.82!important;
  }
  .where-track__current{left:0!important;right:auto!important;top:50%!important;min-width:34px!important}
  .where-track__route{left:48px!important;right:0!important;top:6px!important;width:auto!important;height:20px!important}
  .where-track__meter{left:4px!important;right:4px!important;top:9px!important;bottom:auto!important;width:auto!important;height:1px!important;background:repeating-linear-gradient(to right,var(--track-fg) 0 2px,transparent 2px 7px)!important}
  .where-track__meter i{left:0!important;top:0!important;height:1px!important;width:var(--where-progress)!important}
  .where-track__meter::after{left:clamp(6px,var(--where-progress),calc(100% - 6px))!important;top:50%!important}
  .where-track__dots{flex-direction:row!important;align-items:center!important;justify-content:space-between!important}
  .where-track__dots a{width:20px!important;height:20px!important}
  .where-track__dots a::before{right:auto!important;left:50%!important;top:50%!important;width:1px!important;height:4px!important;transform:translate(-50%,-50%)!important}
  .where-track__dots a.is-active::before,.where-track__dots a:hover::before,.where-track__dots a:focus-visible::before{width:1px!important;height:12px!important}
  .where-track:hover .where-track__readout>span,.where-track:focus-within .where-track__readout>span{max-width:0!important;opacity:0!important;margin-left:0!important}
}

/* ---------- Three sound worlds ---------- */
.sound-story__disc::before{
  background:
    conic-gradient(from 18deg,transparent 0 12%,rgba(255,255,255,.035) 12% 14%,transparent 14% 46%,rgba(255,255,255,.018) 46% 49%,transparent 49% 100%),
    repeating-radial-gradient(circle at center,#211d1b 0 3px,#151211 3px 6px)!important;
  animation:recordSpin 10.5s linear infinite!important;
  transition:filter .2s ease,transform .2s ease;
}
.sound-story__disc.is-playing::before{animation-duration:8.5s!important}
.sound-story__disc.is-beat::after{transform:scale(1.045);box-shadow:0 0 0 9px rgba(217,110,88,.10)}
.sound-story__disc::after{transition:transform .12s ease,box-shadow .12s ease}
.sound-notes{position:absolute;inset:0;z-index:4;pointer-events:none;overflow:visible}
.sound-note{
  --tx:120px;--ty:-80px;--nr:0deg;--delay:0ms;
  position:absolute;left:50%;top:50%;
  color:var(--mustard);font:700 clamp(1rem,1.7vw,1.55rem)/1 var(--display);
  opacity:0;transform:translate(-50%,-50%) scale(.55);
  animation:soundNoteFly 1.7s cubic-bezier(.16,.78,.22,1) var(--delay) forwards;
  text-shadow:0 4px 14px rgba(0,0,0,.28);
}
.sound-note i{display:block;font-style:normal;animation:soundNoteVibe .24s ease-in-out infinite alternate}
@keyframes soundNoteFly{
  0%{opacity:0;transform:translate(-50%,-50%) scale(.5) rotate(0deg)}
  12%{opacity:.82}
  100%{opacity:0;transform:translate(calc(-50% + var(--tx)),calc(-50% + var(--ty))) scale(1.05) rotate(var(--nr))}
}
@keyframes soundNoteVibe{from{transform:translate(-1px,0) rotate(-2deg)}to{transform:translate(1px,-1px) rotate(2deg)}}
.sound-styles{display:grid;gap:7px;margin-top:30px;max-width:680px}
.sound-style{
  width:100%;display:grid;grid-template-columns:34px 1fr auto;grid-template-areas:"num title state" "num desc state";
  align-items:center;column-gap:10px;padding:11px 12px;
  border:1px solid rgba(23,19,18,.24);border-radius:14px 4px 14px 4px;
  background:rgba(255,249,239,.16);color:var(--ink);text-align:left;
  transition:transform .22s ease,background .22s ease,border-color .22s ease;
}
.sound-style:hover,.sound-style:focus-visible{transform:translateX(3px);border-color:var(--ink)}
.sound-style.is-active{background:var(--paper);border-color:var(--ink);box-shadow:5px 5px 0 rgba(23,19,18,.08)}
.sound-style>span{grid-area:num;font:italic 1.25rem/1 var(--display);color:var(--coral-deep)}
.sound-style>strong{grid-area:title;font-size:.74rem;letter-spacing:.07em;text-transform:uppercase}
.sound-style>small{grid-area:desc;font-size:.64rem;opacity:.67;margin-top:1px}
.sound-style>em{grid-area:state;font:800 .51rem var(--sans);font-style:normal;letter-spacing:.09em;text-transform:uppercase;opacity:.55}
.sound-style.is-active>em{opacity:1;color:var(--coral-deep)}
.sound-cta{margin-top:24px!important}

/* ---------- Footer and maker reveal are one continuous colour field ---------- */
.maker-strip{
  background:var(--coral)!important;
  color:var(--ink)!important;
  border:0!important;
  border-top:0!important;
  box-shadow:none!important;
}
.footer{border-bottom:0!important;box-shadow:none!important}

@media(prefers-reduced-motion:reduce){
  .sound-note{display:none!important}
  .sound-story__disc::before{animation:none!important}
  .cursor{transition:none!important}
}
html.a11y-reduce-motion .sound-note{display:none!important}
html.a11y-reduce-motion .sound-story__disc::before{animation:none!important}
.sound-note i{scale:1;transition:scale .11s ease}
.sound-story__disc.is-beat .sound-note i{scale:1.13}


/* =========================================================
   V4.9 – final supplied Amigo head + yellow signature discs
   ========================================================= */

/* Everywhere the Amigo head acts as a brand mark, it sits in the same
   mustard-yellow circular field. The exception is section 04 “Wir drei”,
   where Amigo is shown as the character himself, without the brand disc. */
body.amigo-mode .logo-earable:not(.hero__badge){
  background:var(--mustard)!important;
  border:0!important;
  border-radius:50%!important;
  box-shadow:none!important;
  overflow:hidden!important;
}
body.amigo-mode .brand__mark .amigo-user-logo,
body.amigo-mode .intro__mark .amigo-user-logo{
  width:76%!important;
  height:76%!important;
  object-fit:contain!important;
  transform:translate(-50%,-50%) scale(1) rotate(0deg)!important;
  filter:none!important;
}
body.amigo-mode .intro__mark{
  background:var(--mustard)!important;
  color:var(--ink)!important;
}

/* Address stamp: the former yellow square/field becomes a round Amigo disc. */
body.amigo-mode .hero__badge{
  background:var(--mustard)!important;
  border:0!important;
  border-radius:50%!important;
  box-shadow:0 18px 54px rgba(0,0,0,.20)!important;
  overflow:hidden!important;
}
body.amigo-mode .hero__badge .amigo-user-logo{
  width:76%!important;
  height:76%!important;
  object-fit:contain!important;
  filter:none!important;
}
body.amigo-mode .hero__badge:hover .amigo-user-logo,
body.amigo-mode .hero__badge:focus-visible .amigo-user-logo{
  transform:translate(-50%,-50%) scale(1.04) rotate(-1deg)!important;
}
body.amigo-mode .hero__badge[aria-expanded="true"]{
  background:var(--mustard)!important;
}

/* Reward discovery uses the same brand ratio: head inside yellow circle. */
.reward-dialog__paw{
  width:86px!important;
  height:86px!important;
  background:var(--mustard)!important;
  border-radius:50%!important;
  overflow:hidden!important;
  display:grid!important;
  place-items:center!important;
}
.reward-dialog__paw img{
  width:76%!important;
  height:76%!important;
  object-fit:contain!important;
  display:block!important;
}

/* Section 04: real Amigo artwork, deliberately WITHOUT the yellow logo disc. */
.dog-placeholder--amigo-head{
  width:min(430px,72vw)!important;
  aspect-ratio:1!important;
  background:transparent!important;
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  display:grid!important;
  place-items:center!important;
  overflow:visible!important;
}
.dog-placeholder--amigo-head::before,
.dog-placeholder--amigo-head::after{content:none!important;display:none!important}
.dog-placeholder--amigo-head .dog-placeholder__image{
  width:88%!important;
  height:88%!important;
  object-fit:contain!important;
  display:block!important;
  filter:drop-shadow(0 20px 38px rgba(23,19,18,.16));
}
body.amigo-mode .dog-placeholder--amigo-head{animation:dogBreathe 2.2s ease-in-out infinite alternate}
@media(prefers-reduced-motion:reduce){body.amigo-mode .dog-placeholder--amigo-head{animation:none!important}}
html.a11y-reduce-motion body.amigo-mode .dog-placeholder--amigo-head{animation:none!important}


/* =========================================================
   V5.0 – completed sound trio, persistent Amigo trail,
   softer hero parallax, adaptive story path and refined origin
   ========================================================= */

/* Hero movement is driven smoothly by JS; avoid transition hand-off on first contact. */
.hero__media{
  transform:translate3d(var(--hero-x,0px),var(--hero-y,0px),0) scale(1.045)!important;
  transition:none!important;
  will-change:transform;
}

/* The supplied artwork is preserved for the character view. Small brand marks
   use the optimized derivative and fully suppress the old A/dot underneath. */
body.amigo-mode .brand__mark.logo-earable,
body.amigo-mode .intro__mark.logo-earable{
  font-size:0!important;
  line-height:0!important;
  color:transparent!important;
  overflow:hidden!important;
}
body.amigo-mode .brand__mark.logo-earable>span,
body.amigo-mode .intro__mark.logo-earable>span,
body.amigo-mode .intro__mark.logo-earable>i{display:none!important}
body.amigo-mode .brand__mark .amigo-user-logo,
body.amigo-mode .intro__mark .amigo-user-logo,
body.amigo-mode .hero__badge .amigo-user-logo{
  width:74%!important;height:74%!important;max-width:74%!important;max-height:74%!important;
  object-fit:contain!important;object-position:center!important;
  transform:translate(-50%,-50%)!important;
}

/* Section 04: normal website = quiet white A-circle. Amigo Mode = actual dog head. */
.dog-placeholder--amigo-head{
  width:min(430px,72vw)!important;aspect-ratio:1!important;
  border-radius:50%!important;background:var(--paper)!important;
  border:1px solid rgba(23,19,18,.09)!important;
  box-shadow:var(--shadow)!important;overflow:hidden!important;
  display:grid!important;place-items:center!important;
  transition:background .5s ease,border-color .5s ease,box-shadow .5s ease!important;
}
.dog-placeholder__fallback{position:absolute;inset:0;display:grid;place-items:center;opacity:1;transition:opacity .42s ease,transform .55s cubic-bezier(.2,.8,.2,1)}
.dog-placeholder__fallback span{font:italic clamp(9rem,18vw,15rem)/1 var(--display);color:var(--coral);letter-spacing:-.09em;transform:translateX(-.04em)}
.dog-placeholder__fallback i{position:absolute;width:17px;height:12px;border-radius:50%;background:var(--ink);transform:translate(12px,54px)}
.dog-placeholder--amigo-head .dog-placeholder__image{
  position:relative;width:86%!important;height:86%!important;object-fit:contain!important;
  opacity:0;transform:scale(.78);transition:opacity .42s ease,transform .62s cubic-bezier(.18,.82,.2,1)!important;
  filter:drop-shadow(0 20px 38px rgba(23,19,18,.16));
}
body.amigo-mode .dog-placeholder--amigo-head{background:transparent!important;border-color:transparent!important;box-shadow:none!important;overflow:visible!important}
body.amigo-mode .dog-placeholder__fallback{opacity:0;transform:scale(.82)}
body.amigo-mode .dog-placeholder--amigo-head .dog-placeholder__image{opacity:1;transform:scale(1)}

/* Origin stamp: same mustard circle, but a deliberate two-colour typographic lockup. */
.origin__stamp{
  width:178px!important;padding:20px!important;transform:rotate(-6deg)!important;
  gap:0!important;align-content:center!important;
}
.origin__stamp span{
  color:var(--ink)!important;font:900 .62rem/1 var(--sans)!important;
  letter-spacing:.15em!important;margin-bottom:3px!important;
}
.origin__stamp b{
  color:var(--coral-deep)!important;font:italic 3rem/.77 var(--display)!important;
  letter-spacing:-.055em!important;font-weight:500!important;
}
.origin__stamp em{
  display:block;color:var(--ink);font:900 .54rem/1.15 var(--sans);font-style:normal;
  letter-spacing:.12em;text-transform:uppercase;margin-top:7px;max-width:120px;
}

/* Persistent paw trail: prints stay where the pointer passed, then simply fade.
   No upward flight. Only three contrast colours are used across the whole site. */
.paw--trail{
  position:absolute!important;width:17px!important;height:17px!important;
  opacity:0;background:var(--trail-color,var(--coral-deep))!important;
  transform:rotate(var(--r)) scale(.88)!important;
  animation:amigoTrailFade 1.24s ease-out forwards!important;
  filter:drop-shadow(0 1px 2px rgba(23,19,18,.18));
}
.paw--trail[data-tone="dark"]{--trail-color:var(--mustard)}
.paw--trail[data-tone="light"]{--trail-color:var(--coral-deep)}
.paw--trail[data-tone="sound"],.paw--trail[data-tone="footer"]{--trail-color:var(--ink)}
@keyframes amigoTrailFade{
  0%{opacity:0;transform:rotate(var(--r)) scale(.78)}
  12%{opacity:.72;transform:rotate(var(--r)) scale(.92)}
  68%{opacity:.38;transform:rotate(var(--r)) scale(.92)}
  100%{opacity:0;transform:rotate(var(--r)) scale(.92)}
}

/* Progress becomes a discreet "Amigo route": faint stitches + a strong paw token.
   The token flips with scroll direction and the palette adapts to the surface below. */
.where-track{
  --track-fg:rgba(23,19,18,.52);
  --track-accent:var(--coral-deep);
  --track-token:var(--cream);
  --track-paw-angle:180deg;
  width:38px!important;right:12px!important;min-height:236px!important;
  opacity:.82!important;filter:none!important;
}
.where-track[data-direction="up"]{--track-paw-angle:0deg}
.where-track[data-direction="down"]{--track-paw-angle:180deg}
.where-track[data-tone="dark"]{--track-fg:rgba(255,249,239,.58);--track-accent:var(--mustard);--track-token:var(--ink)}
.where-track[data-tone="light"]{--track-fg:rgba(23,19,18,.48);--track-accent:var(--coral-deep);--track-token:var(--cream)}
.where-track[data-zone="sound"]{--track-fg:rgba(23,19,18,.48);--track-accent:var(--ink);--track-token:var(--mustard)}
.where-track[data-zone="footer"],.where-track[data-zone="maker"]{--track-fg:rgba(23,19,18,.48);--track-accent:var(--ink);--track-token:var(--mustard)}
.where-track__route{height:236px!important;width:24px!important}
.where-track__meter{
  left:11px!important;top:8px!important;bottom:8px!important;width:1px!important;
  background:repeating-linear-gradient(to bottom,var(--track-fg) 0 3px,transparent 3px 8px)!important;
  opacity:1!important;
}
.where-track__meter i{background:var(--track-accent)!important;width:1px!important;box-shadow:none!important;opacity:.72}
.where-track__meter::before{
  content:"";position:absolute;left:50%;top:clamp(9px,var(--where-progress),calc(100% - 9px));
  width:21px;height:21px;border-radius:50%;background:var(--track-accent);
  transform:translate(-50%,-50%);box-shadow:0 3px 10px rgba(23,19,18,.18),0 0 0 2px color-mix(in srgb,var(--track-token) 28%,transparent);
  transition:top .12s linear,background .28s ease;
}
.where-track__meter::after{
  width:12px!important;height:12px!important;left:50%!important;
  top:clamp(9px,var(--where-progress),calc(100% - 9px))!important;
  background:var(--track-token)!important;
  transform:translate(-50%,-50%) rotate(var(--track-paw-angle))!important;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.16));
  transition:top .12s linear,background .28s ease,transform .32s cubic-bezier(.2,.8,.2,1)!important;
}
.where-track__dots a::before{opacity:.72}
.where-track.is-at-footer{opacity:.82!important;pointer-events:auto!important;visibility:visible!important}
.where-track__current{right:31px!important;opacity:.72;transition:opacity .25s ease!important}
.where-track:hover .where-track__current,.where-track:focus-within .where-track__current{opacity:1}
@media(max-width:760px){
  .where-track{left:auto!important;right:5px!important;top:50%!important;bottom:auto!important;width:28px!important;height:190px!important;min-height:190px!important;transform:translateY(-50%)!important}
  .where-track__current{display:none!important}
  .where-track__route{left:auto!important;right:0!important;top:0!important;width:22px!important;height:190px!important}
  .where-track__meter{left:10px!important;right:auto!important;top:8px!important;bottom:8px!important;width:1px!important;height:auto!important;background:repeating-linear-gradient(to bottom,var(--track-fg) 0 3px,transparent 3px 8px)!important}
  .where-track__meter i{width:1px!important;height:var(--where-progress)!important}
  .where-track__meter::before,.where-track__meter::after{left:50%!important;top:clamp(9px,var(--where-progress),calc(100% - 9px))!important}
  .where-track__dots{flex-direction:column!important;align-items:flex-end!important;justify-content:space-between!important}
  .where-track__dots a{width:20px!important;height:20px!important}
  .where-track__dots a::before{right:0!important;left:auto!important;top:50%!important;width:4px!important;height:1px!important;transform:translateY(-50%)!important}
  .where-track__dots a.is-active::before{width:11px!important;height:1px!important}
}

/* Sound: more notes, farther beyond the vinyl, and every live note pulses with the beat. */
.sound-story__disc{overflow:visible!important}
.sound-notes{inset:-22%!important;overflow:visible!important}
.sound-note{
  color:var(--mustard)!important;
  font:700 clamp(1.35rem,2.25vw,2.25rem)/1 var(--display)!important;
  animation-duration:2.15s!important;
}
@keyframes soundNoteFly{
  0%{opacity:0;transform:translate(-50%,-50%) scale(calc(.48 * var(--note-scale,1))) rotate(0deg)}
  9%{opacity:.9}
  100%{opacity:0;transform:translate(calc(-50% + var(--tx)),calc(-50% + var(--ty))) scale(calc(1.08 * var(--note-scale,1))) rotate(var(--nr))}
}
.sound-note i{animation:none!important;transition:transform .11s ease!important;transform:scale(1) rotate(0deg)}
.sound-story__disc.is-beat .sound-note i{transform:scale(1.22) rotate(-4deg)!important}
.sound-story__disc::before{animation-duration:11.2s!important}
.sound-story__disc.is-playing::before{animation-duration:7.8s!important}
.sound-story__disc small{
  position:absolute;z-index:3;width:128px;text-align:center;
  font:800 .42rem/1.15 var(--sans);letter-spacing:.1em;text-transform:uppercase;
  transform:translateY(45px);color:var(--ink);opacity:.7;
}

@media(prefers-reduced-motion:reduce){
  .paw--trail,.sound-note{display:none!important}
  .hero__media{transform:scale(1.045)!important}
}
html.a11y-reduce-motion .paw--trail,html.a11y-reduce-motion .sound-note{display:none!important}


/* =========================================================
   V5.2 – living Amigo eyes, adaptive paw contrast, stronger
   parallax, refined route, reliable music-note flight
   ========================================================= */

/* New supplied dog head is inlined by JS so pupils and eyes can animate. */
.amigo-dog-svg{
  display:block;
  width:100%;height:100%;
  overflow:visible;
  pointer-events:none;
  user-select:none;
}
.logo-earable .amigo-dog-svg.amigo-user-logo{
  position:absolute;left:50%;top:50%;
  width:76%!important;height:76%!important;
  opacity:0;
  transform:translate(-50%,-50%) scale(.84);
  transition:opacity .3s ease,transform .58s cubic-bezier(.18,.82,.2,1);
  z-index:8;
}
body.amigo-mode .logo-earable .amigo-dog-svg.amigo-user-logo{
  opacity:1;
  transform:translate(-50%,-50%) scale(1);
}
.reward-dialog__paw .amigo-dog-svg{width:76%;height:76%}
.dog-placeholder--amigo-head .amigo-dog-svg.dog-placeholder__image{
  position:relative;width:86%!important;height:86%!important;
  opacity:0;transform:scale(.78);
  transition:opacity .42s ease,transform .62s cubic-bezier(.18,.82,.2,1)!important;
  filter:drop-shadow(0 20px 38px rgba(23,19,18,.16));
}
body.amigo-mode .dog-placeholder--amigo-head .amigo-dog-svg.dog-placeholder__image{opacity:1;transform:scale(1)}
.amigo-dog-svg .dog-eye{
  transform-box:fill-box;
  transform-origin:center center;
  transition:transform 70ms ease-in;
}
.amigo-dog-svg.dog-blink-both .dog-eye,
.amigo-dog-svg.dog-wink-left .dog-eye-left{transform:scaleY(.055)}
.amigo-dog-svg .dog-pupil{will-change:transform}

/* Stronger parallax, same transform before and after first pointer contact. */
.hero__media{
  transform:translate3d(var(--hero-x,0px),var(--hero-y,0px),0) rotate(var(--hero-r,0deg)) scale(1.062)!important;
  transition:none!important;
  will-change:transform;
}

/* Paw cursor: two-colour adaptive system, and it may intentionally disappear over the maker credit. */
.cursor{
  --paw-color:var(--ink);
  width:28px!important;height:28px!important;
  background:var(--paw-color)!important;
  transition:background .12s ease,opacity .18s ease,filter .18s ease!important;
}
.cursor[data-contrast="dark"]{--paw-color:var(--mustard)}
.cursor[data-contrast="light"]{--paw-color:var(--ink)}
.cursor.is-hover{--paw-scale:1.10!important}
.cursor.is-suppressed{opacity:0!important;visibility:hidden!important}

/* Paw trail is always above page content, begins at cursor size and shrinks into the small print while fading. */
.paw-layer{z-index:9990!important;overflow:visible!important}
.paw--trail{
  width:30px!important;height:30px!important;
  opacity:0;
  background:var(--trail-color,var(--ink))!important;
  transform:rotate(var(--r)) scale(1)!important;
  animation:amigoTrailShrink 1.38s cubic-bezier(.22,.75,.2,1) forwards!important;
  filter:drop-shadow(0 1px 2px rgba(23,19,18,.18));
}
.paw--trail[data-contrast="dark"]{--trail-color:var(--mustard)}
.paw--trail[data-contrast="light"]{--trail-color:var(--ink)}
@keyframes amigoTrailShrink{
  0%{opacity:.66;transform:rotate(var(--r)) scale(1)}
  18%{opacity:.72}
  70%{opacity:.34;transform:rotate(var(--r)) scale(.68)}
  100%{opacity:0;transform:rotate(var(--r)) scale(.57)}
}

/* Maker credit uses the current supplied paw, opens slowly, and the custom cursor is hidden above it. */
.maker-signature__riddle{
  width:26px!important;height:26px!important;
  background:var(--ink)!important;
  -webkit-mask:url("../icons/dogpaw.svg") center/contain no-repeat!important;
  mask:url("../icons/dogpaw.svg") center/contain no-repeat!important;
  transition:transform 1.05s cubic-bezier(.2,.8,.2,1)!important;
}
.maker-signature__riddle i,.maker-signature__riddle::after{display:none!important;content:none!important}
.maker-signature__text{transition:max-width 1.15s cubic-bezier(.2,.8,.2,1),opacity .9s ease,filter .9s ease,transform 1.05s cubic-bezier(.2,.8,.2,1)!important}

/* The origin ticker is intentionally slower and calmer. */
.word-ribbon>.word-ribbon__track{animation-duration:76s!important}

/* Progress route: quieter stitches, clearer paw token, vertical readout. */
.where-track{
  --track-fg:rgba(23,19,18,.38);
  --track-accent:var(--ink);
  --track-token:var(--mustard);
  width:40px!important;right:12px!important;opacity:.86!important;
}
.where-track[data-contrast="dark"]{
  --track-fg:rgba(230,189,42,.48);
  --track-accent:var(--mustard);
  --track-token:var(--ink);
}
.where-track[data-contrast="light"]{
  --track-fg:rgba(23,19,18,.38);
  --track-accent:var(--ink);
  --track-token:var(--mustard);
}
.where-track__meter::before{width:24px!important;height:24px!important;box-shadow:0 4px 14px rgba(23,19,18,.22)!important}
.where-track__meter::after{width:14px!important;height:14px!important;filter:drop-shadow(0 1px 2px rgba(0,0,0,.2))!important}
.where-track__current{
  position:absolute!important;
  right:34px!important;top:50%!important;
  width:auto!important;min-width:0!important;height:26px!important;
  transform:translateY(-50%)!important;
  overflow:visible!important;background:transparent!important;
  padding:0!important;border:0!important;box-shadow:none!important;
  z-index:5!important;
}
.where-track__readout{
  display:flex!important;align-items:center!important;gap:6px!important;
  width:max-content!important;white-space:nowrap!important;
  transform:rotate(-90deg)!important;transform-origin:right center!important;
  padding:4px 8px!important;border-radius:999px!important;
  color:var(--track-accent)!important;
  background:color-mix(in srgb,var(--track-token) 78%,transparent)!important;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  box-shadow:0 3px 12px rgba(23,19,18,.10);
}
.where-track__readout b{color:var(--track-accent)!important;font-size:1rem!important;line-height:1!important}
.where-track__readout>span{max-width:0!important;opacity:0!important;overflow:hidden!important;margin:0!important;transition:max-width .42s ease,opacity .3s ease!important}
.where-track__current:hover .where-track__readout>span,.where-track__current:focus-visible .where-track__readout>span{max-width:110px!important;opacity:1!important}
.where-track:hover .where-track__readout>span{margin-left:0!important}

/* Music notes now use the Web Animations API; CSS only supplies appearance + beat vibration. */
.sound-story__disc,.sound-notes{overflow:visible!important}
.sound-notes{position:absolute!important;inset:-34%!important;z-index:6!important;pointer-events:none!important}
.sound-note{
  position:absolute!important;left:50%!important;top:50%!important;
  opacity:0;color:var(--mustard)!important;
  font:700 clamp(1.7rem,2.9vw,3rem)/1 var(--display)!important;
  text-shadow:0 4px 16px rgba(0,0,0,.35);
  will-change:transform,opacity;
  animation:none!important;
}
.sound-note i{display:block;font-style:normal;transform:scale(1);transition:transform .09s ease!important}
.sound-story__disc.is-beat .sound-note i{transform:scale(1.28) rotate(-4deg)!important}

/* Avoid stale image-specific sizing from previous versions after inline SVG replacement. */
.reward-dialog__paw img,.logo-earable img.amigo-user-logo{display:none!important}

@media(max-width:760px){
  .where-track__current{display:none!important}
  .hero__media{transform:scale(1.062)!important}
}
@media(prefers-reduced-motion:reduce){
  .hero__media{transform:scale(1.062)!important}
  .amigo-dog-svg .dog-eye{transition:none!important}
}
html.a11y-reduce-motion .amigo-dog-svg .dog-eye{transition:none!important}


/* V5.2 QA refinements */
.paw-layer{transition:opacity .18s ease}
.paw-layer.is-suppressed{opacity:0!important}
.where-track:hover .where-track__readout>span{max-width:0!important;opacity:0!important;margin-left:0!important}
.where-track__current:hover .where-track__readout>span,
.where-track__current:focus-visible .where-track__readout>span{max-width:110px!important;opacity:1!important}
html.a11y-reduce-motion .cursor{display:none!important}
@media(pointer:fine){
  html.a11y-reduce-motion body,
  html.a11y-reduce-motion a,
  html.a11y-reduce-motion button,
  html.a11y-reduce-motion [tabindex]{cursor:auto!important}
}


/* V5.2 final contrast + exact trail-size matching */
.cursor[data-contrast="dark"]{--paw-outline:var(--ink)}
.cursor[data-contrast="light"]{--paw-outline:var(--mustard)}
.cursor{filter:
  drop-shadow(1px 0 0 var(--paw-outline,transparent))
  drop-shadow(-1px 0 0 var(--paw-outline,transparent))
  drop-shadow(0 1px 0 var(--paw-outline,transparent))
  drop-shadow(0 -1px 0 var(--paw-outline,transparent))
  drop-shadow(0 2px 4px rgba(23,19,18,.22))!important}
.paw--trail{width:28px!important;height:28px!important;--trail-outline:var(--mustard)}
.paw--trail[data-contrast="dark"]{--trail-outline:var(--ink)}
.paw--trail[data-contrast="light"]{--trail-outline:var(--mustard)}
.paw--trail{filter:
  drop-shadow(.7px 0 0 var(--trail-outline))
  drop-shadow(-.7px 0 0 var(--trail-outline))
  drop-shadow(0 .7px 0 var(--trail-outline))
  drop-shadow(0 -.7px 0 var(--trail-outline))!important}
@keyframes amigoTrailShrink{
  0%{opacity:.66;transform:rotate(var(--r)) scale(1)}
  18%{opacity:.72}
  70%{opacity:.34;transform:rotate(var(--r)) scale(.72)}
  100%{opacity:0;transform:rotate(var(--r)) scale(.61)}
}

/* =========================================================
   V5.3 – spaced shrinking Amigo trail, persistent route label,
   calmer music notes, replayable reward and cursor-safe consent
   ========================================================= */

/* Trail: every print begins at the 28px cursor size and visibly shrinks
   to the original small spoor size. JS now enforces 32px physical spacing,
   so slow pointer movement cannot create overlapping paw clusters. */
.paw--trail{
  width:28px!important;
  height:28px!important;
  animation:amigoTrailV53 1.48s cubic-bezier(.22,.72,.22,1) forwards!important;
  transform-origin:center!important;
}
@keyframes amigoTrailV53{
  0%{opacity:.70;transform:rotate(var(--r)) scale(1)}
  16%{opacity:.74;transform:rotate(var(--r)) scale(.96)}
  62%{opacity:.40;transform:rotate(var(--r)) scale(.72)}
  100%{opacity:0;transform:rotate(var(--r)) scale(.58)}
}

/* The current section name is information, not a hover gimmick: keep it visible
   next to the number in the same 90° counter-clockwise readout. */
.where-track__readout>span,
.where-track:hover .where-track__readout>span,
.where-track__current:hover .where-track__readout>span,
.where-track__current:focus-visible .where-track__readout>span{
  max-width:132px!important;
  opacity:1!important;
  overflow:visible!important;
  margin:0!important;
}
.where-track__readout{gap:7px!important}

/* Completed Amigo hunt: the counter itself becomes the quiet way back to the code. */
.amigo-hud{
  appearance:none;
  color:var(--white);
  font:inherit;
  text-align:left;
  cursor:default;
}
.amigo-hud.is-complete{
  cursor:pointer;
  border-color:rgba(244,198,55,.72)!important;
  box-shadow:0 10px 34px rgba(0,0,0,.16),0 0 0 1px rgba(244,198,55,.10) inset!important;
}
.amigo-hud.is-complete:hover,
.amigo-hud.is-complete:focus-visible{
  transform:translateY(-2px);
  background:rgba(23,19,18,.94)!important;
}

/* Origin seal: "GUTES" belongs closer to the red "kommt". */
.origin__stamp span{margin-bottom:-5px!important}
.origin__stamp b{margin-top:0!important}

/* Twice the visual breathing room around the recurring ribbon separators. */
.word-ribbon__group .ribbon-sep{
  display:inline-block;
  margin-inline:1.25em;
}

/* Consent settings are deliberately NOT a native top-layer <dialog> anymore.
   That keeps the custom paw cursor visible and fully interactive above it. */
.consent-scrim{
  position:fixed;
  inset:0;
  z-index:10010;
  background:rgba(23,19,18,.66);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.consent-scrim[hidden],.consent-dialog[hidden]{display:none!important}
.consent-dialog{
  position:fixed!important;
  left:50%!important;
  top:50%!important;
  transform:translate(-50%,-50%)!important;
  z-index:10020!important;
  max-height:min(86vh,760px);
  overflow:auto;
}
body.consent-open{overflow:hidden}
.cursor{z-index:10050!important}
.paw-layer{z-index:10040!important}

/* Slightly calmer visual rhythm for the record: the Web Animations API handles
   the slower travel; CSS only keeps notes legible while they drift. */
.sound-note{filter:drop-shadow(0 2px 4px rgba(0,0,0,.16))}

@media(max-width:760px){
  .where-track__current{display:none!important}
  .consent-dialog{width:calc(100vw - 24px)!important;max-height:88vh;padding:24px!important}
}

/* =========================================================
   V5.5 – natural two-line paw trail, integrated route readout,
   rotating record label and randomized Amigo hunt
   ========================================================= */

/* Mouse trail: wrapper owns position/rotation; the inner print owns the shrink.
   This avoids transform collisions from the older trail implementations. */
.paw--trail{
  width:28px!important;
  height:28px!important;
  background:transparent!important;
  -webkit-mask:none!important;
  mask:none!important;
  animation:none!important;
  opacity:1!important;
  transform:rotate(var(--r))!important;
  transform-origin:center!important;
  filter:none!important;
  pointer-events:none!important;
}
.paw--trail__print{
  position:absolute;
  inset:0;
  display:block;
  width:100%;
  height:100%;
  background:var(--trail-color,var(--ink));
  -webkit-mask:url("../icons/dogpaw.svg") center/contain no-repeat;
  mask:url("../icons/dogpaw.svg") center/contain no-repeat;
  transform-origin:center;
  will-change:transform,opacity;
  filter:
    drop-shadow(.7px 0 0 var(--trail-outline,var(--mustard)))
    drop-shadow(-.7px 0 0 var(--trail-outline,var(--mustard)))
    drop-shadow(0 .7px 0 var(--trail-outline,var(--mustard)))
    drop-shadow(0 -.7px 0 var(--trail-outline,var(--mustard)))
    drop-shadow(0 1px 2px rgba(23,19,18,.14));
}
.paw--trail[data-contrast="dark"]{--trail-color:var(--mustard);--trail-outline:var(--ink)}
.paw--trail[data-contrast="light"]{--trail-color:var(--ink);--trail-outline:var(--mustard)}

/* Progress readout: number + section name share one quiet background and have
   enough air between them to read as one deliberate vertical label. */
.where-track__current{
  right:36px!important;
  height:auto!important;
}
.where-track__readout{
  gap:12px!important;
  padding:7px 11px!important;
  border-radius:999px!important;
  background:color-mix(in srgb,var(--track-token) 88%,transparent)!important;
  border:1px solid color-mix(in srgb,var(--track-accent) 16%,transparent)!important;
  box-shadow:0 4px 16px rgba(23,19,18,.10)!important;
}
.where-track__readout b{
  min-width:22px!important;
  padding:0!important;
  background:transparent!important;
}
.where-track__readout>span,
.where-track:hover .where-track__readout>span,
.where-track__current:hover .where-track__readout>span,
.where-track__current:focus-visible .where-track__readout>span{
  display:inline-block!important;
  max-width:150px!important;
  opacity:1!important;
  overflow:visible!important;
  margin:0!important;
  white-space:nowrap!important;
}

/* Real vinyl element: the complete label, including current track number and
   title, rotates together with the grooves. */
.sound-story__disc::before,
.sound-story__disc::after{display:none!important}
.record-disc{
  position:relative;
  width:min(430px,70vw);
  aspect-ratio:1;
  border-radius:50%;
  z-index:2;
  display:grid;
  place-items:center;
  background:
    conic-gradient(from 18deg,transparent 0 12%,rgba(255,255,255,.035) 12% 14%,transparent 14% 46%,rgba(255,255,255,.018) 46% 49%,transparent 49% 100%),
    repeating-radial-gradient(circle at center,#211d1b 0 3px,#151211 3px 6px);
  box-shadow:0 35px 90px rgba(0,0,0,.34);
  animation:recordSpin 11.2s linear infinite;
  transform-origin:center;
  will-change:transform;
}
.sound-story__disc.is-playing .record-disc{animation-duration:7.8s}
.record-label{
  position:absolute;
  left:50%;
  top:50%;
  width:126px;
  height:126px;
  transform:translate(-50%,-50%);
  border-radius:50%;
  background:var(--coral);
  border:7px solid var(--cream);
  color:var(--ink);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:16px 14px 13px;
  box-shadow:0 0 0 1px rgba(23,19,18,.12) inset;
}
.record-label #disc-brand,
.record-label #disc-track-no,
.record-label #disc-track-title,
.record-label .record-label__hole{
  position:static!important;
  transform:none!important;
  width:auto!important;
  z-index:auto!important;
}
.record-label #disc-brand{
  font:900 .48rem/1 var(--sans)!important;
  letter-spacing:.14em!important;
  color:var(--cream)!important;
  margin-bottom:5px;
}
.record-label #disc-track-no{
  font:italic 2rem/.85 var(--display)!important;
  color:var(--ink)!important;
  margin-bottom:4px;
}
.record-label #disc-track-title{
  display:block;
  max-width:92px;
  font:900 .40rem/1.12 var(--sans)!important;
  letter-spacing:.075em!important;
  text-transform:uppercase;
  color:var(--ink)!important;
  opacity:.82!important;
}
.record-label .record-label__hole{
  position:absolute!important;
  left:50%!important;
  top:50%!important;
  width:8px!important;
  height:8px!important;
  transform:translate(-50%,-50%)!important;
  border-radius:50%;
  background:var(--ink)!important;
  box-shadow:0 0 0 2px rgba(255,249,239,.20);
}
.sound-story__disc.is-beat .record-label{box-shadow:0 0 0 1px rgba(23,19,18,.12) inset,0 0 0 8px rgba(217,110,88,.10)}

/* Randomized Easter-eggs: each spot is positioned by JS inside a distinct
   page zone. The visual paw is a little easier to notice, while the 44px hit
   target remains larger than the visible mark. */
.sniff-zone-host{position:relative!important}
.sniff-spot,
.sniff-spot--one,
.sniff-spot--two,
.find__visual .sniff-spot--three{
  left:var(--sniff-x,50%)!important;
  top:var(--sniff-y,50%)!important;
  right:auto!important;
  bottom:auto!important;
  margin:-22px!important;
  transform:rotate(var(--sniff-r,-14deg))!important;
}
.sniff-spot::before{
  width:26px!important;
  height:27px!important;
  filter:drop-shadow(0 2px 3px rgba(23,19,18,.28))!important;
}
.amigo-mode .sniff-spot{opacity:.60!important}
.amigo-mode .sniff-spot[data-contrast="dark"]{color:var(--mustard)!important}
.amigo-mode .sniff-spot[data-contrast="light"]{color:var(--coral-deep)!important}
.amigo-mode .sniff-spot:hover,
.amigo-mode .sniff-spot:focus-visible{
  opacity:.98!important;
  transform:rotate(var(--sniff-r,-14deg)) scale(1.08)!important;
}
@keyframes sniffWhisper{
  0%,68%,100%{opacity:.60;filter:none}
  76%{opacity:.82}
  84%{opacity:.64}
}

@media(max-width:760px){
  .record-disc{width:min(340px,78vw)}
  .record-label{width:108px;height:108px;border-width:6px;padding:13px 11px}
  .where-track__current{display:none!important}
}


/* =========================================================
   V5.6 – beat-synced Amigo movement, longer trail,
   integrated progress label, real record run-up and
   uninterrupted legal-page switching
   ========================================================= */

/* The inner SVG group, not the outer logo geometry, moves to the beat. */
.amigo-dog-svg .dog-dance-shell{
  transform-box:fill-box;
  transform-origin:50% 56%;
  will-change:transform;
}

/* Mouse prints linger just a little longer; the Web Animations API still
   controls the cursor-size -> small-spoor shrink. */
.paw--trail__print{will-change:transform,opacity}

/* Final progress composition: one continuous vertical capsule for number + label.
   The paw token stays visually on top of the capsule and the route. */
.where-track{overflow:visible!important}
.where-track__current{
  right:24px!important;
  top:50%!important;
  height:auto!important;
  z-index:12!important;
  opacity:.94!important;
  overflow:visible!important;
}
.where-track__readout{
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  gap:11px!important;
  padding:8px 17px 8px 11px!important;
  min-height:32px!important;
  border-radius:999px!important;
  transform:rotate(-90deg)!important;
  transform-origin:right center!important;
  color:var(--track-accent)!important;
  background:color-mix(in srgb,var(--track-token) 92%,transparent)!important;
  border:1px solid color-mix(in srgb,var(--track-accent) 17%,transparent)!important;
  box-shadow:0 5px 18px rgba(23,19,18,.13)!important;
  backdrop-filter:blur(9px);
  -webkit-backdrop-filter:blur(9px);
}
.where-track__readout b{
  min-width:22px!important;
  padding:0!important;
  margin:0!important;
  color:var(--track-accent)!important;
  background:transparent!important;
  font:italic 1.03rem/.9 var(--display)!important;
}
.where-track__readout>span,
.where-track:hover .where-track__readout>span,
.where-track__current:hover .where-track__readout>span,
.where-track__current:focus-visible .where-track__readout>span{
  display:inline-block!important;
  max-width:170px!important;
  opacity:1!important;
  overflow:visible!important;
  margin:0!important;
  white-space:nowrap!important;
  font-size:.88rem!important;
  line-height:1!important;
  letter-spacing:.055em!important;
  font-weight:850!important;
}
.where-track__meter{z-index:18!important;overflow:visible!important}
.where-track__meter::before{
  z-index:30!important;
  width:25px!important;
  height:25px!important;
  background:var(--track-accent)!important;
  box-shadow:0 5px 16px rgba(23,19,18,.24),0 0 0 2px color-mix(in srgb,var(--track-token) 34%,transparent)!important;
}
.where-track__meter::after{
  z-index:31!important;
  width:15px!important;
  height:15px!important;
  background:var(--track-token)!important;
  filter:drop-shadow(0 1px 2px rgba(0,0,0,.22))!important;
}

/* A real record: absolutely still without audio. JS owns rotation and gives it
   a two-second run-up when playback begins. */
.record-disc,
.sound-story__disc.is-playing .record-disc{
  animation:none!important;
  transform:rotate(0deg);
}
.record-label #disc-brand{
  font:900 .56rem/1 var(--sans)!important;
  letter-spacing:.12em!important;
  margin-bottom:5px!important;
}
.record-label #disc-track-no{
  font:italic 2.12rem/.84 var(--display)!important;
  margin-bottom:4px!important;
}
.record-label #disc-track-title{
  max-width:98px!important;
  font:900 .46rem/1.10 var(--sans)!important;
  letter-spacing:.06em!important;
}

/* Legal information opens above the living homepage instead of unloading it,
   so the selected Amigo track keeps playing without a gap. */
body.legal-overlay-open{overflow:hidden!important}
.legal-overlay{
  position:fixed;
  inset:0;
  z-index:12000;
  display:grid;
  place-items:center;
  padding:clamp(12px,2.6vw,36px);
}
.legal-overlay[hidden]{display:none!important}
.legal-overlay__backdrop{
  position:absolute;
  inset:0;
  background:rgba(23,19,18,.72);
  backdrop-filter:blur(12px) saturate(.8);
  -webkit-backdrop-filter:blur(12px) saturate(.8);
}
.legal-overlay__sheet{
  position:relative;
  z-index:1;
  width:min(1120px,96vw);
  height:min(88vh,900px);
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  overflow:hidden;
  border-radius:28px;
  background:var(--cream);
  color:var(--ink);
  border:1px solid rgba(255,255,255,.22);
  box-shadow:0 30px 100px rgba(0,0,0,.38);
  outline:none;
}
.legal-overlay__header{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:22px;
  padding:16px 18px;
  background:var(--coral);
  border-bottom:1px solid rgba(23,19,18,.10);
}
.legal-overlay__brand{display:grid;grid-template-columns:32px auto;column-gap:8px;align-items:center}
.legal-overlay__brand>span{grid-row:1/3;width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:var(--mustard);font:italic 1.25rem/1 var(--display)}
.legal-overlay__brand strong{font:900 .72rem/1 var(--sans);letter-spacing:.06em}
.legal-overlay__brand small{font:700 .48rem/1 var(--sans);letter-spacing:.1em;text-transform:uppercase;opacity:.7}
.legal-overlay__tabs{display:flex;justify-content:center;gap:6px;flex-wrap:wrap}
.legal-overlay__tabs button,
.legal-overlay__close{
  border:0;
  background:transparent;
  color:var(--ink);
  font:850 .66rem/1 var(--sans);
  letter-spacing:.06em;
  text-transform:uppercase;
  cursor:pointer;
}
.legal-overlay__tabs button{padding:9px 11px;border-radius:999px}
.legal-overlay__tabs button.is-active{background:var(--ink);color:var(--cream)}
.legal-overlay__close{display:flex;align-items:center;gap:8px;padding:9px 4px 9px 12px}
.legal-overlay__close span{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--ink);color:var(--cream);font-size:1.05rem}
.legal-overlay__body{overflow:auto;overscroll-behavior:contain;padding:0 clamp(10px,2vw,28px) 28px}
.legal-overlay__panel{max-width:900px!important;margin:0 auto!important;padding-top:clamp(28px,5vw,62px)!important}
.legal-overlay__panel[hidden]{display:none!important}
.legal-overlay__panel h1{font-size:clamp(3rem,8vw,7rem)!important}
.legal-overlay__panel .consent-choice{margin-top:8px}

/* Cookie settings can open from inside the legal overlay and must still sit above it. */
.consent-scrim{z-index:14010!important}
.consent-dialog{z-index:14020!important}
.cursor{z-index:14050!important}
.paw-layer{z-index:14040!important}

@media(max-width:760px){
  .record-label #disc-brand{font-size:.49rem!important}
  .record-label #disc-track-no{font-size:1.85rem!important}
  .record-label #disc-track-title{font-size:.39rem!important;max-width:82px!important}
  .legal-overlay{padding:8px}
  .legal-overlay__sheet{width:100%;height:94vh;border-radius:20px}
  .legal-overlay__header{grid-template-columns:1fr auto;gap:10px;padding:12px}
  .legal-overlay__brand{display:none}
  .legal-overlay__tabs{justify-content:flex-start;overflow:auto;flex-wrap:nowrap;padding-bottom:2px}
  .legal-overlay__tabs button{white-space:nowrap}
  .legal-overlay__close{font-size:0;width:38px;padding:0}
  .legal-overlay__close span{font-size:1rem}
  .legal-overlay__body{padding-inline:10px}
  .where-track__current{display:none!important}
}

@media(prefers-reduced-motion:reduce){
  .amigo-dog-svg .dog-dance-shell{transform:none!important}
}
html.a11y-reduce-motion .amigo-dog-svg .dog-dance-shell{transform:none!important}

/* =========================================================
   V5.7 – measured audio cues, reliable legal overlay,
   longer living paw trail and corrected progress capsule
   ========================================================= */

/* Paw spoor: the positioned wrapper never animates. The SVG print itself starts
   exactly at cursor size (28px), visibly shrinks to the small spoor and lingers. */
.paw--trail{
  width:28px!important;
  height:28px!important;
  animation:none!important;
  opacity:1!important;
  background:transparent!important;
  transform:rotate(var(--r))!important;
  filter:none!important;
}
.paw--trail__print{
  width:28px!important;
  height:28px!important;
  will-change:transform,opacity!important;
}

/* Progress indicator: the number and section title are one capsule, positioned at
   the same live progress height as the paw. The paw/marker is always in front. */
.where-track{
  --where-progress:0%;
  overflow:visible!important;
}
.where-track__current{
  right:34px!important;
  top:clamp(42px,var(--where-progress),calc(100% - 42px))!important;
  transform:translateY(-50%)!important;
  z-index:20!important;
  width:auto!important;
  min-width:0!important;
  height:auto!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  overflow:visible!important;
}
.where-track__readout{
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  gap:13px!important;
  width:max-content!important;
  min-height:34px!important;
  padding:8px 15px 8px 12px!important;
  border-radius:999px!important;
  transform:rotate(-90deg)!important;
  transform-origin:right center!important;
  background:color-mix(in srgb,var(--track-token) 94%,transparent)!important;
  color:var(--track-accent)!important;
  border:1px solid color-mix(in srgb,var(--track-accent) 20%,transparent)!important;
  box-shadow:0 5px 18px rgba(23,19,18,.13)!important;
  backdrop-filter:blur(9px)!important;
  -webkit-backdrop-filter:blur(9px)!important;
}
.where-track__readout b{
  display:inline-block!important;
  min-width:24px!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  color:var(--track-accent)!important;
  font:italic 1.05rem/.95 var(--display)!important;
  text-align:center!important;
}
.where-track__readout>span,
.where-track:hover .where-track__readout>span,
.where-track__current:hover .where-track__readout>span,
.where-track__current:focus-visible .where-track__readout>span{
  display:inline-block!important;
  max-width:190px!important;
  opacity:1!important;
  overflow:visible!important;
  margin:0!important;
  white-space:nowrap!important;
  font-size:.91rem!important;
  line-height:1!important;
  letter-spacing:.05em!important;
  font-weight:850!important;
}
.where-track__route{z-index:40!important}
.where-track__meter{z-index:41!important;overflow:visible!important}
.where-track__meter::before{z-index:50!important}
.where-track__meter::after{z-index:51!important}

/* The record has no CSS animation at all. JS starts it only after audio.play()
   resolves and eases the rotational speed in/out. */
.record-disc,
.sound-story__disc .record-disc,
.sound-story__disc.is-playing .record-disc{
  animation:none!important;
  animation-name:none!important;
  transition:none!important;
}

/* The measured beat engine drives the notes. Keep motion slow and readable. */
.sound-note{will-change:transform,opacity!important}
.sound-note i{transform-origin:center!important}
.sound-story__disc.is-beat .sound-note i{transform:scale(1.16) rotate(-2deg)!important}

/* Legal/privacy layers must never cover the custom cursor. */
.legal-overlay{z-index:12000!important}
.consent-scrim{z-index:14010!important}
.consent-dialog{z-index:14020!important}
.reward-scrim{z-index:14100!important}
.reward-dialog{z-index:14110!important}
.cursor{z-index:15050!important}
.paw-layer{z-index:15040!important}

@media(max-width:760px){
  .where-track__current{display:none!important}
}

/* =========================================================
   V5.8 – definitive progress marker, legal cursor safety,
   turntable-owned motion and QA fixes
   ========================================================= */

/* Progress: one readable capsule for number + section, farther from the route.
   The marker itself is ONLY the supplied paw – no circular chip behind it. */
.where-track{
  overflow:visible!important;
}
.where-track__current{
  right:54px!important;
  top:clamp(45px,var(--where-progress),calc(100% - 45px))!important;
  transform:translateY(-50%)!important;
  width:max-content!important;
  height:auto!important;
  min-width:0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  opacity:1!important;
  z-index:70!important;
  overflow:visible!important;
}
.where-track__readout{
  display:flex!important;
  flex-direction:row!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:11px!important;
  width:max-content!important;
  min-width:max-content!important;
  min-height:36px!important;
  padding:8px 14px 8px 13px!important;
  border-radius:999px!important;
  transform:rotate(-90deg)!important;
  transform-origin:right center!important;
  background:color-mix(in srgb,var(--track-token) 95%,transparent)!important;
  color:var(--track-accent)!important;
  border:1px solid color-mix(in srgb,var(--track-accent) 21%,transparent)!important;
  box-shadow:0 5px 18px rgba(23,19,18,.12)!important;
  backdrop-filter:blur(10px)!important;
  -webkit-backdrop-filter:blur(10px)!important;
  overflow:visible!important;
}
.where-track__readout b{
  display:inline-block!important;
  flex:0 0 auto!important;
  min-width:25px!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  color:var(--track-accent)!important;
  font:italic 1.08rem/.94 var(--display)!important;
  text-align:center!important;
}
.where-track__readout>span,
.where-track:hover .where-track__readout>span,
.where-track__current:hover .where-track__readout>span,
.where-track__current:focus-visible .where-track__readout>span{
  display:inline-block!important;
  flex:0 0 auto!important;
  width:auto!important;
  max-width:none!important;
  opacity:1!important;
  overflow:visible!important;
  margin:0!important;
  white-space:nowrap!important;
  font-size:.96rem!important;
  line-height:1!important;
  letter-spacing:.05em!important;
  font-weight:850!important;
}
.where-track__meter::before{
  content:none!important;
  display:none!important;
}
.where-track__meter::after{
  content:""!important;
  display:block!important;
  position:absolute!important;
  left:50%!important;
  top:clamp(7px,var(--where-progress),calc(100% - 7px))!important;
  width:8px!important;
  height:8px!important;
  border:0!important;
  border-radius:0!important;
  background:var(--track-accent)!important;
  -webkit-mask:url("../icons/dogpaw.svg") center/contain no-repeat!important;
  mask:url("../icons/dogpaw.svg") center/contain no-repeat!important;
  transform:translate(-50%,-50%) rotate(var(--track-paw-angle))!important;
  transform-origin:center!important;
  filter:drop-shadow(0 1px 2px color-mix(in srgb,var(--track-token) 82%,transparent))!important;
  box-shadow:none!important;
  opacity:1!important;
  z-index:100!important;
  transition:top .12s linear,background .25s ease,transform .28s ease!important;
}
.where-track__meter,
.where-track__route{overflow:visible!important}

/* The record can never acquire a CSS-driven rotation. JavaScript alone owns it. */
.record-disc,
.sound-story__disc .record-disc,
.sound-story__disc.is-playing .record-disc{
  animation:none!important;
  animation-name:none!important;
  transition:none!important;
}

/* Legal/privacy overlays never hide the custom paw. Only the separate maker-credit
   reveal is allowed to suppress it. */
body.legal-overlay-open .cursor,
body.consent-open .cursor{
  opacity:1!important;
  visibility:visible!important;
  display:block!important;
  z-index:20050!important;
}
body.legal-overlay-open .paw-layer,
body.consent-open .paw-layer{
  opacity:1!important;
  visibility:visible!important;
  z-index:20040!important;
}
.legal-overlay{z-index:18000!important}
.consent-scrim{z-index:19010!important}
.consent-dialog{z-index:19020!important}

/* The smooth dog groove is driven by the inner SVG group; never scale the head. */
.amigo-dog-svg .dog-dance-shell{
  transform-origin:center!important;
  will-change:transform;
}

@media(max-width:760px){
  .where-track__current{display:none!important}
  .where-track__meter::after{width:8px!important;height:8px!important}
}
/* V5.8 micro-spacing: keep the readout a touch farther from the route. */
.where-track__current{right:62px!important}


/* =========================================================
   V5.9 – refined route marker + natural Amigo groove
   ========================================================= */
/* Progress readout: closer to the route, calmer type, still clearly separate. */
.where-track__current{
  right:43px!important;
}
.where-track__readout{
  gap:7px!important;
  min-height:31px!important;
  padding:6px 11px 6px 10px!important;
  border-radius:999px!important;
  box-shadow:0 4px 13px rgba(23,19,18,.10)!important;
}
.where-track__readout b{
  min-width:21px!important;
  font:italic 1rem/.96 var(--display)!important;
  font-weight:600!important;
}
.where-track__readout>span,
.where-track:hover .where-track__readout>span,
.where-track__current:hover .where-track__readout>span,
.where-track__current:focus-visible .where-track__readout>span{
  font-size:.84rem!important;
  line-height:1!important;
  letter-spacing:.045em!important;
  font-weight:650!important;
}
/* A little larger than V5.8, still only the paw and never a circular chip. */
.where-track__meter::after{
  width:12px!important;
  height:12px!important;
  filter:drop-shadow(0 1px 2px color-mix(in srgb,var(--track-token) 76%,transparent))!important;
}

/* Trail stays present a little less long than V5.8/V5.7; JS owns lifetime and shrink. */
.paw--trail__print{will-change:transform,opacity!important}

@media(max-width:760px){
  .where-track__meter::after{width:10px!important;height:10px!important}
}

/* =========================================================
   V5.10 – lighter route typography, balanced paw marker,
   subtler hunt clues and tuned living trail
   ========================================================= */
/* Progress typography: intentionally thin and quiet. */
.where-track__current{
  right:45px!important;
}
.where-track__readout{
  gap:8px!important;
  min-height:30px!important;
  padding:6px 11px 6px 10px!important;
}
.where-track__readout b{
  min-width:22px!important;
  font:italic 1rem/.96 var(--display)!important;
  font-weight:500!important;
}
.where-track__readout>span,
.where-track:hover .where-track__readout>span,
.where-track__current:hover .where-track__readout>span,
.where-track__current:focus-visible .where-track__readout>span{
  font-size:.80rem!important;
  line-height:1!important;
  letter-spacing:.075em!important;
  font-weight:470!important;
}
/* Paw is clearer than V5.9 but still cannot invade the readout. */
.where-track__meter::after{
  width:15px!important;
  height:15px!important;
  filter:drop-shadow(0 1px 2px color-mix(in srgb,var(--track-token) 72%,transparent))!important;
}

/* Easter eggs remain the same physical size, but read more like discoveries than UI. */
.sniff-world-layer{
  position:absolute;
  inset:0 0 auto 0;
  width:100%;
  height:var(--sniff-world-height,100vh);
  z-index:8200;
  pointer-events:none;
  overflow:visible;
}
.sniff-world-layer .sniff-spot{
  position:absolute!important;
  margin:-22px!important;
  z-index:1!important;
  pointer-events:auto!important;
}
.amigo-mode .sniff-world-layer .sniff-spot{
  opacity:.43!important;
  animation:sniffWhisperV510 10.8s ease-in-out infinite!important;
}
.amigo-mode .sniff-world-layer .sniff-spot:hover,
.amigo-mode .sniff-world-layer .sniff-spot:focus-visible{
  opacity:.92!important;
}
@keyframes sniffWhisperV510{
  0%,72%,100%{opacity:.43;filter:drop-shadow(0 1px 2px rgba(23,19,18,.16))}
  80%{opacity:.56;filter:drop-shadow(0 2px 3px rgba(23,19,18,.22))}
  88%{opacity:.45;filter:drop-shadow(0 1px 2px rgba(23,19,18,.16))}
}

@media(max-width:760px){
  .where-track__meter::after{width:12px!important;height:12px!important}
}
/* V5.10 final route micro-tuning after visual review. */
.where-track__readout>span,
.where-track:hover .where-track__readout>span,
.where-track__current:hover .where-track__readout>span,
.where-track__current:focus-visible .where-track__readout>span{
  font-size:.78rem!important;
  font-weight:400!important;
  letter-spacing:.085em!important;
}
.where-track__meter::after{width:16px!important;height:16px!important}
@media(max-width:760px){.where-track__meter::after{width:13px!important;height:13px!important}}

/* =========================================================
   V5.11 – hunt radar: subtle proximity pulse, no directional giveaway
   ========================================================= */
.amigo-hud{
  --radar-glow:rgba(244,198,55,.26);
}
.amigo-hud.is-nearby:not(.is-complete){
  animation:amigoRadarPulse 1.55s ease-in-out infinite!important;
}
.amigo-hud.is-nearby-strong:not(.is-complete){
  animation-duration:1.12s!important;
}
@keyframes amigoRadarPulse{
  0%,100%{
    box-shadow:0 15px 50px rgba(0,0,0,.24),0 0 0 0 rgba(244,198,55,0);
    border-color:rgba(255,255,255,.18);
    transform:translateY(0);
  }
  48%{
    box-shadow:0 15px 50px rgba(0,0,0,.24),0 0 0 6px var(--radar-glow);
    border-color:rgba(244,198,55,.62);
    transform:translateY(-1px);
  }
}
html.a11y-reduce-motion .amigo-hud.is-nearby{animation:none!important}
@media (prefers-reduced-motion:reduce){
  .amigo-hud.is-nearby{animation:none!important}
}


/* =========================================================
   V5.13 – stable progress readout + continuous hunt radar
   ========================================================= */
/* Only the paw travels. The section capsule stays fixed and changes only content. */
.where-track__current{top:50%!important;right:45px!important;transform:translateY(-50%)!important;transition:none!important}
.amigo-hud.is-radar-active:not(.is-complete){animation:amigoRadarV513 var(--radar-duration,1.8s) ease-in-out infinite!important;will-change:box-shadow,border-color,transform}
@keyframes amigoRadarV513{
  0%,100%{box-shadow:0 15px 50px rgba(0,0,0,.24),0 0 0 0 rgba(244,198,55,0);border-color:rgba(244,198,55,.30);transform:translateY(0) scale(1)}
  50%{box-shadow:0 15px 50px rgba(0,0,0,.24),0 0 0 var(--radar-ring,7px) rgba(244,198,55,var(--radar-alpha,.46));border-color:rgba(244,198,55,var(--radar-border,.68));transform:translateY(-1px) scale(var(--radar-scale,1.025))}
}
html.a11y-reduce-motion .amigo-hud.is-radar-active{animation:none!important}
@media (prefers-reduced-motion:reduce){.amigo-hud.is-radar-active{animation:none!important}}

/* V6.0: persistent single media element. Kept in the document (not display:none)
   for maximum iOS/Safari media reliability while remaining visually absent. */
.audio-engine {
  position: fixed !important;
  width: 1px !important;
  height: 1px !important;
  left: -9999px !important;
  bottom: 0 !important;
  opacity: .001 !important;
  pointer-events: none !important;
}

/* =========================================================
   V6.0 – Adaptive Performance Manager
   Quality classes are controlled by performance-manager-v6.3.js.
   Core design/function stays available; expensive decoration scales down first.
   ========================================================= */
html.perf-balanced .legal-overlay__backdrop,
html.perf-balanced .consent-scrim{
  backdrop-filter:blur(8px)!important;
  -webkit-backdrop-filter:blur(8px)!important;
}
html.perf-balanced .amigo-hud,
html.perf-balanced .where-track__readout{
  backdrop-filter:blur(7px)!important;
  -webkit-backdrop-filter:blur(7px)!important;
}

html.perf-low .site-header.is-scrolled,
html.perf-low .amigo-hud,
html.perf-low .where-track__readout,
html.perf-low .legal-overlay__backdrop,
html.perf-low .consent-scrim,
html.perf-low .consent-dialog,
html.perf-low .gallery-lightbox,
html.perf-low .reward-dialog{
  backdrop-filter:none!important;
  -webkit-backdrop-filter:none!important;
}
html.perf-low .site-header.is-scrolled{background:rgba(255,249,239,.96)!important}
html.perf-low .amigo-hud{background:rgba(23,19,18,.96)!important}
html.perf-low .where-track__readout{background:var(--track-token)!important}
html.perf-low .word-ribbon>.word-ribbon__track,
html.perf-low .future-card__icon i,
html.perf-low .video-frame::after{
  animation-play-state:paused!important;
}
html.perf-low .sniff-spot:not(:hover):not(:focus-visible){animation:none!important}
html.perf-low .sound-note i{transition:none!important}
html.perf-low .hero__media{will-change:auto!important}
html.perf-balanced .record-disc,
html.perf-low .record-disc{will-change:transform}
html.perf-low .paw--trail{filter:none!important}

/* Audio truth: no visual spin is ever supplied by CSS. The JS media state is the
   single source of truth for record, notes and Amigo movement. */
.record-disc,
.sound-story__disc .record-disc,
.sound-story__disc.is-playing .record-disc{
  animation:none!important;
  animation-name:none!important;
}

/* =========================================================
   V6.3 – location stamp + tracker alignment cleanup
   ========================================================= */
/* Keep the location word clean: the interaction hint used to sit on top of it. */
.hero__badge small{
  display:block!important;
  font-size:.62rem!important;
  line-height:1.05!important;
  font-weight:700!important;
  letter-spacing:.055em!important;
  text-transform:none!important;
  white-space:nowrap!important;
}
.hero__badge em{
  bottom:-19px!important;
  color:rgba(255,255,255,.78)!important;
  text-shadow:0 1px 4px rgba(0,0,0,.72)!important;
  opacity:.82!important;
}

/* The route label is optically centred on the route. Rotating around its own centre
   avoids the previous visual offset caused by the right-edge transform origin. */
.where-track__current{
  top:50%!important;
  right:46px!important;
  transform:translateY(-50%)!important;
}
.where-track__readout{
  transform:rotate(-90deg)!important;
  transform-origin:center center!important;
}

/* The hero's “entdecken” hint no longer sits behind the moving tracker paw. */
.hero__scroll{
  right:92px!important;
  top:24%!important;
}

@media(max-width:760px){
  .hero__badge em{display:none!important}
}

/* =========================================================
   V6.3 – clean note rendering, stable tracker, fair Easter hunt
   ========================================================= */

/* Music symbols: no black text/filter shadows, explicit mustard glyph fill.
   Notes now become visible just outside the centre label, so their first frame can
   never read as a stray black dot on top of the artwork/video. */
.sound-note{
  text-shadow:none!important;
  filter:none!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
.sound-note i{
  color:var(--mustard)!important;
  -webkit-text-fill-color:var(--mustard)!important;
  text-shadow:none!important;
  filter:none!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
  font-family:"Segoe UI Symbol","Arial Unicode MS","Noto Sans Symbols 2","Noto Sans Symbols",sans-serif!important;
}
.record-label .record-label__hole{
  width:4px!important;
  height:4px!important;
  box-shadow:none!important;
  background:rgba(23,19,18,.68)!important;
}

/* Desktop tracker: fixed-size capsule = no lateral/vertical jump when the section
   title changes. It sits closer to the route while the paw remains independent. */
@media(min-width:1161px){
  .where-track__current{
    top:50%!important;
    right:34px!important;
    transform:translateY(-50%)!important;
    width:auto!important;
    min-width:0!important;
    transition:none!important;
  }
  .where-track__readout{
    width:104px!important;
    min-width:104px!important;
    max-width:104px!important;
    justify-content:center!important;
    transform:rotate(-90deg)!important;
    transform-origin:center center!important;
    transition:none!important;
  }
  .where-track__readout>span{
    max-width:62px!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
}

/* Easter eggs live in a dedicated top-level document layer and can never be hidden
   behind ordinary page cards/images. Their opacity stays deliberately subtle. */
.sniff-world-layer{z-index:9000!important;pointer-events:none!important}
.sniff-world-layer .sniff-spot{z-index:2!important;pointer-events:auto!important}
.amigo-mode .sniff-world-layer .sniff-spot{
  opacity:.47!important;
  visibility:visible!important;
}
.amigo-mode .sniff-world-layer .sniff-spot:hover,
.amigo-mode .sniff-world-layer .sniff-spot:focus-visible{opacity:.96!important}
/* V6.3 visual QA micro-alignment: keep the fixed readout close to the route without touching the paw. */
@media(min-width:1161px){.where-track__current{right:-4px!important}}

/* =========================================================
   V6.3 – pointer choices, clearer vinyl, tracker text, tooltip
   ========================================================= */

/* Compact pointer preferences sit next to Amigo Mode on desktop only. */
.amigo-mode-control{position:relative;display:flex;align-items:center}
.amigo-mode-hint{
  position:absolute;right:0;top:calc(100% + 12px);width:250px;padding:13px 14px;
  border:1px solid rgba(255,255,255,.20);border-radius:16px 6px 16px 6px;
  background:rgba(23,19,18,.94);color:var(--cream);box-shadow:0 16px 40px rgba(0,0,0,.24);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-4px);
  transition:opacity .18s ease,transform .18s ease,visibility .18s ease;z-index:12050;
}
.amigo-mode-hint::before{content:"";position:absolute;right:24px;top:-6px;width:11px;height:11px;background:rgba(23,19,18,.94);transform:rotate(45deg);border-left:1px solid rgba(255,255,255,.15);border-top:1px solid rgba(255,255,255,.15)}
.amigo-mode-hint strong{display:block;font-size:.67rem;letter-spacing:.05em;text-transform:uppercase;color:var(--mustard);margin-bottom:5px}
.amigo-mode-hint span{display:block;font-size:.67rem;line-height:1.45;opacity:.88}
.amigo-mode-control:hover .amigo-mode-hint,.amigo-mode-control:focus-within .amigo-mode-hint{opacity:1;visibility:visible;transform:translateY(0)}

.pointer-preferences{display:flex;align-items:center;gap:7px;margin-left:1px}
.trail-toggle{
  min-height:38px;border:1px solid currentColor;background:transparent;color:inherit;border-radius:999px;
  padding:7px 9px;display:flex;align-items:center;gap:6px;font-size:.61rem;font-weight:800;
  text-transform:uppercase;letter-spacing:.07em;transition:background .18s ease,opacity .18s ease
}
.trail-toggle__mark{width:16px;height:16px;background:currentColor;display:block;-webkit-mask:url("../icons/dogpaw.svg") center/contain no-repeat;mask:url("../icons/dogpaw.svg") center/contain no-repeat;opacity:.95}
.trail-toggle.is-off{opacity:.56}
.trail-toggle.is-off .trail-toggle__mark{opacity:.42}

.cursor-style-switch{display:flex;align-items:center;gap:5px;min-height:38px;padding:5px 7px;border:1px solid currentColor;border-radius:999px;cursor:pointer;user-select:none}
.cursor-style-switch input{position:absolute;opacity:0;pointer-events:none}
.cursor-style-switch__paw{width:14px;height:14px;background:currentColor;-webkit-mask:url("../icons/dogpaw.svg") center/contain no-repeat;mask:url("../icons/dogpaw.svg") center/contain no-repeat}
.cursor-style-switch__track{position:relative;width:28px;height:16px;border-radius:999px;background:rgba(127,127,127,.28);box-shadow:inset 0 0 0 1px rgba(127,127,127,.28)}
.cursor-style-switch__track i{position:absolute;left:2px;top:2px;width:12px;height:12px;border-radius:50%;background:var(--mustard);transition:transform .18s ease}
.cursor-style-switch input:checked + .cursor-style-switch__track i{transform:translateX(12px)}
.cursor-style-switch__pointer{position:relative;width:14px;height:18px;display:block}
.cursor-style-switch__pointer::before{content:"";position:absolute;inset:1px 2px 2px 1px;background:currentColor;clip-path:polygon(0 0,0 82%,27% 61%,46% 100%,62% 92%,43% 56%,83% 56%)}
.cursor-style-switch:focus-within{outline:3px solid currentColor;outline-offset:3px}

/* Alternative cursor remains custom, but reads more like a pointer than a paw. */
body.cursor-style-pointer .cursor{
  width:28px!important;height:30px!important;background:transparent!important;
  -webkit-mask:none!important;mask:none!important;
  transform:translate3d(var(--cursor-x),var(--cursor-y),0) rotate(-10deg) scale(var(--paw-scale))!important;
  filter:drop-shadow(0 2px 4px rgba(23,19,18,.26))!important;
}
body.cursor-style-pointer .cursor::before{
  content:"";position:absolute;left:3px;top:2px;width:21px;height:26px;background:var(--paw-color);
  clip-path:polygon(0 0,0 82%,28% 61%,47% 100%,64% 92%,44% 56%,86% 56%);
}
body.cursor-style-pointer .cursor::after{content:"";position:absolute;left:2px;top:1px;width:5px;height:5px;border-radius:50%;background:var(--mustard);box-shadow:0 0 0 1px rgba(23,19,18,.45)}
body.cursor-style-pointer .cursor.is-hover::before{background:var(--coral)}
body.cursor-style-pointer .cursor.is-click::before{background:var(--turquoise)}
body.trail-disabled .paw--trail{display:none!important}

/* A little more presence for the record on dim/low-contrast screens. */
.record-disc{
  box-shadow:
    0 0 0 1px rgba(255,255,255,.16),
    0 0 0 7px rgba(244,198,55,.055),
    0 30px 72px rgba(0,0,0,.46)!important;
}
.record-disc::after{content:"";position:absolute;inset:1.5%;border-radius:50%;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.055),inset 0 0 30px rgba(255,255,255,.025)}

/* Bass/low mids stay in flight longer; high tones leave more quickly (JS duration). */
.sound-note[data-band="bass"]{opacity:.96}
.sound-note[data-band="lowmid"]{opacity:.94}
.sound-note[data-band="highmid"],.sound-note[data-band="high"]{font-weight:800}

/* Desktop route readout: fixed width large enough for the longest label. No hover reveal. */
@media(min-width:1161px){
  .where-track__current{right:2px!important}
  .where-track__readout{
    width:166px!important;min-width:166px!important;max-width:166px!important;
    justify-content:center!important;gap:8px!important;
  }
  .where-track__readout>span,
  .where-track:hover .where-track__readout>span,
  .where-track__current:hover .where-track__readout>span,
  .where-track__current:focus-visible .where-track__readout>span{
    display:inline-block!important;max-width:none!important;width:auto!important;
    overflow:visible!important;text-overflow:clip!important;opacity:1!important;margin:0!important;
    white-space:nowrap!important;
  }
}

/* Accessibility launcher: right-hand lower corner on every device. */
.a11y-tools{left:auto!important;right:14px!important;bottom:14px!important}
.a11y-panel{left:auto!important;right:0!important}
@media(max-width:760px){
  .a11y-tools{left:auto!important;right:10px!important;bottom:52px!important}
  .a11y-panel{left:auto!important;right:0!important;bottom:52px!important}
}

@media(max-width:980px){
  .pointer-preferences{display:none!important}
  .amigo-mode-hint{display:none!important}
}
@media(max-width:1160px) and (min-width:981px){
  .trail-toggle b{display:none!important}
  .trail-toggle{padding-left:8px!important;padding-right:8px!important}
}
@media(prefers-reduced-motion:reduce){.amigo-mode-hint{transition:none!important}}


/* =========================================================
   V6.4 – tracker spacing micro-fix
   ========================================================= */
/* Bring the fixed desktop readout capsule back close to the route.
   With the 166px rotated capsule, right:2px left a ~56px visual gap.
   The negative offset moves only the readout toward the route; paw and meter stay untouched. */
@media(min-width:1161px){
  .where-track__current{right:-38px!important}
}

/* =========================================================
   V6.5 – pointer switch focus, hunt HUD placement
   ========================================================= */
/* Clicking the cursor-style slider must not draw the browser-like outer focus box.
   Keyboard focus remains visible as a subtle change inside the switch track. */
.cursor-style-switch:focus-within{outline:none!important;outline-offset:0!important}
.cursor-style-toggle:focus-visible + .cursor-style-switch__track{
  background:rgba(244,198,55,.24)!important;
  box-shadow:inset 0 0 0 1px rgba(127,127,127,.30)!important;
}

/* Keep the hunt counter directly to the left of the accessibility control. */
.amigo-hud{
  right:68px!important;
  bottom:14px!important;
  z-index:189!important;
}
@media(max-width:760px){
  .amigo-hud{
    right:64px!important;
    bottom:52px!important;
  }
}

/* =========================================================
   V7.6 – mobile floating controls: Amigo hunt counter sits
   directly LEFT of the accessibility launcher
   ========================================================= */
@media (max-width:760px){
  /* Accessibility stays anchored at the lower-right edge. */
  .a11y-tools{
    left:auto!important;
    right:max(10px,env(safe-area-inset-right, 0px))!important;
    bottom:calc(52px + env(safe-area-inset-bottom, 0px))!important;
  }
  .a11y-launcher{
    width:44px!important;
    height:44px!important;
    min-width:44px!important;
    min-height:44px!important;
  }
  .a11y-panel{
    left:auto!important;
    right:0!important;
    bottom:54px!important;
    max-height:min(68vh,520px);
    overflow:auto;
    overscroll-behavior:contain;
  }

  /* One horizontal control row: HUD pill + 8px gap + Aa circle. */
  .amigo-hud{
    right:calc(max(10px,env(safe-area-inset-right, 0px)) + 52px)!important;
    bottom:calc(52px + env(safe-area-inset-bottom, 0px))!important;
    min-width:0!important;
    min-height:44px!important;
    width:max-content!important;
    max-width:calc(100vw - 82px)!important;
    padding:7px 11px!important;
    border-radius:999px!important;
    white-space:nowrap!important;
    display:flex!important;
    align-items:center!important;
    transform-origin:right bottom!important;
  }
  body:not(.amigo-mode) .amigo-hud{display:none!important}
  .amigo-hud span{
    display:inline-block!important;
    margin:0 7px 0 0!important;
    padding-right:7px!important;
    border-right:1px solid rgba(255,255,255,.26);
    font-size:.49rem!important;
    letter-spacing:.12em!important;
  }
  .amigo-hud b{
    display:inline!important;
    margin:0!important;
    font-size:.64rem!important;
    letter-spacing:.075em!important;
  }
}

/* Extra-narrow phones: keep the same row and preserve the 44px touch target. */
@media (max-width:380px){
  .amigo-hud{padding:6px 9px!important}
  .amigo-hud span{font-size:.46rem!important;margin-right:6px!important;padding-right:6px!important}
  .amigo-hud b{font-size:.61rem!important}
}


/* =========================================================
   V7.9 – opening hours inside "Amigo wohnt hier"
   ========================================================= */
.opening-hours{
  display:grid;
  grid-template-columns:minmax(0,1.08fr) minmax(220px,.92fr);
  gap:18px;
  align-items:stretch;
  width:min(100%,620px);
  margin:2px 0 28px;
}
.opening-hours__lead{
  position:relative;
  padding:22px 22px 24px;
  border:1px solid rgba(23,19,18,.14);
  border-radius:22px 7px 22px 7px;
  background:rgba(255,255,255,.38);
  overflow:hidden;
}
.opening-hours__lead::after{
  content:"";
  position:absolute;
  right:-22px;
  bottom:-30px;
  width:92px;
  height:92px;
  border:1px solid rgba(23,19,18,.11);
  border-radius:50%;
}
.opening-hours__eyebrow{
  display:block;
  margin:0 0 12px;
  font-size:.61rem;
  font-weight:900;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--coral-deep);
}
.opening-hours h3{
  position:relative;
  z-index:1;
  margin:0;
  font:500 clamp(1.9rem,3vw,2.85rem)/.92 var(--display);
  letter-spacing:-.045em;
}
.opening-hours h3 em{
  color:var(--coral);
  font-weight:500;
}
.opening-hours__board{
  position:relative;
  display:flex;
  flex-direction:column;
  justify-content:center;
  min-height:168px;
  padding:22px;
  border-radius:7px 22px 7px 22px;
  background:var(--mustard);
  color:var(--ink);
  box-shadow:0 16px 36px rgba(23,19,18,.09);
  transform:rotate(.7deg);
}
.opening-hours__board::before{
  content:"";
  position:absolute;
  top:12px;
  right:14px;
  width:9px;
  height:9px;
  border-radius:50%;
  background:var(--coral);
  box-shadow:0 0 0 5px rgba(255,255,255,.22);
}
.opening-hours__board>span{
  margin-bottom:11px;
  font-size:.6rem;
  font-weight:900;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.opening-hours__board>strong{
  max-width:220px;
  font:500 1.58rem/1 var(--display);
  letter-spacing:-.025em;
}
.opening-hours__board>small{
  display:block;
  margin-top:13px;
  max-width:250px;
  font-size:.68rem;
  line-height:1.45;
  opacity:.72;
}

@media(max-width:620px){
  .opening-hours{
    grid-template-columns:1fr;
    gap:10px;
    width:100%;
    margin:0 0 25px;
  }
  .opening-hours__lead{padding:19px 18px 20px}
  .opening-hours h3{font-size:clamp(2rem,10vw,2.75rem)}
  .opening-hours__board{
    min-height:0;
    padding:19px 18px 20px;
    transform:none;
  }
  .opening-hours__board>strong{font-size:1.5rem}
}

/* V8.0 · zentrale Betriebsdaten */
.opening-hours__board.is-live{display:grid;gap:0}.opening-live__row{display:grid;grid-template-columns:minmax(90px,1fr) auto;gap:18px;padding:7px 0;border-top:1px solid rgba(23,19,18,.14);font-size:.78rem}.opening-live__row:first-of-type{margin-top:8px}.opening-live__row b{font-weight:850}.opening-live__row span{text-align:right}.opening-live__note{display:block;margin-top:10px;opacity:.62;line-height:1.45}.find-social{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.find-social[hidden]{display:none}.find-social a{display:inline-flex;align-items:center;gap:7px;border:1px solid rgba(23,19,18,.2);border-radius:999px;padding:8px 11px;text-decoration:none;font-size:.7rem;font-weight:850}.find-social a::after{content:'↗';font-size:.8em}.legal-dl a[data-site-wko-link]{display:inline-block;margin-left:8px;font-size:.82em}.site-data-hidden{display:none!important}
html.perf-low .find-social a{transition:none!important}.perf-reduced-motion *{scroll-behavior:auto!important}
@media(max-width:560px){.opening-live__row{grid-template-columns:1fr auto;gap:10px}.find-social{gap:6px}.find-social a{padding:7px 9px;font-size:.66rem}}
