.tictactoe{background-color:var(--bg-dark);color:white;margin:var(--gutter) 0;}.tictactoe__title{margin:0 0 40px 0;}.tictactoe__wrap{max-width:var(--max-width);margin:0 auto;padding:var(--gutter);}.tictactoe__content{display:flex;@media (min-width:769px){justify-content:space-between;}@media (max-width:768px){flex-direction:column;align-items:center;}}.tictactoe__dots{@media (min-width:769px){display:grid;grid-template-columns:repeat(3,1fr);gap:35px;}@media (max-width:768px){display:flex;justify-content:center;order:2;gap:10px;margin:60px 0;}@media (min-width:769px) and (max-width:1024px){gap:20px;}}.tictactoe__dot{background-color:#18324F;border:1px solid rgba(255,255,255,0.30);width:110px;aspect-ratio:1/1;border-radius:100%;overflow:hidden;display:flex;align-items:center;justify-content:center;cursor:pointer;box-sizing:border-box;@media (min-width:769px) and (max-width:1024px){width:90px;}@media (max-width:768px){width:18px;border-color:var(--tertiary);background-color:white;}}.tictactoe__dot img{display:block;opacity:0;visibility:hidden;transition:.3s ease-in-out;@media (max-width:768px){display:none;}}.tictactoe__dot--active{@media (max-width:768px){background-color:transparent;}}.tictactoe__dot--active img{opacity:1;visibility:visible;}.tictactoe__items{display:grid;grid-area:main;@media (max-width:768px){text-align:center;}@media (min-width:769px){padding:0 0 0 var(--gutter);}@media (min-width:1301px){padding:0 calc(1.75*var(--gutter)) 0 var(--gutter);}}.tictactoe__item{grid-area:main;opacity:0;visibility:hidden;padding:0 0 0 10px;transition:.5s ease-in-out;}.tictactoe__item--active{opacity:1;visibility:visible;padding:0;}.tictactoe__headline{font:var(--venti);margin:0 0 10px 0;}.tictactoe__headline strong{font:var(--huge);vertical-align:middle;}.tictactoe__body{font:var(--demi);font-weight:400;}.tictactoe__icon{@media (max-width:768px){margin:0 0 20px 0;}@media (min-width:769px){display:none;}}.tictactoe__icon img{width:110px;aspect-ratio:1/1;border-radius:100%;}