section.catalog{padding-block:var(--spacing-3xl)}section.catalog .hook{display:grid;gap:var(--spacing-md);margin-bottom:var(--spacing-2xl)}@media(min-width: 62rem){section.catalog .hook{grid-template-columns:7fr 5fr}}section.catalog .hook .buttons{margin-top:var(--spacing-md);display:flex;flex-wrap:wrap;align-items:center;gap:var(--spacing-sm)}section.catalog .filter{margin-bottom:var(--spacing-2xl);background:rgba(255,255,255,.16);display:inline-block;width:auto;clip-path:polygon(0.5em 0, calc(100% - 0.5em) 0, 100% 0.5em, 100% calc(100% - 0.5em), calc(100% - 0.5em) 100%, 0.5em 100%, 0 calc(100% - 0.5em), 0 0.5em);padding:var(--spacing-4xs)}section.catalog .filter .filter-button{transition:all var(--transition-duration-fast) var(--transition-timing-function)}section.catalog .filter .filter-button:not(.active){background:rgba(0,0,0,0);color:var(--bg-color-light)}section.catalog .catalog-grid{display:grid;grid-template-columns:1fr;gap:var(--spacing-2xs)}@media(min-width: 32rem){section.catalog .catalog-grid{grid-template-columns:1fr 1fr}}@media(min-width: 75rem){section.catalog .catalog-grid{grid-template-columns:repeat(4, 1fr)}}section.catalog .catalog-grid .jacket-preset{position:relative;overflow:hidden}@media(hover: hover){section.catalog .catalog-grid .jacket-preset:hover .jacket-styles{opacity:1;transform:translateY(0)}}section.catalog .catalog-grid .jacket-preset .img-container{position:relative;aspect-ratio:1/1;width:100%;height:100%;overflow:hidden}section.catalog .catalog-grid .jacket-preset .img-container img{inset:0;width:100%;height:100%;object-fit:cover}section.catalog .catalog-grid .jacket-preset .edit-button{cursor:pointer}section.catalog .catalog-grid .jacket-preset .edit-button .icon{position:absolute;top:var(--spacing-4xs);right:var(--spacing-4xs);background:var(--bg-color-light);padding:var(--spacing-6xs);width:var(--font-size-heading-xxs);height:calc(var(--font-size-heading-xxs) - 1px);z-index:5;clip-path:polygon(0.25em 0, calc(100% - 0.25em) 0, 100% 0.25em, 100% calc(100% - 0.25em), calc(100% - 0.25em) 100%, 0.25em 100%, 0 calc(100% - 0.25em), 0 0.25em)}@media(hover: hover){section.catalog .catalog-grid .jacket-preset .edit-button .icon:hover~.text{opacity:1;transform:translateY(0)}}section.catalog .catalog-grid .jacket-preset .edit-button .icon:before{content:"";position:static;display:block;width:100%;height:100%;background:var(--bg-color-accent);mask-image:url("/wp-content/themes/propaganda-theme/assets/svgs/edit.svg");mask-repeat:no-repeat;pointer-events:none;mask-size:contain;mask-position:center}section.catalog .catalog-grid .jacket-preset .edit-button .text{content:"Start building with this style";display:flex;align-items:center;position:absolute;background:var(--bg-color-light);color:var(--text-color-secondary);top:var(--spacing-4xs);right:calc(var(--spacing-4xs) + var(--font-size-heading-xxs));text-wrap:balance;padding-right:var(--font-size-heading-xxs);margin-right:calc(var(--font-size-heading-xxs)*-1);margin-left:calc(var(--spacing-4xs) + var(--font-size-heading-xxs));padding-left:var(--spacing-4xs);min-height:var(--font-size-heading-xxs);clip-path:polygon(0.25em 0, calc(100% - 0.25em) 0, 100% 0.25em, 100% calc(100% - 0.25em), calc(100% - 0.25em) 100%, 0.25em 100%, 0 calc(100% - 0.25em), 0 0.25em);z-index:4;opacity:0;transform:translateY(-115%);transition:all var(--transition-duration-fast) var(--transition-timing-function)}@media(hover: hover){section.catalog .catalog-grid .jacket-preset .edit-button .text:hover{opacity:1;transform:translateY(0)}}section.catalog .catalog-grid .jacket-preset .edit-button .text span{font-size:var(--font-size-body-sm);max-width:7em}@media(min-width: 62rem){section.catalog .catalog-grid .jacket-preset .edit-button .text span{max-width:unset}}section.catalog .catalog-grid .jacket-preset .info-button{position:absolute;inset:var(--spacing-4xs);width:var(--font-size-heading-xxs);height:var(--font-size-heading-xxs);background:var(--bg-color-light);padding:var(--spacing-6xs);z-index:1;cursor:pointer;clip-path:polygon(0.25em 0, calc(100% - 0.25em) 0, 100% 0.25em, 100% calc(100% - 0.25em), calc(100% - 0.25em) 100%, 0.25em 100%, 0 calc(100% - 0.25em), 0 0.25em);transition:all var(--transition-duration-fast) var(--transition-timing-function)}section.catalog .catalog-grid .jacket-preset .info-button.open~.jacket-styles,section.catalog .catalog-grid .jacket-preset .info-button:hover~.jacket-styles{opacity:1;transform:translateY(0)}section.catalog .catalog-grid .jacket-preset .info-button.open{opacity:0}section.catalog .catalog-grid .jacket-preset .info-button:after{content:"";position:static;display:block;width:100%;height:100%;background:var(--button-color-dark);mask-image:url("/wp-content/themes/propaganda-theme/assets/svgs/info.svg");mask-repeat:no-repeat;mask-size:contain;mask-position:center;z-index:2;pointer-events:none}section.catalog .catalog-grid .jacket-preset .jacket-styles{position:absolute;top:var(--spacing-4xs);left:var(--spacing-4xs);background-color:var(--bg-color-light);clip-path:polygon(0.5em 0, calc(100% - 0.5em) 0, 100% 0.5em, 100% calc(100% - 0.5em), calc(100% - 0.5em) 100%, 0.5em 100%, 0 calc(100% - 0.5em), 0 0.5em);color:var(--text-color-secondary);padding:var(--spacing-4xs);transition:all .2s ease;z-index:3;transform:translateY(-115%);opacity:0;cursor:pointer}section.catalog .catalog-grid .jacket-preset .jacket-styles:has(.open){cursor:unset}section.catalog .catalog-grid .jacket-preset .jacket-styles p{margin:unset;padding-block:var(--spacing-5xs)}section.catalog .catalog-grid .jacket-preset .jacket-styles .body-style{padding-top:0;display:flex;align-items:center;justify-content:space-between;gap:var(--font-size-body-md)}section.catalog .catalog-grid .jacket-preset .jacket-styles .body-style span{display:block;height:var(--font-size-heading-xxs);cursor:pointer}section.catalog .catalog-grid .jacket-preset .jacket-styles .body-style span svg{width:100%;height:100%}section.catalog .catalog-grid .jacket-preset .jacket-styles .body-style span svg path{fill:currentColor}section.catalog .catalog-grid .jacket-preset .jacket-styles .sleeve,section.catalog .catalog-grid .jacket-preset .jacket-styles .collar{display:flex;align-items:center;gap:var(--spacing-4xs)}@media(hover: hover){section.catalog .catalog-grid .jacket-preset .jacket-styles:has(.open),section.catalog .catalog-grid .jacket-preset .jacket-styles:hover{opacity:1;transform:translateY(0)}section.catalog .catalog-grid .jacket-preset .jacket-styles:not(:has(.open)) .body-style span{opacity:0;pointer-events:none}}/*# sourceMappingURL=catalog.css.map */