/* Final component layer: readable controls, tactile print, restrained reflections. */
.groovy-home .coll-tabs{gap:10px;flex-wrap:wrap}
.groovy-home .coll-tab{font:600 19px/1.2 'Barlow Condensed',Arial,sans-serif;letter-spacing:0;text-transform:none;min-height:46px;padding:11px 22px;border:1px solid #fff1d56b;color:#fff3d9;background:#321b1040;border-radius:28px;transition:background .2s,translate .2s,color .2s}
.groovy-home .coll-tab.active{background:linear-gradient(120deg,#ffe59a,#ffc138);color:#321b10;border-color:#ffc138;box-shadow:0 3px 0 #190c07}
.groovy-home .coll-tab:not(.active):hover{background:#fff3d922;translate:0 -2px}
.groovy-home .coll-tab.coll-tab-discret{font:600 19px/1.2 'Barlow Condensed',Arial,sans-serif;letter-spacing:0;text-transform:none;padding:11px 22px}
.groovy-home .pin-card-num{font:600 14px/1.2 'Barlow Condensed',Arial,sans-serif;letter-spacing:.04em;color:#73553d}
.groovy-home .pin-card{background-image:radial-gradient(ellipse at var(--light-x,50%) var(--light-y,20%),#fffaf094,#f6e7c63b),url('/assets/groovy/cream-paper-v1.webp');background-size:auto,550px 550px}
.brand-offscreen :is(.groovy-phone,.groovy-connected-card,.groovy-nfc-waves){animation-play-state:paused}
.groovy-home .pin-card-assume-btn,.groovy-home .pack-card-assume-btn{font:700 21px/1.2 'Barlow Condensed',Arial,sans-serif;letter-spacing:0;text-transform:none;min-height:48px;padding:12px 20px;background:linear-gradient(115deg,#ffdf7b,#ffc43b 60%,#ffad26);border:2px solid #321b10;border-radius:30px;box-shadow:0 3px 0 #321b10,inset 0 2px 0 #fff2b2;position:relative;overflow:hidden;isolation:isolate}
.groovy-home .pack-card-body>.pack-card-hover-overlay{position:static;display:block;opacity:1;transform:none;background:none;height:auto;padding:0;margin-top:4px}
.groovy-home .pack-card-body .pack-card-assume-btn{width:100%}
.groovy-home .pack-card-sub{font:500 20px/1.45 'Barlow Condensed',Arial,sans-serif;color:#321b10}
.groovy-home .pack-card-body .brand-pack-note{font:600 18px/1.4 'Barlow Condensed',Arial,sans-serif;color:#512b13}
.groovy-home .pack-card:only-child .pack-card-price{border-radius:48% 52% 47% 53%;box-shadow:0 5px 0 #b5522066,inset 0 2px 0 #fffaf0;rotate:-3deg}
.brand-reflector{position:relative;isolation:isolate}
.brand-reflection{position:absolute;inset:0;border-radius:inherit;pointer-events:none;z-index:3;opacity:0;background:radial-gradient(ellipse at var(--light-x,50%) var(--light-y,25%),#fff9dd65,transparent 55%),linear-gradient(115deg,transparent 20%,#fff7d522 40%,#ffffff60 48%,transparent 60%);mix-blend-mode:soft-light;transition:opacity .4s}
.brand-reflector:hover>.brand-reflection{opacity:.75}
.groovy-home .groovy-hero-art>.brand-reflection{inset:10% 6% 14%;border-radius:48%;mix-blend-mode:screen;opacity:0;background:radial-gradient(ellipse at var(--light-x) var(--light-y),#fff6cf40,transparent 35%)}
.groovy-home .groovy-hero-art:hover>.brand-reflection{opacity:.6}
.groovy-home .groovy-phone>.brand-reflection{inset:8px;border-radius:32px;background:linear-gradient(115deg,transparent 12%,#ffffff70 35%,transparent 55%);mix-blend-mode:screen}
.groovy-brand :is(.groovy-button,.btn-assume,.btn-pack-buy,.btn-checkout,.btn-collection,.assument-invite-link){position:relative;overflow:hidden;isolation:isolate}
.groovy-brand :is(.groovy-button,.pin-card-assume-btn,.pack-card-assume-btn,.btn-assume,.btn-checkout,.btn-collection):after{content:'';position:absolute;inset:-60% auto -60% -65%;width:35%;background:linear-gradient(90deg,transparent,#fffbe480,transparent);transform:skewX(-20deg);pointer-events:none}
.groovy-brand :is(.groovy-button,.pin-card-assume-btn,.pack-card-assume-btn,.btn-assume,.btn-checkout,.btn-collection):hover:after{animation:brand-button-glint .65s ease-out}
@keyframes brand-button-glint{to{left:135%}}
.groovy-home .assument{display:grid;grid-template-columns:minmax(0,38%) minmax(0,62%);align-items:center;gap:8px 25px;padding:65px 7vw!important}
.groovy-home .community-art{grid-column:1;grid-row:1/4;position:relative;max-width:300px;width:100%;margin:auto;background:linear-gradient(135deg,#ffd75f,#fa922c);border:8px solid #fff9e9;border-bottom-width:42px;border-radius:14px;box-shadow:4px 8px 0 #b0874f40,8px 17px 24px #321b1030;transform:rotate(-7deg);padding:25px;aspect-ratio:1}
.groovy-home .community-art img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 8px 4px #321b1050)}
.groovy-home .community-art span{position:absolute;bottom:-34px;left:0;right:0;text-align:center;font:600 19px 'Barlow Condensed',Arial,sans-serif;letter-spacing:0}
.groovy-home .assument-header{grid-column:2;padding:0;justify-content:flex-start;gap:0}
.groovy-home .assument-header svg{display:none}
.groovy-home .assument-header h2{font-size:clamp(38px,4vw,60px);margin:0;color:#321b10}
.groovy-home .community-copy{grid-column:2;font:500 23px/1.45 'Barlow Condensed',Arial,sans-serif;color:#68503e;max-width:500px}
.groovy-home .assument-invite{grid-column:2;padding:5px 0 0;font:500 21px/1.6 'Barlow Condensed',Arial,sans-serif;letter-spacing:0;color:#68503e}
.groovy-home .assument-invite-link{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:10px 22px;border:2px solid #321b10;border-radius:30px;background:linear-gradient(120deg,#ffe190,#ffc33f);font:700 21px 'Barlow Condensed',Arial,sans-serif;color:#321b10;text-transform:none;letter-spacing:0;box-shadow:0 3px 0 #321b10;text-decoration:none}
.groovy-home .assument-outer,.groovy-home .community-more{grid-column:1/-1}
.groovy-home .community-more{font:600 20px 'Barlow Condensed',Arial,sans-serif;text-align:center;margin-top:18px;color:#321b10;text-underline-offset:5px;justify-self:center}
.groovy-home .slogan-final{padding:55px 25px 65px;border-top:1px solid #321b1020}
.groovy-home .slogan-final p{max-width:850px;margin:0 auto 28px;color:#321b10;line-height:1.15;font-size:clamp(31px,4vw,55px)}
.groovy-brand .btn-collection{display:inline-flex;align-items:center;justify-content:center;min-height:52px;box-shadow:0 4px 0 #321b10,inset 0 2px 0 #fff0b4}
.groovy-brand footer{display:grid;grid-template-columns:minmax(200px,1fr) minmax(0,2fr);gap:28px 50px;text-align:left;align-items:center;padding:55px 7vw}
.groovy-brand .footer-logo{text-align:left;margin:0;font-size:initial;letter-spacing:0}
.groovy-brand .footer-logo img{margin:0;width:160px;box-shadow:0 5px 0 #1c0c0860;rotate:-3deg}
.groovy-brand .footer-logo p{margin-bottom:0}
.groovy-brand .footer-links{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px 24px;margin:0;font:600 19px/1.3 'Barlow Condensed',Arial,sans-serif;letter-spacing:0;text-transform:none}
.groovy-brand .footer-links a{display:inline-flex!important;align-items:center;min-height:44px;color:#fff3d9;text-underline-offset:6px}
.groovy-brand .footer-links a:hover{color:#ffd368;text-decoration:underline}
.groovy-brand .footer-socials{grid-column:2;justify-content:flex-end;margin:0}
.groovy-brand .footer-socials a{display:grid;place-items:center;width:46px;height:46px;border:1px solid #fff3d94d;border-radius:50%;background:#fff3d910;transition:translate .2s,background .2s}
.groovy-brand .footer-socials a:hover{translate:0 -3px;background:#fff3d92b}
:is(.groovy-brand,.groovy-nfc-page) :is(button,a,input,select,textarea,[tabindex]):focus-visible{outline:3px solid #28767a;outline-offset:5px}
.groovy-brand :is(.lightbox-overlay,.hdc-popup-overlay){backdrop-filter:blur(8px)}
.groovy-brand .lightbox-card{background:#fff3d9;border-radius:22px;box-shadow:0 20px 65px #160b0870;border:6px solid #fff3d9}
.groovy-brand .lightbox-card:has(.lightbox-photo){width:min(600px,90vw);height:auto;min-height:0;padding:8px;gap:10px}
.groovy-brand .lightbox-photo{display:block;width:100%;max-height:70vh;object-fit:contain;border-radius:14px}
.groovy-brand .lightbox-card:has(.lightbox-photo)>svg{display:none}
.groovy-brand .lightbox-card:has(.lightbox-photo) .lightbox-meta{padding:10px}
.groovy-brand :is(.hdc-popup-voila,.hdc-popup-note2,.hdc-popup-status){font:500 18px/1.4 'Barlow Condensed',Arial,sans-serif;letter-spacing:0;color:#68503e}
.groovy-brand :is(.ugc-modal,.cookie-modal,.social-popover){animation:brand-dialog-arrive .25s cubic-bezier(.22,1,.36,1)}
@keyframes brand-dialog-arrive{from{opacity:.3;translate:0 12px}to{opacity:1;translate:0 0}}
.groovy-brand .lightbox-meta{font:600 19px 'Barlow Condensed',Arial,sans-serif;color:#321b10;letter-spacing:0;text-transform:none}
.groovy-brand .lightbox-close{background:#ffc33f;border:2px solid #321b10;color:#321b10;width:44px;height:44px;border-radius:50%}
@media(max-width:650px){.groovy-home .coll-tab{font-size:17px;padding:10px 17px}.groovy-home .pin-card-assume-btn{font-size:18px;padding:10px 8px}.groovy-home .assument{grid-template-columns:1fr;padding:45px 22px!important;text-align:center;gap:18px}.groovy-home .community-art{grid-column:1;grid-row:auto;width:190px;padding:15px;border-bottom-width:34px}.groovy-home .community-art span{bottom:-29px;font-size:17px}.groovy-home :is(.assument-header,.community-copy,.assument-invite){grid-column:1}.groovy-home .assument-header{justify-content:center}.groovy-home .community-copy{font-size:21px}.groovy-home .assument-invite{font-size:18px}.groovy-brand footer{grid-template-columns:1fr;gap:25px;padding:40px 24px;text-align:center}.groovy-brand .footer-logo{text-align:center}.groovy-brand .footer-logo img{margin:auto}.groovy-brand .footer-links,.groovy-brand .footer-socials{justify-content:center;grid-column:1}.groovy-brand .footer-links{font-size:18px;gap:5px 20px}.groovy-home .pack-card-body .pack-card-assume-btn{min-height:52px}.brand-reflection{display:none}}
@media(prefers-reduced-motion:reduce){.brand-reflection{display:none}.groovy-brand *:after{animation:none!important}.groovy-home .groovy-hero-art>img{translate:none!important}}
