#croque-tracking-section{--tracking-yellow: #ffbd29;--tracking-blue: #3fa8f4;--tracking-red: #ff3635;--tracking-green: #70c663;--tracking-cream: #fff8e8;--tracking-black: #111111;padding:clamp(3rem,6vw,7rem) 0 clamp(4rem,7vw,8rem);overflow:hidden;background:var(--tracking-cream)}.croque-tracking__shell{display:grid;gap:clamp(2.4rem,4vw,4rem)}.croque-tracking__hero{position:relative;display:grid;grid-template-columns:minmax(0,.86fr) minmax(34rem,1.14fr);align-items:center;min-height:clamp(34rem,48vw,54rem);padding:clamp(2.4rem,5vw,5.5rem);overflow:hidden;border:2px solid var(--tracking-black);border-radius:3rem;background:var(--tracking-blue);box-shadow:10px 10px 0 var(--tracking-black)}.croque-tracking__copy{position:relative;z-index:3}.croque-tracking__eyebrow{display:inline-flex;margin:0 0 1rem;padding:.6rem 1.1rem;border:2px solid var(--tracking-black);border-radius:999px;background:var(--tracking-yellow);font:900 1.2rem/1 var(--croque-font-body);letter-spacing:.07em;text-transform:uppercase}.croque-tracking h1{max-width:9ch;margin:0;color:#fff;font-family:var(--croque-font-heading);font-size:clamp(4.2rem,6vw,7.4rem);letter-spacing:-.04em;line-height:.94}.croque-tracking__lead{max-width:48ch;margin:1.5rem 0 0;color:#fff;font:600 clamp(1.45rem,1.6vw,1.8rem)/1.55 var(--croque-font-body)}.croque-tracking__scene{position:relative;align-self:stretch;min-height:30rem}.croque-tracking__truck-wrap{position:absolute;z-index:2;right:-2%;bottom:12%;width:min(105%,72rem);transform-origin:50% 90%;animation:croque-truck-enter 1.1s cubic-bezier(.2,.8,.2,1) both,croque-truck-bob 2.4s ease-in-out 1.1s infinite}.croque-tracking__truck{display:block;width:100%;height:auto;object-fit:contain}.croque-tracking__truck-placeholder{position:absolute;right:6%;bottom:18%;display:grid;place-items:center;width:78%;aspect-ratio:2/1;padding:2rem;border:2px dashed rgba(17,17,17,.65);border-radius:2rem;background:#ffffff2e;color:#111;font:800 1.4rem/1.35 var(--croque-font-body);text-align:center}.croque-tracking__road{position:absolute;right:-15%;bottom:8%;left:-15%;height:5.5rem;border-top:2px solid var(--tracking-black);background:#a7a7a7;transform:skew(-8deg)}.croque-tracking__road span{position:absolute;top:2.2rem;width:8rem;height:.45rem;background:#fff;border-radius:999px;animation:croque-road 1.4s linear infinite}.croque-tracking__road span:nth-child(1){left:12%}.croque-tracking__road span:nth-child(2){left:48%}.croque-tracking__road span:nth-child(3){left:82%}.croque-tracking__doodle{position:absolute;z-index:1;color:#111;font-size:4rem;line-height:1;animation:croque-spark 3s ease-in-out infinite}.croque-tracking__doodle--one{top:12%;left:14%}.croque-tracking__doodle--two{top:22%;right:10%;animation-delay:-1.3s}.croque-tracking__card{display:grid;grid-template-columns:minmax(20rem,.7fr) minmax(0,1.3fr);gap:clamp(1.8rem,3vw,3.5rem);align-items:center;padding:clamp(2rem,3vw,3.2rem);background:#fff;border:2px solid var(--tracking-black);border-radius:2.4rem;box-shadow:8px 8px 0 var(--tracking-yellow)}.croque-tracking__card h2{margin:0 0 .6rem;font-family:var(--croque-font-heading);font-size:clamp(2.5rem,3vw,3.6rem);line-height:1}.croque-tracking__hint{margin:0;color:#555;font:600 1.35rem/1.45 var(--croque-font-body)}.croque-tracking__form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.8rem}.croque-tracking__input{width:100%;min-height:5.4rem;padding:1.2rem 1.6rem;color:var(--tracking-black);background:#fff;border:2px solid var(--tracking-black);border-radius:999px;font:700 1.5rem/1.2 var(--croque-font-body)}.croque-tracking__input:focus-visible{outline:3px solid rgba(63,168,244,.35);outline-offset:3px}.croque-tracking__button{min-height:5.4rem;padding:1.2rem 2.4rem;cursor:pointer;color:#111;background:var(--tracking-yellow);border:2px solid #111;border-radius:999px;box-shadow:4px 4px #111;font:900 1.5rem/1 var(--croque-font-body);transition:transform .18s ease,box-shadow .18s ease}.croque-tracking__button:hover{transform:translate(2px,2px);box-shadow:2px 2px #111}.croque-tracking__result{grid-column:1/-1;min-height:0;margin-top:.4rem}.croque-tracking__help{grid-column:1/-1;display:flex;gap:.8rem;align-items:flex-start;margin:0;padding-top:1.4rem;border-top:1px solid rgba(0,0,0,.14);color:#555;font:600 1.25rem/1.5 var(--croque-font-body)}.croque-tracking__help:before{content:"?";display:grid;flex:0 0 2.4rem;place-items:center;width:2.4rem;height:2.4rem;color:#fff;background:var(--tracking-red);border-radius:50%;font-weight:900}@keyframes croque-truck-enter{0%{transform:translate(45%) translateY(3%) rotate(1deg);opacity:0}to{transform:translate(0) translateY(0) rotate(0);opacity:1}}@keyframes croque-truck-bob{0%,to{transform:translateY(0) rotate(0)}50%{transform:translateY(-5px) rotate(-.35deg)}}@keyframes croque-road{0%{transform:translate(0)}to{transform:translate(-16rem)}}@keyframes croque-spark{0%,to{transform:rotate(0) scale(1);opacity:.8}50%{transform:rotate(22deg) scale(1.15);opacity:1}}@media(prefers-reduced-motion:reduce){.croque-tracking__truck-wrap,.croque-tracking__road span,.croque-tracking__doodle{animation:none!important}}@media screen and (max-width:989px){.croque-tracking__hero{grid-template-columns:1fr;min-height:auto}.croque-tracking h1{max-width:12ch}.croque-tracking__scene{min-height:30rem;margin-top:1rem}.croque-tracking__truck-wrap{right:4%;width:min(92%,68rem)}.croque-tracking__card{grid-template-columns:1fr}.croque-tracking__result,.croque-tracking__help{grid-column:auto}}@media screen and (max-width:549px){#croque-tracking-section{padding:2rem 0 4.5rem}.croque-tracking__hero{padding:2.2rem 1.7rem 1.3rem;border-radius:2rem;box-shadow:6px 6px #111}.croque-tracking__scene{min-height:22rem}.croque-tracking__truck-wrap{right:-3%;bottom:14%;width:105%}.croque-tracking__road{bottom:7%;height:4.5rem}.croque-tracking__form{grid-template-columns:1fr}.croque-tracking__button{width:100%}.croque-tracking__card{padding:2rem 1.6rem;border-radius:1.8rem;box-shadow:6px 6px 0 var(--tracking-yellow)}}#croque-tracking-section{padding-top:clamp(2rem,3.5vw,4rem)}.croque-tracking__shell{gap:clamp(1.8rem,2.5vw,2.8rem)}.croque-tracking__hero{grid-template-columns:minmax(0,1fr) minmax(28rem,.75fr);min-height:clamp(24rem,30vw,32rem);padding:clamp(2rem,3vw,3.2rem);border-radius:2.4rem}.croque-tracking h1{max-width:12ch;font-size:clamp(3.4rem,4.6vw,5.5rem);line-height:.98}.croque-tracking__lead{max-width:44ch;margin-top:1rem;font-size:clamp(1.35rem,1.35vw,1.6rem)}.croque-tracking__scene{min-height:20rem}.croque-tracking__truck-wrap{right:1%;bottom:15%;width:min(88%,46rem)}.croque-tracking__truck-placeholder{right:8%;bottom:20%;width:72%}.croque-tracking__road{bottom:7%;height:4.4rem}.croque-tracking__card{grid-template-columns:minmax(19rem,.55fr) minmax(0,1.45fr);padding:clamp(2rem,2.5vw,2.8rem);box-shadow:8px 8px 0 var(--tracking-yellow)}@media screen and (max-width:989px){.croque-tracking__hero{grid-template-columns:minmax(0,1fr) minmax(22rem,.7fr)}.croque-tracking__scene{min-height:18rem;margin-top:0}.croque-tracking__truck-wrap{right:-2%;width:min(100%,40rem)}}@media screen and (max-width:749px){.croque-tracking__hero{grid-template-columns:1fr;padding-bottom:1.4rem}.croque-tracking__scene{min-height:14rem}.croque-tracking__truck-wrap{right:4%;bottom:14%;width:min(88%,36rem)}.croque-tracking__card{grid-template-columns:1fr}}@media screen and (max-width:549px){.croque-tracking h1{font-size:clamp(3rem,10vw,4.2rem)}.croque-tracking__scene{min-height:11.5rem}.croque-tracking__truck-wrap{right:6%;width:78%}}@media screen and (min-width:990px){.croque-tracking__scene{min-height:23rem}.croque-tracking__truck-wrap{right:2%;bottom:10%;width:min(82%,42rem)}}@media screen and (min-width:750px)and (max-width:989px){.croque-tracking__scene{min-height:21rem}.croque-tracking__truck-wrap{right:1%;bottom:10%;width:min(90%,38rem)}}@media screen and (max-width:749px){.croque-tracking__scene{min-height:16rem}.croque-tracking__truck-wrap{right:5%;bottom:10%;width:min(82%,34rem)}}@media screen and (max-width:549px){.croque-tracking__scene{min-height:13.5rem}.croque-tracking__truck-wrap{right:7%;bottom:9%;width:74%}}
/*# sourceMappingURL=/cdn/shop/t/45/assets/component-croque-tracking.css.map */