
  #youcan-section--search{
    display:flex;
    flex:1;
    flex-direction:column;
  }
  #youcan-section--search:not(#\#) [ui-section=search]{
    padding:attr(data-top-spacing px) var(--spacing-24) attr(data-bottom-spacing px) !important;
  }
  #youcan-section--search [ui-section=search]{
    display:flex;
    flex:1;
    flex-direction:column;
    gap:var(--spacing-32);
  }
  #youcan-section--search [ui-section=search] .head-area .heading{
    font:var(--font-title-md);
    text-transform:uppercase;
  }
  #youcan-section--search [ui-section=search] .control-area{
    display:grid;
    grid-gap:var(--spacing-8);
    gap:var(--spacing-8);
  }
  #youcan-section--search [ui-section=search] .control-area .result{
    display:flex;
    gap:var(--spacing-12);
  }
  #youcan-section--search [ui-section=search] .control-area .result .terms{
    font:var(--font-headline-lg);
  }
  #youcan-section--search [ui-section=search] .control-area .result .total{
    opacity:0.7;
  }
  #youcan-section--search [ui-section=search] .control-area .search .field{
    display:flex;
    align-items:center;
    gap:var(--spacing-8);
    border-block-end:1px solid var(--color-surface-variant);
  }
  #youcan-section--search [ui-section=search] .control-area .search .field input{
    flex:1;
    height:var(--spacing-64);
    outline:none;
  }
  #youcan-section--search [ui-section=search] .control-area .search .field:has(input:focus){
    border-block-end-color:currentColor;
  }
  #youcan-section--search [ui-section=search] .list-area{
    display:grid;
    grid-template-columns:repeat(attr(data-nbr-columns-desktop number), 1fr);
    width:100%;
    grid-gap:var(--spacing-24);
    gap:var(--spacing-24);
  }
  @media (max-width: 1024px){
    #youcan-section--search [ui-section=search] .list-area{
      grid-template-columns:repeat(3, 1fr);
    }
  }
  @media (max-width: 769px){
    #youcan-section--search [ui-section=search] .list-area{
      grid-template-columns:repeat(2, 1fr);
    }
  }
