/* page: store */

/* page: store — page-specific styles only */

/* page: store — extracted from store.html; keep page-specific rules only */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

:root{--teal:#00A896;--orange:#DD6F3E;--brown:#3D2321;--copper:#C37F58;--sand:#F3E9D2;--beige:#B7A095;--color-sand:#F4F1EB;--color-copper:#B85B38;--color-copper-dark:#9A4A2B;--text-dark:#2A1A17;--text-light:#FDFCFB;--font-main:'Lato',sans-serif}

html{scroll-behavior:smooth;-webkit-scroll-behavior:smooth;-webkit-text-size-adjust:100%;text-size-adjust:100%}

body{font-family:'Inter',sans-serif;color:var(--brown);background:#fff;overflow-x:hidden;-webkit-font-smoothing:antialiased;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left);-moz-text-size-adjust:100%;-ms-text-size-adjust:100%}

button,a{-webkit-tap-highlight-color:rgba(0,168,150,.2);-webkit-user-select:none;user-select:none}

button,a,input,textarea,select{-webkit-touch-callout:none}

input[type="text"],input[type="email"],input[type="tel"],input[type="date"],textarea,select{font-size:16px}

input:focus,textarea:focus,button:focus{outline:2px solid var(--teal);outline-offset:2px}

button,a.btn,input[type="button"],input[type="submit"]{min-height:44px;min-width:44px;padding:12px 16px;font-size:16px}

.hamburger{display:none;background:none;border:none;cursor:pointer;padding:4px;color:#fff;font-size:22px}

/* HERO */
.hero{
  min-height:44vh;
  display:flex;
  align-items:flex-end;
  padding:0 5% 56px;
  position:relative;
  overflow:hidden;
  background-color:var(--brown,#3D2321);
  /* CSS background so the image shows even if <img> is constrained by global img rules */
  background-image:url('../../images/banner/IMG_2954.webp');
  background-size:cover;
  background-position:center 30%;
  background-repeat:no-repeat;
}

.hero-bg,
img.hero-bg{
  position:absolute !important;
  inset:0 !important;
  top:0;right:0;bottom:0;left:0;
  width:100% !important;
  height:100% !important;
  max-width:none !important;
  max-height:none !important;
  object-fit:cover !important;
  object-position:center 30% !important;
  display:block !important;
  z-index:0;
  margin:0;
  padding:0;
  border:0;
}

.hero::before{content:'';position:absolute;inset:0;background:linear-gradient(160deg,rgba(61,35,33,.35) 0%,rgba(61,35,33,.78) 100%);z-index:1;pointer-events:none}

.hero-inner{position:relative;z-index:2;max-width:680px}

.eyebrow{font-size:11px;font-weight:700;letter-spacing:3px;text-transform:uppercase;color:rgba(243,233,210,.75);margin-bottom:12px}

.hero h1{font-family:'Playfair Display',serif;font-size:clamp(2.2rem,5vw,3.6rem);color:#fff;line-height:1.1;margin-bottom:14px}

.hero p{color:rgba(243,233,210,.82);font-size:1rem;line-height:1.7;max-width:460px}

/* STORE */
.store-wrap{max-width:1300px;margin:0 auto;padding:64px 5% 100px;display:grid;grid-template-columns:1fr 320px;gap:56px;align-items:start}

.filter-bar{display:flex;gap:8px;margin-bottom:44px;flex-wrap:wrap;align-items:center}

.filter-label{font-size:11px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--beige);margin-right:4px}

.pill{padding:6px 16px;border-radius:30px;border:1.5px solid rgba(61,35,33,.18);background:transparent;font-size:12px;font-weight:600;color:var(--brown);cursor:pointer;transition:background .0.3s,color .2s,border-color .2s}

.pill:hover,.pill.on{background:var(--brown);color:#fff;border-color:var(--brown)}

.products-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:28px}

.p-card{background:#fff;border:1px solid rgba(61,35,33,.07);border-radius:12px;overflow:hidden;transition:transform .0.3s ease,box-shadow .35s}

.p-card:hover{transform:translateY(-5px);box-shadow:0 16px 44px rgba(61,35,33,.09)}

.p-img{position:relative;padding-top:95%;overflow:hidden;background:var(--sand)}

.p-img img{position:absolute;inset:0;width:100%!important;height:100%!important;max-width:none!important;object-fit:cover;transition:transform .0.3s ease;display:block}

.p-card:hover .p-img img{transform:scale(1.05)}

.blank{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:var(--beige);font-size:2.8rem}

.p-badge{position:absolute;top:12px;left:12px;background:var(--orange);color:#fff;font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;padding:3px 9px;border-radius:20px;z-index:2}

.p-shipping{display:block;font-size:10px;color:var(--teal);margin:4px 0 8px;font-weight:600}

.p-shipping i{margin-right:4px}

.btn-lulu{background:var(--teal)}

.btn-lulu:hover{background:#008b7a}

.btn-printify{background:#7B68EE}

.btn-printify:hover{background:#6A5ACD}

.p-body{padding:18px}

.p-cat{font-size:10px;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--teal);margin-bottom:5px}

.p-name{font-family:'Playfair Display',serif;font-size:1.1rem;color:var(--brown);margin-bottom:7px;line-height:1.3}

.p-subtitle{display:block;color:var(--beige);font-size:0.85em;margin-top:2px;font-family:inherit;font-weight:400}

.p-desc{font-size:13px;color:#666;margin-bottom:12px;line-height:1.6;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-clamp:2;overflow:hidden}

.p-foot{display:flex;align-items:center;justify-content:space-between;gap:8px}

.p-price{font-size:1.1rem;font-weight:700;color:var(--brown)}

.p-price small{font-size:11px;font-weight:400;color:var(--beige)}

.btn-add{background:var(--brown);color:#fff;border:none;border-radius:8px;padding:8px 15px;font-size:12px;font-weight:700;cursor:pointer;transition:background .0.3s;display:flex;align-items:center;gap:5px;white-space:nowrap}

.btn-add:hover{background:var(--teal)}

.v-row{margin-bottom:10px}

.v-label{font-size:10px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--beige);margin-bottom:4px}

.v-sel{width:100%;padding:7px 10px;border:1.5px solid rgba(61,35,33,.13);border-radius:7px;font-family:'Inter',sans-serif;font-size:13px;color:var(--brown);background:#fff;outline:none}

.v-sel:focus{border-color:var(--teal)}

.empty{grid-column:1/-1;text-align:center;padding:90px 20px;color:var(--beige)}

.empty i{font-size:3rem;margin-bottom:16px;display:block}

.empty h3{font-family:'Playfair Display',serif;font-size:1.3rem;color:var(--brown);margin-bottom:8px}

.empty p{font-size:14px;color:#999;max-width:340px;margin:0 auto;line-height:1.8}

/* CART */
.cart-box{background:var(--sand);border-radius:14px;padding:26px;border:1px solid rgba(61,35,33,.07);position:sticky;top:100px}

.cart-head{font-family:'Playfair Display',serif;font-size:1.2rem;color:var(--brown);margin-bottom:16px;display:flex;align-items:center;gap:8px}

.cart-badge{background:var(--orange);color:#fff;font-family:'Inter',sans-serif;font-size:10px;font-weight:700;min-width:20px;height:20px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;padding:0 4px}

.c-empty{text-align:center;padding:24px 0;color:var(--beige);font-size:13px}

.c-empty i{font-size:1.8rem;margin-bottom:8px;display:block}

.c-item{display:flex;gap:10px;margin-bottom:14px;padding-bottom:14px;border-bottom:1px solid rgba(61,35,33,.08)}

.c-item:last-of-type{border-bottom:none}

.c-thumb{width:48px;height:48px;border-radius:7px;object-fit:cover;background:var(--beige);flex-shrink:0;display:block}

.c-info{flex:1;min-width:0}

.c-name{font-size:12px;font-weight:600;color:var(--brown);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

.c-var{font-size:11px;color:var(--beige);margin-top:1px}

.c-qty{display:flex;align-items:center;gap:7px;margin-top:5px}

.qb{width:22px;height:22px;border-radius:50%;border:1.5px solid rgba(61,35,33,.18);background:none;cursor:pointer;font-size:13px;display:flex;align-items:center;justify-content:center;transition: background .25s ease, color .25s ease, box-shadow .25s ease, transform .25s ease;color:var(--brown);line-height:1}

.qb:hover{background:var(--brown);color:#fff;border-color:var(--brown)}

.qn{font-size:12px;font-weight:600;min-width:14px;text-align:center}

.c-right{display:flex;flex-direction:column;align-items:flex-end;gap:4px;flex-shrink:0}

.c-price{font-size:12px;font-weight:700;color:var(--brown);white-space:nowrap}
.c-kes-equiv{display:block;font-size:10px;font-weight:500;color:var(--text3,#8a7a68)}

.fx-notice{display:flex;align-items:flex-start;gap:6px;font-size:11px;line-height:1.45;color:var(--text3,#6b5d4c);background:rgba(0,168,150,.08);border:1px solid rgba(0,168,150,.25);border-radius:8px;padding:8px 10px;margin:0 0 10px;text-align:left}
.fx-notice i{margin-top:2px;color:var(--teal,#00a896)}

.c-del{background:none;border:none;color:var(--beige);cursor:pointer;font-size:12px;padding:2px;transition:color .2s}

.c-del:hover{color:var(--orange)}

.c-summary{border-top:2px solid rgba(61,35,33,.09);padding-top:16px;margin-top:4px}

.c-row{display:flex;justify-content:space-between;font-size:13px;color:#666;margin-bottom:7px}

.c-total{display:flex;justify-content:space-between;font-size:1rem;font-weight:700;color:var(--brown);margin:10px 0 16px}

.btn-pay{width:100%;padding:14px;background:var(--teal);color:#fff;border:none;border-radius:9px;font-size:13px;font-weight:700;cursor:pointer;transition:background .0.3s;display:flex;align-items:center;justify-content:center;gap:7px}

.btn-pay:hover{background:var(--brown)}

.btn-pay:disabled{opacity:.5;cursor:not-allowed}

.sec-note{text-align:center;font-size:11px;color:var(--beige);margin-top:8px;display:flex;align-items:center;justify-content:center;gap:4px}

/* TOAST */
.toast{position:fixed;bottom:28px;right:28px;background:var(--brown);color:#fff;padding:12px 20px;border-radius:9px;font-size:13px;font-weight:600;z-index:9000;opacity:0;transform:translateY(8px);transition:opacity .0.3s,transform .25s;pointer-events:none;display:flex;align-items:center;gap:8px}

.toast.on{opacity:1;transform:none}

.toast i{color:var(--teal)}

/* GEO MODAL */
.geo-modal{position:fixed;inset:0;z-index:9500;display:none}

.geo-modal.on{display:block}

.geo-modal__backdrop{position:absolute;inset:0;background:rgba(42,24,23,.72);backdrop-filter:blur(8px) saturate(160%);-webkit-backdrop-filter:blur(8px) saturate(160%)}

.geo-modal__dialog{position:relative;z-index:1;max-width:min(92vw,520px);margin:12vh auto 0;background:rgba(255,255,255,.96);border:1px solid rgba(61,35,33,.10);border-radius:14px;box-shadow:0 32px 90px rgba(0,0,0,.32);padding:22px 22px 18px;animation:fadeUp .35s both;color:var(--brown)}

.geo-modal__close{position:absolute;top:12px;right:12px;width:40px;height:40px;border-radius:50%;border:1px solid rgba(61,35,33,.14);background:rgba(255,255,255,.7);color:var(--brown);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:transform .0.3s,background .2s,border-color .2s}

.geo-modal__close:hover{transform:rotate(90deg);background:#fff;border-color:rgba(61,35,33,.25)}

.geo-modal__icon{width:44px;height:44px;border-radius:12px;background:rgba(0,168,150,.10);display:flex;align-items:center;justify-content:center;margin-bottom:12px;color:var(--teal);font-size:18px;border:1px solid rgba(0,168,150,.18)}

.geo-modal__title{font-family:'Playfair Display',serif;font-size:1.35rem;letter-spacing:-.02em;margin:0 0 8px}

.geo-modal__desc{font-size:14px;line-height:1.7;color:rgba(61,35,33,.78);margin:0 0 14px}

.geo-modal__actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:6px}

.geo-modal__btn{border:1.5px solid rgba(61,35,33,.18);background:transparent;color:var(--brown);border-radius:10px;padding:10px 14px;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;cursor:pointer;transition:background .0.3s,color .2s,border-color .2s,transform .2s}

.geo-modal__btn:hover{transform:translateY(-1px);border-color:rgba(0,168,150,.55);color:var(--teal)}

.geo-modal__btn--primary{background:var(--teal);border-color:var(--teal);color:#fff}

.geo-modal__btn--primary:hover{background:var(--brown);border-color:var(--brown);color:#fff}

.geo-modal__fineprint{font-size:11px;line-height:1.6;color:rgba(61,35,33,.55);margin:12px 0 0}

@media(max-width:420px){
  .geo-modal__dialog{margin:10vh 14px 0;padding:18px 16px 14px}
}

/* FOOTER */
footer{background:var(--teal);color:#fff;padding:70px 0 28px}

.f-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:50px;max-width:1200px;margin:0 auto 50px;padding:0 5%}

.f-logo{max-width:180px;height:auto;margin-bottom:16px;display:block;filter:brightness(0)invert(1)}

.f-brand p{color:rgba(255,255,255,.78);font-size:13px;line-height:1.75}

.f-socials{display:flex;gap:14px;margin-top:18px}

.f-socials a{color:rgba(255,255,255,.65);font-size:15px;transition:color .0.3s;text-decoration:none}

.f-socials a:hover{color:var(--orange)}

.f-col h4{font-size:.78rem;font-weight:700;letter-spacing:2px;text-transform:uppercase;color:var(--brown);margin-bottom:16px}

.f-col ul{list-style:none}

.f-col li{margin-bottom:9px}

.f-col a{color:rgba(61,35,33,.78);text-decoration:none;font-size:13px;transition:color .25s}

.f-col a:hover{color:var(--orange)}

.f-bot{border-top:1px solid rgba(61,35,33,.13);padding:20px 5% 0;max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;flex-wrap:wrap;font-size:.78rem;color:rgba(61,35,33,.55);gap:10px}

.f-bot a{color:inherit;text-decoration:none;margin-left:16px}

.f-bot a:hover{color:var(--orange)}

@keyframes fadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}

.checkout-field{width:100%;padding:12px;border:1.5px solid rgba(61,35,33,.13);border-radius:7px;font-family:inherit;font-size:13px;color:var(--brown);background:#fff;outline:none;margin-bottom:10px;transition:border-color .0.3s;box-sizing:border-box}

.checkout-field:focus{border-color:var(--teal)}

.checkout-field::placeholder{color:var(--beige)}

#checkout-email{width:100%;padding:12px;border:1.5px solid rgba(61,35,33,.13);border-radius:7px;font-family:inherit;font-size:13px;color:var(--brown);background:#fff;outline:none;margin-bottom:10px;transition:border-color .2s}

#checkout-email:focus{border-color:var(--teal)}

#checkout-email::placeholder{color:var(--beige)}

.checkout-row{display:grid;grid-template-columns:1fr 1fr;gap:10px}

@media(max-width:1100px){
  .store-wrap{grid-template-columns:1fr}

  .cart-box{position:static}
}

@media(max-width:768px){
  .f-grid{grid-template-columns:1fr;gap:28px}

  .products-grid{grid-template-columns:1fr;gap:20px}

  .filter-bar{gap:6px}

  .pill{padding:8px 12px;font-size:11px}

  .checkout-row{grid-template-columns:1fr}

  .p-card{max-width:100%}

  /* Hero mobile improvements */
  .hero{min-height:35vh;padding:0 5% 40px}

  .hero h1{font-size:clamp(1.8rem,8vw,2.4rem);line-height:1.15}

  .hero p{font-size:.95rem;line-height:1.6;max-width:100%}

  .eyebrow{font-size:10px;margin-bottom:10px}
}

@media(max-width:480px){
  .hero{min-height:auto;padding:60px 5% 32px}

  .hero h1{font-size:1.6rem;margin-bottom:10px}

  .hero p{font-size:.9rem}

  /* Optional: hide background image on very small screens to reduce crowding */
  .hero-bg{opacity:.6}
}

.footer-wrapper {
            max-width: 1600px;
            margin: 0 auto;
            position: relative;
            z-index: 1;
        }

.footer-top {
            display: grid;
            grid-template-columns: 1fr;
            gap: 3rem;
            margin-bottom: 3rem;
            align-items: start;
        }

@media (min-width: 1024px) {
  .footer-top {
                grid-template-columns: 1.2fr 1fr 1fr 1.2fr;
                gap: 2.5rem;
            }
}

.footer-brand-text h2 {
            font-family: 'Playfair Display', serif;
            font-size: 1.5rem;
            font-weight: 400;
            margin: 0;
            letter-spacing: 0.08em;
            color: #fff;
            text-transform: uppercase;
            line-height: 1.2;
        }

.footer-brand-text p {
            font-size: 0.85rem;
            line-height: 1.7;
            color: rgba(234, 227, 217, 0.65);
            max-width: 280px;
            font-weight: 300;
            margin: 0.5rem 0 0;
        }

.footer-column {
            display: flex;
            flex-direction: column;
            gap: 1.2rem;
        }

.footer-column-title {
            font-family: 'Lato', sans-serif;
            font-size: 0.75rem;
            text-transform: uppercase;
            letter-spacing: 0.18em;
            margin: 0;
            color: #D4AF37;
            font-weight: 800;
            opacity: 0.95;
        }

.newsletter-form {
            display: flex;
            background: rgba(234, 227, 217, 0.08);
            border: 1px solid rgba(212, 175, 55, 0.2);
            border-radius: 4px;
            overflow: hidden;
            transition: background .25s ease, color .25s ease, box-shadow .25s ease, transform .25s ease ease;
            backdrop-filter: blur(8px);
        }

.newsletter-form:focus-within {
            background: rgba(234, 227, 217, 0.12);
            border-color: rgba(212, 175, 55, 0.4);
            box-shadow: 0 8px 24px rgba(212, 175, 55, 0.1);
        }

.newsletter-form input {
            background: transparent;
            border: none;
            color: #fff;
            font-family: 'Lato', sans-serif;
            font-size: 0.9rem;
            flex: 1;
            outline: none;
            padding: 12px 16px;
            font-weight: 300;
        }

.newsletter-form input::placeholder {
            color: rgba(234, 227, 217, 0.4);
        }

.newsletter-form button {
            background: linear-gradient(135deg, #D4AF37 0%, #c49a2a 100%);
            border: none;
            color: #1a0f0a;
            cursor: pointer;
            font-family: 'Lato', sans-serif;
            text-transform: uppercase;
            letter-spacing: 0.12em;
            font-size: 0.75rem;
            font-weight: 800;
            transition: background .25s ease, color .25s ease, box-shadow .25s ease, transform .25s ease ease;
            padding: 0 20px;
            display: flex;
            align-items: center;
            justify-content: center;
        }

.newsletter-form button:hover {
            background: linear-gradient(135deg, #E8C547 0%, #D4AF37 100%);
            box-shadow: 0 4px 16px rgba(212, 175, 55, 0.3);
            transform: translateX(2px);
        }

.newsletter-form button:active {
            transform: translateX(0);
        }

.footer-divider {
            height: 1px;
            background: linear-gradient(90deg, transparent, rgba(212, 175, 55, 0.2), transparent);
            margin: 2.5rem 0;
        }

.footer-copyright {
            font-size: 0.8rem;
            color: rgba(234, 227, 217, 0.5);
            font-weight: 300;
            letter-spacing: 0.02em;
        }

@media (max-width: 1023px) {
  .footer-top {
                gap: 2rem;
            }

  .footer-brand-text h2 {
                font-size: 1.2rem;
            }
}

.compact-footer {
    display: grid;
    grid-template-columns: 1fr;
    width: 100%;
    font-size: 0.9rem;
}

@media (min-width: 900px) {
  .compact-footer {
        grid-template-columns: 4fr 6fr;
    }
}

.footer-sand-pane {
    background-color: var(--color-sand);
    color: var(--text-dark);
    padding: 3.5rem 10% 2rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.footer-brand img {
    max-height: 65px;
    width: auto;
    margin-bottom: 1.5rem;
    display: block;
}

.copyright {
    font-size: 0.75rem;
    opacity: 0.6;
    margin-top: auto;
    padding-top: 2rem;
    line-height: 1.6;
}

.ddx-attr {
    display: block;
    margin-top: 0.5rem;
}

.ddx-attr a {
    color: inherit;
    text-decoration: none;
    font-weight: 700;
    border-bottom: 1px dotted var(--text-dark);
    transition: color 0.3s ease, border-color 0.3s ease;
}

.ddx-attr a:hover {
    color: var(--color-copper-dark);
    border-bottom-color: transparent;
}

.footer-copper-pane {
    background-color: var(--color-copper);
    color: var(--text-light);
    padding: 3.5rem 10% 2rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.copper-grid {
    display: grid;
    grid-template-columns: 1fr;
    gap: 3rem;
}

@media (min-width: 600px) {
  .copper-grid {
        grid-template-columns: 1fr 1fr;
        gap: 4rem;
    }
}

.newsletter-form {
    display: flex;
    border-bottom: 1px solid rgba(253, 252, 251, 0.3);
    transition: border-color 0.3s ease;
}

.newsletter-form:focus-within {
    border-bottom-color: var(--color-sand);
}

.newsletter-form input {
    background: transparent;
    border: none;
    color: var(--text-light);
    padding: 0.6rem 0;
    font-size: 0.9rem;
    font-family: var(--font-main);
    flex: 1;
    outline: none;
}

.newsletter-form input::placeholder {
    color: rgba(253, 252, 251, 0.6);
}

.newsletter-form button {
    background: transparent;
    border: none;
    color: var(--color-sand);
    font-weight: 700;
    cursor: pointer;
    text-transform: uppercase;
    font-size: 0.75rem;
    letter-spacing: 0.05em;
    padding: 0 0 0 1rem;
    transition: opacity 0.2s ease;
}

.newsletter-form button:hover {
    opacity: 0.7;
}

:root {
    --lj-earth: #3D2321;
    --lj-paper: #F2EFE9;
    --lj-accent: #C5A059;
    --lj-ink-light: rgba(61, 35, 33, 0.6);
    --font-footer: 'Lato', sans-serif;
}

.legal-links {
    display: flex;
    gap: 1.5rem;
}

.legal-links a, .ddx-attr a {
    color: var(--lj-earth);
    text-decoration: none;
    font-weight: 700;
}

.legal-links a:hover, .ddx-attr a:hover {
    text-decoration: underline;
}

.giraffe {
    display: inline-block;
    transition: transform 0.3s ease;
}

.ddx-attr:hover .giraffe {
    transform: translateY(-3px) scale(1.1);
}

.stub-title {
    font-size: 0.8rem;
    text-transform: uppercase;
    letter-spacing: 0.15em;
    font-weight: 900;
    margin: 0 0 0.5rem 0;
    color: var(--lj-accent);
}

.stub-heading {
    font-size: 1.5rem;
    font-weight: 300;
    margin: 0 0 1.5rem 0;
    line-height: 1.2;
}

.stub-form {
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.stub-form input {
    background: transparent;
    border: none;
    border-bottom: 2px solid rgba(61, 35, 33, 0.2);
    padding: 0.5rem 0;
    font-family: var(--font-footer);
    font-size: 0.95rem;
    color: var(--lj-earth);
    outline: none;
    transition: border-color 0.3s ease;
}

.stub-form input:focus {
    border-color: var(--lj-earth);
}

.stub-form input::placeholder {
    color: var(--lj-ink-light);
    font-style: italic;
}

.stub-form button {
    background-color: transparent;
    color: var(--lj-earth);
    border: 2px solid var(--lj-earth);
    padding: 0.6rem;
    border-radius: 6px;
    font-family: var(--font-footer);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    cursor: pointer;
    transition: background .25s ease, color .25s ease, box-shadow .25s ease, transform .25s ease ease;
}

.stub-form button:hover {
    background-color: var(--lj-earth);
    color: var(--lj-paper);
}

.barcode {
    margin-top: 2rem;
    height: 30px;
    width: 100%;
    background:
        linear-gradient(90deg,
            var(--lj-earth) 0%, var(--lj-earth) 5%,
            transparent 5%, transparent 8%,
            var(--lj-earth) 8%, var(--lj-earth) 10%,
            transparent 10%, transparent 15%,
            var(--lj-earth) 15%, var(--lj-earth) 22%,
            transparent 22%, transparent 24%,
            var(--lj-earth) 24%, var(--lj-earth) 26%,
            transparent 26%, transparent 30%,
            var(--lj-earth) 30%, var(--lj-earth) 32%,
            transparent 32%, transparent 35%,
            var(--lj-earth) 35%, var(--lj-earth) 45%,
            transparent 45%, transparent 48%,
            var(--lj-earth) 48%, var(--lj-earth) 50%,
            transparent 50%, transparent 55%,
            var(--lj-earth) 55%, var(--lj-earth) 60%,
            transparent 60%, transparent 62%,
            var(--lj-earth) 62%, var(--lj-earth) 70%,
            transparent 70%, transparent 75%,
            var(--lj-earth) 75%, var(--lj-earth) 77%,
            transparent 77%, transparent 80%,
            var(--lj-earth) 80%, var(--lj-earth) 85%,
            transparent 85%, transparent 88%,
            var(--lj-earth) 88%, var(--lj-earth) 95%,
            transparent 95%, transparent 97%,
            var(--lj-earth) 97%, var(--lj-earth) 100%
        );
    opacity: 0.3;
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}