html {
    line-height: 1.8; /* 1 */
    -webkit-text-size-adjust: 100%; /* 2 */
    color: #333;
    }
body {
    margin: 0;
    display: grid;
    font-size: 20px;
    font-family: Inter, Roboto, 'Helvetica Neue', 'Arial Nova', 'Nimbus Sans', Arial, sans-serif;
    background: #f0f0f0;
    }
h1 {
    font-size: 2em;
    margin: 0.67em 0;
    line-height: 115%;
    }
h2 {
    font-size: 1.4em;
    margin: 0.67em 0;
    line-height: 120%;
    }
a {
    background-color: transparent;
    text-decoration: none;
    color: #333;
    }
b,strong {
    font-weight: bolder;
    }
img {
    border-style: none;
    max-width: 100%;
    height: auto;
    }

/* Logo */
.logo{
    float: left;
    position: relative;
    z-index: 2;
    height: 81px;
    width: 70px;
    }

/* Header Nav */
header{
    background-color: #000;
    position: sticky;
	top: 0;
    z-index: 3;
    }

/* Main Menu */
#menu ul {
    margin: 10px 0 10px 0;
    padding: 0;
    text-transform: uppercase;
    font-weight: 300;
    line-height: 1;
    font-size: 1rem;
    }
#menu .main-menu {
    display: none;
    }

#tm:checked ~ label span{
    background-color: #444;
    }
#tm:checked ~ .main-menu {
    display: block;
    }
#menu input[type="checkbox"], 
#menu ul span.drop-icon {
    display: none;
    }
#menu li, 
#toggle-menu, 
#menu .sub-menu {
    border-style: solid;
    border-color: rgba(0, 0, 0, .05);
    }
#menu li, 
#toggle-menu {
    border-width: 0 0 1px;
    margin: 0;
    }
#menu .sub-menu {
    background-color: #333;
    border: 0;
    z-index: 3;
    }
#menu .sub-menu .sub-menu{
    background-color: #333;
    }
#menu .sub-menu li:last-child {
    border-width: 0;
    }
#menu li, 
#toggle-menu, 
#menu a {
    position: relative;
    display: block;
    color: #dfdfdf;
    font-size: 14px;
    font-weight: 600;
    }
#toggle-menu{
    padding: 2.5em 1.5em;
    user-select: none;
    border: 0;
    }
#menu li.current-menu-item > a, #menu li.current-menu-parent > a, #menu li.current-menu-ancestor > a{
    color: #fddd05;
    }
#menu a {
    padding: 1em 1.5em;
    }
#menu a:hover, #menu li:hover{
    background-color: #333;
    }
#menu ul li ul li a:hover{
    background: #222;
    }
#menu .sub-menu {
    display: none;
    }
#menu input[type="checkbox"]:checked ~ .sub-menu {
    display: block;
    }
#menu input[type="checkbox"]:checked + a label{
    color: #333;
    }
#toggle-menu .drop-icon, 
#menu li label.drop-icon {
    position: absolute;
    right: 0;
    top: 0;
    cursor: pointer;
    }
#toggle-menu .drop-icon{
    top: 14px;
    }
#menu label.drop-icon, #toggle-menu span.drop-icon {
    padding: 1em;
    font-size: 1em;
    text-align: center;
    background-color: rgba(0, 0, 0, .125);
    text-shadow: 0 0 0 transparent;
    color: rgba(255, 255, 255, .75);
    }



/* General Containers */
.section{
    padding: 0 1rem;
    }
.grey-bkg{
    background: #F7F7F7;
    }
.container {
  margin: 0 auto;
  width: 100%;
  box-sizing: border-box;
  max-width: 82rem;
  position: relative;
  }
.narrow-page{
    max-width: 55rem;
    }

/* Home Team */
.home-team-wrap{
    background-color: #fddd05;
    }
.home-team {
    padding-top: 120px;
    padding-bottom: 100px;
    text-align: center;
}
.home-team  .team-hero-card {
    margin-bottom: 40px;
    max-width: 100%;
}
.home-team  .team-hero-card .card-inner {
    aspect-ratio: 16 / 9; /* Modern wide-screen look for home page */
    box-shadow: 12px 12px 0px #49A4DB; /* Stronger shadow for the main hero */
}
/* Hover effect for the main image card */
.home-team  .team-hero-card:hover .card-inner {
    box-shadow: 12px 12px 0px #000;
}

/* Home Tournament */
.home-tournament-wrap{
    background: #49A4DB;
    }
.home-tournament {
    padding-top: 120px;
    padding-bottom: 100px;
    text-align: center;
    }
.home-tournament .tournament-hero-card {
    aspect-ratio: auto; /* Modern wide-screen look for home page */
    margin-bottom: 40px;
    max-width: 100%;
}
.home-tournament .tournament-hero-card .card-inner {
    aspect-ratio: auto;
    box-shadow: 12px 12px 0px #fddd05; /* Stronger shadow for the main hero */
}
/* Hover effect for the main image card */
.home-tournament .tournament-hero-card:hover .card-inner {
    box-shadow: 12px 12px 0px #000;
}



/* Btns */
.btn{
    padding: 0.7rem 3.5rem 0.7rem 3.5rem;
    border-radius: 5px;
    display: inline-block;
    }
.btn-light{
    color: #49A4DB;
    cursor: pointer;
    border: 0;
    border: 3px solid #49A4DB;
    }
.btn-light:hover{
    background-color: #FFE400;
    border: 3px solid #FFE400;
    color: #333;
    background-image: repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.25), rgba(255, 255, 255, 0.35) 1px, transparent 1px, transparent 6px), repeating-linear-gradient(-45deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.35) 1px, transparent 1px, transparent 6px);
    background-size: 8px 8px;
    }   
.btn-contrast{
    color: #fff;
    border: 3px solid #fff;
    }   
.btn-contrast:hover{
    background-color: #49A4DB;
    border: 3px solid #49A4DB;
    background-image: repeating-linear-gradient(45deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.15) 1px, transparent 1px, transparent 6px), repeating-linear-gradient(-45deg, rgba(255, 255, 255, 0.15), rgba(255, 255, 255, 0.15) 1px, transparent 1px, transparent 6px);
    background-size: 8px 8px;
    }

/* Hero Heading + Content */
.hero{
    background-size: cover;
    background-position: top;
    padding:  10rem 1rem 10rem 1rem;
    text-align: center;
    color: #fff;
    font-size: 1.5rem;
    position: relative;
    background-position: center;
    }
.hero.has-overlay::before{
    width: 100%;
    height: 100%;
    position: absolute;
    content: "";
    top: 0;
    left: 0;
    background-color: #33333321;
    }
.hero .container{
    z-index: 2;
    }
.hero.no-featured-image{
    padding: 0.5rem;
    }
.has-overlay.hero.no-featured-image::before{
    background-color: #49A4DB;
    }

/* Breadcrumbs */
.breadcrumbs{
    text-align: center;
    color: #49A4DB;
    font-size: 0.85rem;
    padding: 10px 0 10px 0;
    margin-bottom: 50px;
    }



/* Archive Blog */
.list-blog {
    display: flex;
    flex-direction: column;
    gap: 2rem;
    }
.shadow-card.horizontal {
    display: block;
    text-decoration: none;
    }
.shadow-card.horizontal .card-inner {
    display: flex;
    position: relative;
    width: 100%;
    min-height: 200px;
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 8px 8px 0px #49A4DB;
    aspect-ratio: auto;
    }
.news-image {
    width: 30%;
    flex-shrink: 0;
    }
.news-image .card-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: grayscale(40%);
    transition: filter 0.3s ease;
    }
.news-content {
    padding: 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    text-align: left;
    line-height: 140%;
    background-color: #fff;
    }
.news-content h2 {
    margin: 0 0 10px 0;
    color: #49A4DB;
    }
.news-excerpt .news-date{
    font-size: 16px;
    }
.shadow-card.horizontal:hover .card-img {
    filter: grayscale(0%);
    }
.shadow-card.horizontal:hover .news-content h2 {
    color: #000;
    }

/* Mobile Responsive */
@media (max-width: 768px) {
    .shadow-card.horizontal .card-inner {
        flex-direction: column;
    }
    .news-image {
        width: 100%;
    }
}
/* Zigzag: Every second item flips on Desktop */
@media (min-width: 769px) {
    article:nth-child(even) .card-inner {
        flex-direction: row-reverse;
    }
    
    /* Optional: Makes the text align to the right when the image is on the right */
    article:nth-child(even) .news-content {
        text-align: right;
    }
}




Here is the full, standalone CSS for the turnee-list section. This code is designed to keep the posters small, tall, and centered, even if you only have one tournament in the list.

I’ve used box-sizing: border-box and specific max-width controls so the padding and margins don't break the layout.

CSS
/* --- TURNEE LISTING (TALL & SMALL POSTERS) --- */

.turnee-list {
    display: grid;
    /* This creates a flexible grid that fits as many 220px columns as possible */
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 2.5rem;
    justify-content: center; /* Centers the cards if there are only 1 or 2 */
    margin: 40px 0;
}

.turnee-list article {
    width: 100%;
    /* This is the master control for 'Smallness' - adjust this to your liking */
    max-width: 260px; 
    margin: 0 auto;
}

.turnee-list .shadow-card {
    display: block;
    text-decoration: none;
    transition: transform 0.2s ease;
}

.turnee-list .card-inner {
    position: relative;
    width: 100%;
    /* Remove square constraint for tall posters */
    aspect-ratio: auto !important; 
    height: auto;
    overflow: hidden;
    border-radius: 8px;
    background: #fff;
    /* Signature Blue Shadow */
    box-shadow: 8px 8px 0px #49A4DB;
    transition: box-shadow 0.2s ease, background 0.2s ease;
}

.turnee-list .card-img {
    width: 100%;
    height: auto;
    display: block;
    object-fit: cover;
    filter: grayscale(40%);
    transition: filter 0.3s ease;
}

.turnee-list .card-title {
    position: absolute;
    bottom: 0;
    right: 0;
    background: #49A4DB;
    color: #fff;
    padding: 12px 20px;
    text-align: right;
    border-top-left-radius: 10px;
    z-index: 2;
    transition: background 0.2s ease, color 0.2s ease;
}

.turnee-list .card-title h2 {
    margin: 0;
    font-size: 1rem; /* Scaled down for the smaller card size */
    text-transform: uppercase;
    font-weight: 900;
    letter-spacing: 0.5px;
}

/* --- HOVER STATES --- */

.turnee-list .shadow-card:hover {
    transform: translate(-2px, -2px);
}

.turnee-list .shadow-card:hover .card-inner {
    box-shadow: 8px 8px 0px #000;
}

.turnee-list .shadow-card:hover .card-img {
    filter: grayscale(0%);
}

.turnee-list .shadow-card:hover .card-title {
    background: #000;
    color: #fddd05; /* Yellow text on hover */
}

/* --- MOBILE RESPONSIVE --- */

@media (max-width: 600px) {
    .turnee-list {
        /* On mobile, let them be slightly larger for readability */
        grid-template-columns: 1fr;
        gap: 2rem;
    }
    
    .turnee-list article {
        max-width: 300px;
    }
}


/* Layout Logic */
.tournament-grid {
    display: flex;
    gap: 3rem;
    padding-top: 40px;
    align-items: flex-start;
}

.tournament-sidebar {
    flex: 1.4; 
    position: sticky;
    top: 120px;
    z-index: 1;
}

.tournament-news-feed {
    flex: 0.7; 
    display: flex;
    flex-direction: column;
    gap: 2rem; /* Spacing between the news tiles */
}

/* Poster Card (Natural Height) */
.poster-card {
    aspect-ratio: auto !important;
}

/* Force News Tiles to match Antrenori Style */
.tournament-news-feed .card-inner {
    aspect-ratio: 1; /* Keeps them square like the trainers */
    /* Shadow and Radius are inherited from your global .card-inner */
}

/* Reset any horizontal news styles for this specific feed */
.tournament-news-feed article .card-inner {
    display: block; 
}

/* Mobile Fix */
@media (max-width: 768px) {
    .tournament-grid {
        flex-direction: column;
    }
    .tournament-sidebar {
        position: static;
        width: 100%;
        margin-bottom: 40px;
    }
}



/* News Pagination */
.pagination .screen-reader-text{
    display: none;
    }
.news-pagination,
.pagination {
    display: flex;
    justify-content: center;
    margin: 4rem 0 0 0;
    }
.pagination .nav-links {
    display: flex;
    gap: 0.5rem;
    }
.pagination .page-numbers {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 5px 15px 5px 15px;
    border-radius: 20%;
    text-decoration: none;
    font-size: 14px;
    transition: all 0.2s ease;
    }
.pagination a.page-numbers {
    color: #333;
    background: #fff;
    }
.pagination a.page-numbers:hover {
    background: #f5f5f5;
    border-color: #ccc;
    }
.pagination .page-numbers.current {
    background: #111;
    color: #fff;
    border-color: #111;
    font-weight: 600;
    }

.pagination .page-numbers.prev,
.pagination .page-numbers.next {
  font-weight: bold;
}


/* Sub Grid  */
.grid-list {
    display: grid;
    gap: 1rem;
    grid-template-columns: 1fr;
    text-align: center;
    }
.shadow-card {
    display: block;
    text-decoration: none;
    }
.card-inner {
    position: relative;
    width: 100%;
    aspect-ratio: 1;
    overflow: hidden;
    border-radius: 8px;
    box-shadow: 8px 8px 0px #49A4DB; /* Your flat shadow */
    }
.card-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    filter: grayscale(40%); 
    }
.shadow-card:hover .card-img {
    filter: grayscale(0%);
    }
.card-title {
    position: absolute;
    bottom: 0;
    right: 0;
    background: #49A4DB; /* Solid black for that sharp look */
    color: #fff;
    padding: 10px 15px;
    text-align: right;
    border-top-left-radius: 10px;
    padding: 15px 30px 15px 30px;
    }
.card-title h2 {
    margin: 0;
    font-size: 1.5rem;
    font-weight: 900;
    letter-spacing: 0.5px;
    }
.shadow-card:hover .card-inner {
    box-shadow: 8px 8px 0px #000;
    }
.shadow-card:hover .card-title {
    background: #000;
    color: #fddd05;
    }



/* Grid Layout: 2 Columns Desktop, 1 Column Mobile */
.pachete-list {
    display: grid;
    gap: 1.5rem;
    grid-template-columns: repeat(2, 1fr) !important; /* Force 2 columns */
    text-align: center;
}


.pachet-content {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 20px;
    background: #f7f7f7;
    min-height: 130px;
    box-sizing: border-box;
    aspect-ratio: auto;
}

.pachet-content h2 {
    color: #000;
    margin: 0;
    font-size: 1.3rem;
    text-transform: uppercase;
    font-weight: 900;
    letter-spacing: 0.5px;
}
.pachete-list a:hover .pachet-content{
    background: #000;
    }
.pachete-list a:hover .pachet-content h2{
    color: #fddd05;
    }

/* Hover State: Consistent with your other cards */
.pachete-list .shadow-card:hover .card-inner {
    box-shadow: 8px 8px 0px #000;
    background: #49A4DB; /* Turns blue on hover */
}

.pachete-list .shadow-card:hover h2 {
    color: #000; /* Text turns black for contrast */
}

/* Responsive: 1 Column on Mobile */
@media (max-width: 768px) {
    .pachete-list {
        grid-template-columns: 1fr !important;
    }
}
    
/* Inline Post Nav */
.inline-post-nav{
    display: flex;
    justify-content: flex-end;
    width: 100%;
    }
.inline-post-nav div:first-child{
    margin-right: auto;
    }

/* Header Blue Bar */
.header-top{
    background-color: #49A4DB;
    padding: 0.5rem 1rem;
    color: #fff;
    order: -1;
    z-index: 2;
    }
.header-top .container{
    display: flex;
    justify-content: flex-end;
    }
.header-top-contact{
    margin-right: auto;
    font-size: 1.1rem;
    padding: 5px;
    }
.header-top-contact a{
    color: #fff;
    font-size: 26px;
    font-weight: 600;
    }

/* Header Top SM */
.header-top-sm img{
    height: 40px;
    }
.header-top-sm  a{
    margin: 7px 0 0 7px;
    }

/* CSS Sprites */
.bg-sprite{
    display: inline-block;
    }
.bg-sprite span{
    display: none;
    }
.bg-burger-icon {
    width: 25px; height: 18px;
    background: url('../images/css_sprites.png') -250px -175px;
    }

/* Image Grid */
.wp-block-gallery{
    display: grid;
    margin: 3rem 0 3rem 0;
    padding: 0;
    }
.wp-block-gallery figure, figure.wp-block-image{
    margin: 0;
    padding: 0;
    }
.wp-block-gallery a{
    opacity: 0.8;
    }
.wp-block-gallery a:hover{
    opacity: 1;
    }
.wp-block-gallery.columns-3{
    grid-template-columns: 1fr 1fr 1fr;
    gap: 0.5rem;
    }   

/* Home Heading */
.home-heading{
    text-align: center;
    background-color: #000000;
    }
.home-heading h2{
    text-transform: uppercase;
    margin: 0 !important;
    width: auto;
    display: inline-block;
    padding: 45px 5px 45px 5px;
    color: #fddd05;
    width: 100%;
    box-sizing: border-box;
    }
.home-heading p{
    margin: 0;
    }
.hero img{
    max-width: 400px;
    }
/* Home De Ce */
.home-de-ce-grid {
    grid-template-columns: 1fr;
}

/* Home Blog */
.home-blog{
    padding-top: 10rem;
    padding-bottom: 4rem;
    }


/* Antrenor Single */
img.antrenor-portrait{
    width: 90%;
    aspect-ratio: 1;
    object-fit: cover;
    border-radius: 5px; /* Sharp corners */
    box-shadow: 8px 8px 0px #49A4DB; /* The 'Flat' depth look */
    margin: 0 8px 20px 20px;
    }

/* Embeds */
.wp-block-embed{
    margin: 0;
    }
.wp-block-embed .wp-video{
    width: 100% !important;
    }
.wp-block-embed .wp-video video{
    width: 100% !important;
    height: auto !important;
    }
.wp-block-file__embed{
    display: inline-block;
    }
.wp-block-embed-youtube{
	margin: 0 0 30px 0;
	}
.wp-block-embed-youtube div iframe{
	width: 100%;
	height: auto;
	aspect-ratio: 16 / 9;
	}

/* Footer */
footer{
    background-color: #000;
    }   

/* Footer Widgets */
.footer-widgets{
    display: grid;
    gap: 1rem;
    margin-top: 3rem;
    color: #fff;
    text-align: center;
    }
.footer-widgets h2{
    color: #fddd05;
    text-transform: uppercase;
    }
.footer-widgets .footer-logo img{
    text-align: center;
    max-width: 80%;
    }
.footer-menu{
    list-style: none;
    padding: 0;
    line-height: 1.4;
    }   
.footer-menu a{
    font-weight: 300;
    color: #fff;
    }

.footer-sm{
    margin-bottom: 40px;
    }


.footer-credits{
    background-color: #49a4db;
    order: 1;
    justify-content: flex-end;
    padding: 1rem;
    font-size: 1rem;
    color: #e2e2e2;
    text-align: center;
    font-size: 14px;
    }
.footer-credits a{
    text-decoration: underline;
    color: #e2e2e2;
    }

.footer-partners{
    background-color: #49a4db;
    text-align: center;
    padding: 20px 0 20px 0;
    margin-top: 7rem;
    }
.footer-partners a img{
    max-height: 60px;
    opacity: 0.7;
    margin: 20px;
    }
.footer-partners a:hover img{
    opacity: 1;
    }



/* Larger than mobile screen */
@media (min-width: 40.0rem) {
.antrenori-list{
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    }
.jucatori-list{
    grid-template-columns: 1fr 1fr 1fr;
    gap: 2rem;
    }
.pachete-list{
    grid-template-columns: 1fr;
    gap: 2rem;
    }
.home-de-ce-grid{
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 2rem;
    }   
.list-blog{
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
    }
.list-title{
    grid-column-start: 1;
    grid-column-end: 3;
    }
.footer-widgets{
    grid-template-columns: 1fr 1fr 1fr;
    padding-bottom: 30px;
    gap: 2rem;
    }
.header-top-sm{
    display: block;
    white-space: nowrap;
    }
img.antrenor-portrait{
    float: right !important;
    width: 40%;
    }
}

/* Larger than tablet screen */
@media (min-width: 68.0rem) {
#menu .main-menu {
    display: block;
    float: right;
    margin: 0;
  }
  #menu a {
    padding: 2.4em 1.12em;
    }
    #menu ul li ul li a{
    padding: 1.2em 1.5em;
    }
  #toggle-menu, 
  #menu label.drop-icon {
    display: none;
  }
  #menu ul span.drop-icon {
    display: inline-block;
    color: #49A4DB;
  }
  #menu li {
    float: left;
    border-width: 0 1px 0 0;
  }
  #menu li:last-child{
    border: 0;
  }
  #menu .sub-menu li {
    float: none;
  }
  #menu .sub-menu {
    border-width: 0;
    margin: 0;
    position: absolute;
    top: 100%;
    left: 0;
    width: 18em;
    z-index: 3000;
    background-color: #333 !important;
  }
  #menu .sub-menu, 
  #menu input[type="checkbox"]:checked + .sub-menu {
    display: none;
  }
  #menu .sub-menu li {
    border-width: 0 0 1px;
  }
  #menu .sub-menu .sub-menu {
    top: 0;
    left: 100%;
  }
 #menu .sub-menu .drop-icon {
    position: absolute;
    top: 0;
    right: 0;
    padding: 1em;
  }
  #menu li:hover > input[type="checkbox"] + .sub-menu {
    display: block;
  }
  .footer-partners a img{
    max-height: 75px;
    }
}


