@layer sections{
  [ui-section=slideshow]{
    --per-page:1;
    --item-size:100%;
    display:flex;
    flex-direction:column;
    gap:var(--spacing-16);
  }
  [ui-section=slideshow] [ui-slot=carousel]{
    gap:var(--spacing-16);
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item]{
    position:relative;
    height:max(var(--height), 240px);
    background-color:transparent !important;
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper{
    display:flex;
    height:100%;
    gap:var(--spacing-8);
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .first-img,
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .second-img{
    flex:1;
    overflow:hidden;
    border-radius:var(--radius-28);
  }
  @media (max-width: 769px){
    [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .first-img,
    [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .second-img{
      display:none;
    }
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content{
    position:relative;
    flex:2;
    order:var(--content-order);
    padding:var(--spacing-32);
    overflow:hidden;
    border-radius:var(--radius-slide);
    background-color:var(--slide-bg);
    color:var(--slide-fg);
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .media{
    position:absolute;
    inset:0;
    z-index:1;
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .media img{
    opacity:var(--content-image-opacity);
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content{
    display:flex;
    position:relative;
    z-index:2;
    flex-direction:column;
    height:100%;
    gap:var(--spacing-32);
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content [ui-slot=head],
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content .actions{
    width:100%;
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content [ui-slot=head] .heading{
    display:-webkit-box;
    overflow:hidden;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content [ui-slot=head] .description{
    display:-webkit-box;
    overflow:hidden;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:4;
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content .actions{
    display:flex;
    align-items:center;
    gap:var(--spacing-16);
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content .actions [ui-slot=button][data-variant=primary]{
    --button-bg:var(--fg-color);
    --button-fg:var(--bg-color);
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content .actions [ui-slot=button][data-variant=neutral]{
    --button-fg:var(--fg-color);
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content .actions [ui-slot=button][data-variant=neutral] i{
    transition:transform var(--transition-bouncy-default-effects);
  }
  [dir="rtl"] [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content .actions [ui-slot=button][data-variant=neutral] i{
    rotate:-180deg;
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content .actions [ui-slot=button][data-variant=neutral]:hover i{
    transform:translateX(var(--spacing-4));
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content[data-y-alignment=start]{
    justify-content:flex-start;
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content[data-y-alignment=center]{
    justify-content:center;
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content[data-y-alignment=end]{
    justify-content:flex-end;
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content[data-x-alignment=start]{
    align-items:flex-start;
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content[data-x-alignment=start] [ui-slot=head]{
    align-items:flex-start;
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content[data-x-alignment=start] [ui-slot=head] > *{
    text-align:start;
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content[data-x-alignment=start] .actions{
    justify-content:flex-start;
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content[data-x-alignment=center]{
    align-items:center;
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content[data-x-alignment=center] [ui-slot=head]{
    align-items:center;
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content[data-x-alignment=center] [ui-slot=head] > *{
    text-align:center;
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content[data-x-alignment=center] .actions{
    justify-content:center;
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content[data-x-alignment=end]{
    align-items:flex-end;
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content[data-x-alignment=end] [ui-slot=head]{
    align-items:flex-end;
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content[data-x-alignment=end] [ui-slot=head] > *{
    text-align:end;
  }
  [ui-section=slideshow] [ui-slot=carousel] [ui-slot=carousel-item] .slide-wrapper .main-content .content[data-x-alignment=end] .actions{
    justify-content:flex-end;
  }
  [ui-section=slideshow] .controls{
    --controls-fg-color:oklch(from var(--bg-color) clamp(0, (0.6 - l) * 99999, 1) 0 0deg);
    display:flex;
    justify-content:space-between;
    height:48px;
    gap:var(--spacing-24);
  }
  [ui-section=slideshow] .controls:not([data-show-arrows]), [ui-section=slideshow] .controls[data-centered-arrows]{
    justify-content:center;
  }
  [ui-section=slideshow] .controls [ui-slot=button][data-variant=neutral]{
    --button-fg:var(--controls-fg-color);
  }
  @media (max-width: 1024px){
    [ui-section=slideshow] .controls{
      padding-inline:var(--spacing-16);
    }
  }
  [ui-section=slideshow] .controls .pagination{
    display:flex;
    gap:var(--spacing-8);
    position:relative;
    align-items:center;
    justify-content:center;
    width:-moz-fit-content;
    width:fit-content;
  }
  [ui-section=slideshow] .controls .pagination [ui-carousel=marker]{
    display:flex;
    align-items:center;
    justify-content:center;
    width:20px;
    height:20px;
    transition:var(--transition-standard-default-spatial);
    border:none;
    background-color:transparent;
    color:var(--controls-fg-color);
    cursor:pointer;
  }
  [ui-section=slideshow] .controls .pagination [ui-carousel=marker]::before{
    content:"";
    display:flex;
    width:20px;
    height:4px;
    transition:var(--transition-standard-default-spatial);
    border-radius:var(--radius-rounded);
    background-color:color-mix(in srgb, currentcolor 38%, transparent);
  }
  [ui-section=slideshow] .controls .pagination [ui-carousel=marker][aria-current=true]::before{
    width:inherit;
    background-color:currentcolor;
  }

  /* =========================================================
     Layout: image beside text ("split")
     ========================================================= */
  [ui-section=slideshow][data-layout=split] [ui-slot=carousel] [ui-slot=carousel-item]{
    height:var(--split-height, 560px);
  }
  [ui-section=slideshow][data-layout=split] .split-wrapper{
    display:flex;
    flex-direction:row;
    height:100%;
    overflow:hidden;
    border-radius:var(--radius-slide);
    background-color:var(--panel-bg);
    color:var(--panel-fg);
  }
  [ui-section=slideshow][data-layout=split][data-image-position=end] .split-wrapper{
    flex-direction:row-reverse;
  }
  [ui-section=slideshow][data-layout=split] .split-media{
    flex:0 0 var(--split-image-width, 60%);
    min-width:0;
    overflow:hidden;
    background-color:color-mix(in srgb, var(--panel-fg) 6%, var(--panel-bg));
  }
  [ui-section=slideshow][data-layout=split] .split-media picture,
  [ui-section=slideshow][data-layout=split] .split-media img{
    display:block;
    width:100%;
    height:100%;
  }
  [ui-section=slideshow][data-layout=split] .split-media img{
    -o-object-fit:cover;
       object-fit:cover;
    -o-object-position:center;
       object-position:center;
  }
  [ui-section=slideshow][data-layout=split] .split-panel{
    display:flex;
    flex:1 1 auto;
    min-width:0;
    padding:var(--spacing-40) clamp(24px, 4vw, 64px);
  }
  [ui-section=slideshow][data-layout=split] .split-content{
    display:flex;
    flex-direction:column;
    width:100%;
    max-width:520px;
    gap:var(--spacing-16);
  }
  [ui-section=slideshow][data-layout=split] .split-content[data-y-alignment=start]{ justify-content:flex-start; }
  [ui-section=slideshow][data-layout=split] .split-content[data-y-alignment=center]{ justify-content:center; }
  [ui-section=slideshow][data-layout=split] .split-content[data-y-alignment=end]{ justify-content:flex-end; }
  [ui-section=slideshow][data-layout=split] .split-content[data-x-alignment=start]{ align-items:flex-start; text-align:start; }
  [ui-section=slideshow][data-layout=split] .split-content[data-x-alignment=center]{ align-items:center; text-align:center; margin-inline:auto; }
  [ui-section=slideshow][data-layout=split] .split-content[data-x-alignment=end]{ align-items:flex-end; text-align:end; margin-inline-start:auto; }
  [ui-section=slideshow][data-layout=split] .eyebrow{
    margin:0;
    font-size:14px;
    font-weight:700;
    letter-spacing:0.02em;
    opacity:0.85;
  }
  [ui-section=slideshow][data-layout=split] .split-heading{
    display:-webkit-box;
    margin:0;
    overflow:hidden;
    font-family:var(--font-heading-family);
    font-size:clamp(28px, 2.8vw, 44px);
    font-weight:700;
    line-height:1.25;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:3;
    text-wrap:balance;
  }
  [ui-section=slideshow][data-layout=split] .split-description{
    display:-webkit-box;
    margin:0;
    overflow:hidden;
    font-size:clamp(15px, 1.2vw, 18px);
    line-height:1.7;
    opacity:0.85;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:4;
  }
  [ui-section=slideshow][data-layout=split] .split-actions{
    display:flex;
    flex-wrap:wrap;
    margin-top:var(--spacing-8);
    gap:var(--spacing-12);
  }
  [ui-section=slideshow][data-layout=split] .split-button{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:48px;
    padding:0 var(--spacing-24);
    border:1.5px solid var(--panel-fg);
    border-radius:var(--radius-button, 8px);
    font-size:15px;
    font-weight:700;
    text-decoration:none;
    cursor:pointer;
    transition:opacity var(--transition-standard-fast-effects, 150ms ease);
  }
  [ui-section=slideshow][data-layout=split] .split-button[data-style=solid]{
    background-color:var(--panel-fg);
    color:var(--panel-bg);
  }
  [ui-section=slideshow][data-layout=split] .split-button[data-style=outline]{
    background-color:transparent;
    color:var(--panel-fg);
  }
  [ui-section=slideshow][data-layout=split] .split-button:hover{
    opacity:0.88;
  }
  [ui-slot=container][data-fullscreen]:has([ui-section=slideshow][data-layout=split]){
    max-width:100%;
  }
  [ui-slot=container][data-fullscreen] [ui-section=slideshow][data-layout=split] .split-wrapper{
    border-radius:0;
  }

  /* ---------- Mobile: image on top, text below ---------- */
  @media (max-width: 768px){
    [ui-section=slideshow][data-layout=split] [ui-slot=carousel] [ui-slot=carousel-item]{
      height:auto;
    }
    [ui-section=slideshow][data-layout=split] .split-wrapper,
    [ui-section=slideshow][data-layout=split][data-image-position=end] .split-wrapper{
      flex-direction:column;
    }
    [ui-section=slideshow][data-layout=split] .split-media{
      flex:0 0 auto;
      width:100%;
      aspect-ratio:1 / 1;
    }
    [ui-section=slideshow][data-layout=split][data-mobile-ratio=portrait] .split-media{ aspect-ratio:4 / 5; }
    [ui-section=slideshow][data-layout=split][data-mobile-ratio=landscape] .split-media{ aspect-ratio:4 / 3; }
    [ui-section=slideshow][data-layout=split] .split-panel{
      flex:1 1 auto;
      padding:var(--spacing-24) var(--spacing-16) var(--spacing-24);
    }
    [ui-section=slideshow][data-layout=split] .split-content{
      max-width:none;
      gap:var(--spacing-12);
    }
    [ui-section=slideshow][data-layout=split] .split-heading{
      font-size:24px;
    }
    [ui-section=slideshow][data-layout=split] .split-description{
      font-size:15px;
      -webkit-line-clamp:3;
    }
    [ui-section=slideshow][data-layout=split] .split-actions,
    [ui-section=slideshow][data-layout=split] .split-button{
      width:100%;
    }
  }
}